Thứ Năm, 14 tháng 7, 2011

Chèn hẳn Form Liên hệ từ kontactr.com vào blog

Sau đây mình hướng dẫn tạo form liên hệ từ trang web kontactr.com
Để chèn form này vào blog, bạn có thể chọn 2 cách:
+ Cách 1: tạo 1 bài viết mới, và dán code của form vào. Và xem bài viết này như 1 trang liên hệ trong blog của bạn.
+ Cách 2: tạo 1 widget HTML/Javascript và dán code của form vào.
+ Cách 3: tạp một trang mới rồi Pate vào
- 1 lưu ý nhỏ: đối với cách 1, khi chèn code vào bài viết, ta phải chỉnh lại việc xuống hàng của code để cho form trông dễ nhìn hơn.
Đây là hình ảnh minh họa mình đưa thẳng nó vào trong bài viết
Bạn có thể Xem Demo
Trước tiên làm được form này bạn phải đăng kí 1 tài khoản ở kontactr.com , các bạn có thể tham khảo cách tạo form từ trang này ở đây.

Sau khi tạo xong, và đã kích hoạt mail, bạn vào trang chủ của nó để đăng nhập. Ở ngay trang vừa đăng nhập xong, bạn sẽ thấy hình như bên dưới:
Chú ý vùng khoanh tròn, đây chính là ID của tài khoản của bạn. Hay lưu nhớ ID này để thực hiện cho các bước sau.
Đối với các bạn đã có tài khoản rồi, thì cũng đăng nhập vào để xem mã số ID của mình.

Và sau đây là code của form liên hệ :
<div id="page">
<div id="content">
<div class="thebox">

<center><span >Contact fandung</span>
<form method="post" action="http://kontactr.com/user.php">
<input name="id" type="hidden" value="24234" />
<input name="referrer" type="hidden" value="" />
<table cellpadding="10px" border="0" >
<tr>
<td align="right">Your Name : </td>
<td align="left"><input name="sender_name" type="text" class="contactform" /></td>
</tr>
<tr>
<td align="right">Your Email : </td>
<td align="left"><input name="sender_email" type="text" class="contactform" /></td>
</tr>
<tr>
<td align="right">Subject : </td>
<td align="left"><input name="subject" type="text" class="contactform" /></td>
</tr>
<tr>
<td align="right" valign="top">Message : </td>
<td align="left"><textarea rows="10" cols="70" name="message" class="contactform"></textarea></td>
</tr>
<tr>
<td align="right" valign="middle">Image (case-sensitive): </td>
<td valign="middle" align="left">

<table cellpadding="5px" border="0" style=" ">
<tr>
<td valign="middle"><img src="http://kontactr.com/captcha.php" /></td>
<td
valign="middle"><input type="text" name="captcha_code" size="5"
maxlength="6" style="font-size: 15px; padding: 3px; font-family: Tahoma,
Verdana; " /></td>
</tr>
</table>

</td>
</tr>
<tr>
<td colspan="2" align="center"><input name="send" type="submit" id="send" value="Send" class="contactform" style="font-size: 18px; width: 100px; letter-spacing: 5px;" /></td>
</tr>
</table>
</form>
</center>

</div>
</div>
</div>

- Có thể thay đổi code màu xanh theo ý bạn.
- Code màu đỏ chính là mã số ID tài khoản của bạn (đã xác định ở trên), hay thay đổi nó lại đúng theo như mã số ID tài khoản của bạn.
- width: 100px; : độ rộng của button "Send"
- rows="10" cols="70" : kích thước của vùng soạn thảo.

- Bạn có thể xem cách tạo khung liên hệ từ trang
Nguồn:Fandung.com

Không có nhận xét nào:

Đăng nhận xét