Widget Liên Hệ Cực Đẹp Trên Trang Tĩnh Dành Cho Blogger


Blogger đã có một widget mang tên Contact Form nhưng có một số người đôi khi không thích và thoải mái lắm khi đặt một số liên lạc trên blog, vì vậy tiện ích con này là một lựa chọn thay thế để họ đưa lên blog.

Với widget này, người dùng có nhu cầu liên hệ cả để hợp tác, quảng cáo, viết bài đánh giá,… sẽ dễ dàng hơn vì tin nhắn gửi đi sẽ tự động chuyển đến email.

Demo Liên Hệ


Thêm Widget

Đầu tiên các bạn cần tạo một trang tĩnh mới (Page) và hãy lưu ý đến url của trang đó tìm và copy dòng ID của trang thường nó sẽ có định dạng như sau

https://www.blogger.com/blogger.g?blogID=1234567890000000000#editor/target=page;pageID=xxxx

Trong đó 1234567890000000000 là ID của bạn, bạn hãy lưu lại để xíu nữa còn sài

Tiếp sau đó sao chép tất cả mã bên dưới vào trình soạn thảo văn bản, đảm bảo bạn chọn chế độ HTML khi sao chép vào trình soạn thảo văn bản

<div class='ContactForm'>
  <form name='contact-form'>
    <div class='input-area'>
      <label for='ContactForm1_contact-form-name'>Tên</label><input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' type='text' value='' /></div>
    <div class='input-area'>
      <label for='ContactForm1_contact-form-email'>Email<span>*</span></label><input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' type='text' value='' /></div>
    <div class='input-area'>
      <label for='ContactForm1_contact-form-email-message'>Nội Dung<span>*</span></label><textarea class='contact-form-email-message' id='ContactForm1_contact-form-email-message' name='email-message'></textarea></div>
    <div class='input-area'>
      <input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Gửi' /></div>
    <div class='notif-area'>
      <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>
</div>
<script src='https://www.blogger.com/static/v1/widgets/2271878333-widgets.js'></script><script>//<![CDATA[
if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = '1234567890000000000';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d1234567890000000000','//www.quangsangit.com/','1234567890000000000');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': 'Sending...', 'contactFormMessageSentMsg': 'Your message has been sent.', 'contactFormMessageNotSentMsg': 'Message could not be sent. Please try again later.', 'contactFormInvalidEmailMsg': 'A valid email address is required.', 'contactFormEmptyMessageMsg': 'Message field cannot be empty.', 'title': 'Contact Form', 'blogId': '1234567890000000000', 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull')); //]]></script>



Thay thế một số dữ liệu bằng dữ liệu của bạn


1234567890000000000: Id Blog của bạn, có 4 lần viết mã trên
www.quangsangit.com: Địa chỉ blog của bạn (không có http / https)

Nhấp vào nút xuất bản và kiểm tra xem tiện ích có hoạt động bình thường hay không, nếu phương pháp được thực hiện đúng thì tiện ích sẽ hoạt động bình thường.

Lưu ý: Trong khi tiện ích Biểu mẫu liên hệ không hoạt động trên miền blogspot.com, nguyên nhân của lỗi này vẫn chưa được biết. Nhưng tiện ích này vẫn hoạt động tốt trên các blog đã sử dụng miền tùy chỉnh (.com, .net, v.v.) .