Hướng dẫn tạo from liên hệ cho blogspot miễn phí
Đầu tiên để sử dụng form liên hệ này bạn chỉ cần đăng nhập Blogger > Bố cục > Thêm tiện ích > Tiện ích khác > Biểu mẫu liên hệ: (Xem hình minh họa bên dưới)
|
Cài đặt form liên hệ trên blogspot |
|
Tiện ích Form liên hệ trên Blogger |
|
Lưu form liên hệ trên blogspot |
Sau khi lưu lại, nhớ kéo và thả vào vị trí bạn muốn rồi chọn Lưu sắp xếp.
Nếu muốn đặt nó vào phần trang của Blogger thì bạn làm theo gợi ý tiếp theo.
Các bước thực hiện tạo form liên hệ cho blogspot
Bước 1. Giữ nguyên mẫu form liên hệ mà bạn vừa tạo lúc nãy và tiếp tục các bước đễ lôi
form liên hệ cho blogspot ra trang page mà bạn muốn.
Bước 2. Nhấn Mẫu > Chỉnh sửa HTML để chỉnh sữa lại theme cho hợp lý
|
Hướng dẫn cài form liên hệ cho blogspot |
Bước 3. Bạn Nhấp Chuyển đến tiện ích > ContactForm1 đế đến dòng cần chỉnh sữa
|
Chỉnh sữa form liên hệ cho blogger |
Bước 4. Nhấp chuột vào mũi tên phía đầu dòng tiện ích có id='ContactForm1' như hình
|
Form liên hệ cho blogspot |
Bước 5. Xóa hết đoạn code mặc định bên trong nó, như bạn nhìn thấy dưới đây, còn lại như hình và sau đó Lưu mẫu.
|
Code liên hệ cho blogspot |
Bước 6. Tạo trang chứa
form liên hệ trên blogspot/blogger: Thêm trang mới. Nhấn Trang > Trang mới > Trang trống để tạo. Nếu bạn đã có trang liên hệ rồi thì không cần tạo nữa..
|
Trang form liên hệ cho blogspot |
Bước 7. Chọn chế độ soạn HTML rồi dán đoạn code này vào chỗ viết bài, sửa lại một số tùy chọn và đặt tên bài viết rồi nhấn Xuất bản.
<form name="contact-form">
<p></p>
Name
<br>
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" value="" type="text">
<p></p>
Email
<span style="font-weight: bolder;">*</span>
<br>
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" value="" type="text">
<p></p>
Message
<span style="font-weight: bolder;">*</span>
<br>
<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
<p></p>
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" value="Send" type="button">
<p></p>
<div style="text-align: center; max-width: 222px; width: 100%">
<p class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></p>
<p class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></p>
</div>
</form>
Nếu cần thiết bạn có thể Việt hóa những chữ màu nổi bật: Name -> Tên; Message -> Lời nhắn (Thông điệp).
Download Code
Để điều chỉnh kích thước bạn cần chèn thêm đoạn CSS sau đây phía trên thẻ ]]></b:skin>
.contact-form-name,.contact-form-email {
max-width: 200px;
width: 100%;
}
.contact-form-email-message {
max-width: 500px;
width: 100%;
height: 200px;
}
Có thể điều chỉnh kích thước trên cho cân đối với kích thước phần bài viết của blog.
Như vậy bạn đã có form riêng hệ của riêng mình. Email mà bạn nhận được như hình dưới đây:
|
Tạo form liên hệ cho blogspot thành công |
Chiến Lược Mới chúc bạn thành công!
Comments[ 0 ]
Đăng nhận xét