Tạo contact form kiểu popup

Hộp Contact là một phần quan trọng trong blog, nó giúp độc giả gửi tới cho bạn những ý kiến đóng góp bổ ích, tuy nhiên chúng ta thường đặt khung này ở một trang nào đó nên không mấy thuận tiện. Hôm nay, mình xin giới thiệu một mẫu contact form với hiệu ứng popup. Khung này sẽ hiện lên khi bạn click vào nút Contact đặt ở sidebar.

DEMO

#Thêm contact form blogger

1. Đăng nhập Blogger
2. > Bố cục > Thêm tiện ích > Tiện ích khác > Biểu mẫu liên hệ
3. > Save

#Thêm scrip popup

1. > Thêm tiện ích > HTML/Javascrip
2. > Dán code dưới vào
3. > Save

<style>
#ContactForm1
{
display: none ! important;
}
</style>
<link rel="stylesheet" href="http://demo.tricksway.com/modal1/reveal.css" /> <!– attach necessary scripts –>
<script type="text/javascript" src="https://himstar.googlecode.com/files/jquery.reveal.js"></script>
<a href="#" class="big-link" data-reveal-id="myModal" data-animation="fade">
<b>Contact Me</b>
</a>
<div id="myModal" class="reveal-modal">
<div dir="ltr" style="text-align: left;" trbidi="on">
<form name="contact-form">
<div>
Your Name : </div>
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30″ type="text" value="" />
<div>
Your Email: <em>(required)</em></div>
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30″ type="text" value="" />
<div>
Your Message: <em>(required)</em></div>
</form></div></div></!–>