Tạo mẫu form liên hệ đẹp cho blogspot

Hiện nay bạn muốn tạo một form liên hệ đẹp cho blogspot để có thể người dùng liện hệ hoặc nhắn tin cho bạn về yêu cầu của người dùng, nhưng hiện tại bạn chưa tìm được form liên hệ blogspot ưng ý như ý muốn của bạn, vì thế thủ thuật blogspot sẽ giới thiệu một mẫu form cực kỳ đẹp và bắt mất cho bạn.

Các bạn hãy dừng lại ít phút để xem tienanhvn.com chia sẽ một mẫu form liên hệ mà nhiều người đang dùng, bởi nó sẽ cho bạn được cảm giác thân thiện hơn.
Đây là mẫu form theo mình thấy là chỉ có tại “những blog được tạo ra bởi mình  đang sử dụng nó”. Mẫu form này được thiết kế và sử dụng riêng cho Blogspot, vì vậy nó sẽ không dùng cho các website sử dụng mã nguồn khác đâu nhé.

Mẫu form liên hệ dành cho blogspot 

Cách tạo mẫu form liên hệ trong blogspot
Bước 1. Đăng nhập vào Blogger.com
Bước 2. Chọn vào Trang chọn tạo trang mới.
Bước 3. Chuyển sang chế độ HTML
Bước 4. Coppy đoạn code bên dưới và chỉnh sửa một số thông tin như bên dưới.

<div dir="ltr" style="text-align: left;" trbidi="on">
<div both="" center="" class="”separator”" text-align:="">
<img alt="”Liên" border:="" h="" height="”230″" medium="" none="" src="”https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYfaSuueXYKOU7ppgIANSxHMRXv_aG6KvOTPoCIBXHumx-4ekXpUGqzIO3vGI2zcLeoD8GmJ9eskF14TSfRSn7kchVOnCC_Wj05F28iM2gEWsw3FRmRL-J_xOz-HuTgTnP-5QCU0n65FNg/s1600/lien-he.png”" tienanhvn="" title="”Liên" width="”640″" />
</div>
Tôi sẽ rất vui lòng nếu nhận được sự phản hồi của các bạn. Nếu có gì chưa chính xác, hay nếu muốn đề xuất nội dung được viết trên <a href="https://www.blogger.com/%E2%80%9Dhttps://www.tienanhvn.blogspot.com/%E2%80%9D">tienanhvn.com</a> thì hãy gửi yêu cầu đến tôi. Tôi sẽ cố gắng hỗ trợ các bạn một cách nhanh nhất và tốt nhất. Cảm ơn!
<br />
<form id="”kontak-arlina”" name="”contact-form”">
<input id="”ContactForm1_contact-form-name”" name="”name”" placeholder="”Tên" size="”30″" type="”text”" value="" />
<input id="”ContactForm1_contact-form-email”" name="”email”" placeholder="”Email" size="”30″" type="”text”" value="" />
<textarea cols="”25″" dung="" id="”ContactForm1_contact-form-email-message”" name="”email-message”" placeholder="”Nội" rows="”5″"></textarea>
<input id="”ContactForm1_contact-form-submit”" n="" nh="" tin="" type="”button”" value="”Gửi" />
<br />
<div 100="" center="" text-align:="" width:="">
<div id="”ContactForm1_contact-form-error-message”">
</div>
<div id="”ContactForm1_contact-form-success-message”">
</div>
</div>
</form>
<br />
<ul>
<li>Email: tienanhvn@gmail.com</li>
<li>https://www.tienanhvn.com</li>
<li>Skype: tienanhcntt22</li>
</ul>
<style scoped="””" type="”text/css”">
#comments,
.post_meta,
#blog-pager {
display: none
}


form {
color: #666
}


form.payforpal {
margin: auto;
text-align: center
}


#kontak-arlina {
margin: auto;
max-width: 640px
}


#ContactForm1_contact-form-name,
#ContactForm1_contact-form-email {
display: inline-block;
width: 45%;
height: auto;
background: #fff;
margin: 20px auto;
padding: 15px 12px;
color: #000;
border: 1px solid rgba(0, 0, 0, 0.2);
float: left;
transition: all 0.2s
}


