Huỳnh Hoài Bảo - Bảo Shady Blog
Xin chào mọi người, hôm nay mình rảnh và cũng chả bận gì nhiều nên muốn đăng bài này chia sẻ cho các bạn một cách tạo biểu mẫu liên hệ cực đẹp cho blogspot của các bạn !
Demo

CÁC BƯỚC THỰC HIỆN

Bước 1: Các bạn đăng nhập Blogger Tạo Trang mới 
Bước 2: Đặt tên cho trang đó theo ý thích của bạn. (Ví dụ: Biểu mẫu liên hệ, Contact Form, liên hệ Admin,...)
Bước 3: Các bạn dán đoạn code này vào trang các bạn vừa mới tạo. (HTML)
<form name="contact-form">
Name<br /><input id="ContactForm1_contact-form-name" name="name" size="30" type="text" value=""/><br/><br/>Email Address <span class="wajib">*</span><br/><input id="ContactForm1_contact-form-email" name="email" size="30" type="text" value=""/><br/><br/>Nội dung <span class="wajib">*</span><br/>
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea><br/>
<input id="ContactForm1_contact-form-submit" type="button" value="Gửi ngay cho tôi"/><br/>
<div class="formb"><div id="ContactForm1_contact-form-error-message"></div><div id="ContactForm1_contact-form-success-message"></div>
</div></form><script src="https://www.blogger.com/static/v1/widgets/2271878333-widgets.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = '94525206769855746';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d94525206769855746','//baoshady.blogspot.com/','94525206769855746');
_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': '94525206769855746', 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
//]]>
</script>
<style type="text/css">
#ContactForm1{display:none}a.showcontent{display:none}#ContactForm1_contact-form-name,#ContactForm1_contact-form-email{
width:300px;height:auto;margin:5px auto;padding:10px;background:#fff;color:#666;border:1px solid #ddd;transition:all 0.5s ease-in-out;box-shadow:none;}
#ContactForm1_contact-form-email-message{width:450px;height:175px;margin:5px 0;padding:10px;background:#fff;color:#666;font-family:'Droid Sans',sans-serif;border:1px solid #ddd;transition:all 0.5s ease-in-out;box-shadow:none;}
#ContactForm1_contact-form-name:focus, #ContactForm1_contact-form-email:focus, #ContactForm1_contact-form-email-message:focus{outline:none; border-color: rgba(81,203,238,1);box-shadow: 0 0 5px rgba(81,203,238,0.7)!important;color:#444;background:#fff;}
#ContactForm1_contact-form-submit {font-family:Open Sans Condensed, sans-serif;float:left;border-radius:3px;
background:#07ACEC;color:#fff;margin:10px auto;vertical-align:middle;cursor:pointer;
padding:5px 10px!important;font-weight:700;font-size:15px;text-align:center;text-transform:uppercase;letter-spacing:0.5px;transition:all 0.4s ease-out;}
#ContactForm1_contact-form-submit:hover {background:#444;}#ContactForm1_contact-form-error-message, #ContactForm1_contact-form-success-message{
width:450px;margin-top:35px;}.formb{max-width:22px;text-align:center;width:100%}.wajib{color:red;font-weight:bold}
</style>
Bước 4: Lưu Lại ( Xuất Bản )
- Dưới đây là hình ảnh minh họa của mình nhé ! 
- Có nhiều bạn cũng thắc mắc là nó sẽ gửi tin nhắn đó về đâu ?
- Sau khi khách truy cập website bạn liên hệ mẫu này thì tin nhắn đó sẽ về thư của Quản Trị Viên Blogger nhé !

lời kết

Bên trên là các bước để tạo biểu mẫu liên hệ cực đẹp cho blogspot rồi. Nếu thấy bài viết bổ ích đừng quên cho mình 1 share & 1 comment nhé. Nếu bạn nào không làm được thì đừng ngại comment xuống phía dưới để mình hỗ trợ nha.
Nguồn : Tính Getter
32 nhận xét:
  1. Anh ơi bữa trước anh nói đăng bài share temp này mà sao anh chưa đăng

    Trả lờiXóa
    Trả lời
    1. Chuẩn bị anh đăng đây tại anh quên :v

      Xóa
    2. Thế bao giờ đăng ạ .... em chờ 2 ngày rồi á @@

      Xóa
    3. Khi blogger đạt 100k Lượt xem nhé em ! ;)

      Xóa
    4. Chắc là share template các kiểu :v

      Xóa
    5. bác nghĩ em vậy hả =))

      Xóa
  2. Trả lời
    1. Quên coppy cái Thumbnail hehe ok ok để ghi nguồn :v

      Xóa
    2. Ghi nguồn rồi nha :v

      Xóa
  3. bác bảo cho làm CTV vs đê

    Trả lờiXóa
  4. :v bài viết rất hữu ích :v

    Trả lờiXóa
  5. - bài viết hữu ích đấy bác

    Trả lờiXóa
    Trả lời
    1. Cảm ơn Thanh Phú tương tác lại rồi à :v

      Xóa
  6. Chỉnh cái emoticon lại cho nhỏ tí đi Bảo :v Hơi to

    Trả lờiXóa
  7. Trả lời
    1. Ông gửi mail nào nhiều mail quá k nhớ

      Xóa
    2. thôi không cần nữa đâu

      Xóa
  8. cái này em phải sửa lại chứ. nhìn code trên thấy id này nọ còn id blog em, rồi còn url là baoshady nữa :v

    Trả lờiXóa
  9. Temp đẹp :3 temp này dựa trên bộ khung BSW có sẵn r cải tiến đúng ko Bảo?

    Trả lờiXóa
1. Chèn ảnh: [img]Link ảnh[/img]
2. Chèn video: [youtube]ID Video[/youtube]
Hướng dẫn lấy ID Video từ Youtube

Ví dụ video có link trực tiếp: https://www.youtube.com/watch?v=BUaLnDL3f-M, ta sẽ lấy BUaLnDL3f-M và thay vào vị trí ID Video ở cú pháp trên.

Nội quy chung Bảo Shady Blog

1. Bài viết đều tự tay tác giả viết nên nếu có ý định copy xin hãy ghi nguồn bài viết đó.
2. Template được lên ý tưởng và thiết kế bởi Phú Cường Blogger vì vậy tuyệt đối không tự ý RIP Template hoặc lấy và dùng từ những nguồn ăn cắp khác khi tác giả chưa share công khai. Nếu tôn trọng mình thì bạn có thể trao đổi mua template tại fb Nguyễn Phú Cường.
3. Không được spam dưới mọi hình thức và đưa ra những bình luận xúc phạm đến danh dự và nhân phẩm của người khác (những bình luận vi phạm sẽ bị xóa).

Đang cập nhật thêm nội quy...

- Blog: Bảo Shady Blog - Life Is Share
- Thành lập: 01/08/2017
- Nội dung: Blog chủ yếu viết về những thủ thuật blog, và các thủ thuật khác. Ngoài ra, blog thi thoảng còn chia sẻ một vài bài viết về đời sống, share ảnh đẹp, tin tức về đời sống...
- Tác giả blog: Huỳnh Hoài Bảo hiện đang là học sinh cấp 2 THCS Lê Thị Cẩm Lệ, Bạc Liêu.
- Template: Twitter Template Version 1.0 By Phú Cường Blogger.

Lời cuối chúc các bạn có những phút giây thật vui vẻ và ý nghĩa tại blog nhé!