#ContactForm1_contact-form-email {
float: right
}


#ContactForm1_contact-form-email-message {
width: 100%;
height: 175px;
margin: 5px 0 20px 0;
padding: 15px 12px;
background: #fff;
color: #000;
border: 1px solid rgba(0, 0, 0, 0.2);
resize: none;
transition: all 0.3s
}


#kontak-arlina br {
display: none
}


#ContactForm1_contact-form-name:focus,
#ContactForm1_contact-form-email:focus,
#ContactForm1_contact-form-email-message:focus {
outline: none;
background: #fff;
color: #000;
border: 1px solid rgba(0, 0, 0, 0.2);
}


#ContactForm1_contact-form-submit {
float: left;
background: #e74c3c;
color: #fff;
margin: auto;
vertical-align: middle;
cursor: pointer;
padding: 16px 20px;
font-size: 15px;
text-align: center;
letter-spacing: .5px;
border: 0;
width: 100%;
font-weight: 500;
transition: all .2s
}


#ContactForm1_contact-form-submit:hover,
#ContactForm1_contact-form-submit:focus {
background: #c0392b;
color: #fff;
}


#ContactForm1_contact-form-error-message,
#ContactForm1_contact-form-success-message {
width: 100%;
margin-top: 35px
}


.contact-form-error-message-with-border {
background: #f47669;
border: 0;
box-shadow: none;
color: #fff;
padding: 5px 0;
border-radius: 3px
}


.contact-form-success-message {
background: #4fc3f7;
border: 0;
box-shadow: none;
color: #fff;
border-radius: 3px
}


img.contact-form-cross {
line-height: 40px;
margin-left: 5px
}


.post-body input {
width: initial
}


@media only screen and (max-width: 640px) {
#ContactForm1_contact-form-name,
#ContactForm1_contact-form-email,
#ContactForm1_contact-form-submit {
width: 100%;
float: none
}
}
</style>
<script type="”text/javascript”">
//<![CDATA[ if (window.jstiming) window.jstiming.load.tick(‘widgetJsBefore’); //]]>
</script>
<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’] = ‘5996935446171071211‘;BLOG_attachCsiOnload(”); }_WidgetManager._Init(‘//www.blogger.com/rearrange?blogIDx3d5996935446171071211‘,’www.tienanhvn.com’,’5996935446171071211‘); _WidgetManager._RegisterWidget(‘_ContactFormView’, new _WidgetInfo(‘ContactForm1’, ‘footer1’, null, document.getElementById(‘ContactForm1’), {‘contactFormMessageSendingMsg’: ‘Đang gửi…’, ‘contactFormMessageSentMsg’: ‘Tin nhắn của bạn đã được gửi.’, ‘contactFormMessageNotSentMsg’: ‘Tin nhắn của bạn chưa được gửi. Vui lòng thử lại sau.’, ‘contactFormInvalidEmailMsg’: ‘Vui lòng thêm địa chỉ email hợp lệ.’, ‘contactFormEmptyMessageMsg’: ‘Nội dung không được để trống.’, ‘title’: ‘Mẫu liên hệ’, ‘blogId’: ‘5996935446171071211‘, ‘contactFormNameMsg’: ‘Tên’, ‘contactFormEmailMsg’: ‘Email’, ‘contactFormMessageMsg’: ‘Nội dung’, ‘contactFormSendMsg’: ‘Gửi tin nhắn’, ‘submitUrl’: ‘https://www.b</script></div>

Trong đó bạn cần sửa những thông tin sau:

– Đoạn id màu xanh dương:5996935446171071211bạn cần thay lại cho đúng ID của blog của bạn.

– Đường dẫn màu đỏ:www.tienanhvn.com thay lại bằng địa chỉ trang web của bạn.

– Các nội dung liên hệ khác bạn coi tùy chỉnh lại ở trên đoạn code luôn nhé.

Bước 5. Bạn có thể đổi tên liên hệ theo ý muốn của bạn, sau đó lưu lại và xem kết quả nhé.