Hướng Dẫn Tạo Form Liên Hệ Cho Blogspot Cực Đẹp

Chào các bạn, hôm nay NGUYỄN NGỌC QUÍ ĐZ share code form liên hệ blogger cho cái bạn, code này rất tiện lợi và dễ hiểu

CÁCH THỰC HIỆN

Đăng nhập vào Blogger - Chọn - Trang - Trang Mới - chỉnh sang chế độ HTML
Coppy tất cả đoạn code dưới đây và dán ra

<style scoped="scoped" type="text/css">
.contact-form-box{width:50%;margin:20px auto;padding:0;}
#ContactForm1_contact-form-name, #ContactForm1_contact-form-email{width: 70%;height:auto;margin: 5px auto 15px;padding: 10px;background: #ebebeb;border: 1px solid #ccc;color:#777;border-radius:3px;box-shadow: 0px 4px 0px 0px #c7c5c7;}
#ContactForm1_contact-form-name:focus, #ContactForm1_contact-form-email:focus, #ContactForm1_contact-form-email-message:focus{background: #fffff7;outline:none}
#ContactForm1_contact-form-email-message{width: 95%;height: 100px;margin: 5px auto;padding: 10px;background: #ebebeb;border: 1px solid #ccc;color:#777;font-family:Arial, sans-serif;border-radius:3px;box-shadow: 0px 4px 0px 0px #c7c5c7;}
#ContactForm1_contact-form-submit {display:block;height: 35px;float: left;color: #FFF;padding: 0 20px;margin: 10px 0 5px 0;cursor: pointer;background-color:#f4836a;box-shadow: 0px 4px 0px 0px #c75b45;border:1px solid #eb7d67;border-radius:3px;text-shadow:0px 1px 0px #de5135;} #ContactForm1_contact-form-submit:hover {background-color:#f5785f;}
#ContactForm1_contact-form-submit:active {position:relative;top:2px;box-shadow: 0px 2px 0px 0px #c75b45;}
#ContactForm1_contact-form-submit:focus{outline:none}
#ContactForm1_contact-form-error-message, #ContactForm1_contact-form-success-message{width: 100%;margin-top:35px;text-align:left}
@media screen and (max-width: 768px){ .contact-form-box{width:100%;}
#ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-email-message{width: 96%;}
}
@media screen and (max-width: 480px){ #ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-email-message{width: 94%;}
}
</style>
<div class="contact-form-box">
<form name="contact-form">
<input id="ContactForm1_contact-form-name" name="name" placeholder="Họ và 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" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="Nhập nội dung" rows="5"></textarea>
<span class="send-bg"><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Gửi Admin" /></span>
<span class="clear-bg"><input class="contact-form-button contact-form-button-submit clear-button" type="reset" value="Xóa nội dung" /></span></form>
<div style="max-width: 222px; text-align: center; width: 100%;">
<div id="ContactForm1_contact-form-error-message">
</div>
<div id="ContactForm1_contact-form-success-message">
</div>
</div>
</div>
<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'] = '5684588790394034249';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x5684588790394034249','//www.kompiajaib.com/','5684588790394034249'); _WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': 'Đang gửi cho admin...', 'contactFormMessageSentMsg': 'Đã gửi, Admin sẽ trả lời theo Email bạn cung cấp.',
'contactFormMessageNotSentMsg': 'Message could not be sent. Please try again later.',
'contactFormInvalidEmailMsg': 'Email không hợp lệ.',
'contactFormEmptyMessageMsg': 'Message field cannot be empty.', 'title':
'Contact Form', 'blogId': '5684588790394034249', 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message',
'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull')); //]]> </script>

- Dán ID Blog của các bạn vào số đã được in đậm

ẢNH MINH HỌA

LỜI KẾT

Chúc các bạn thành công!

Đăng kí kênh hộ mình: tại đây

N

0

Chia sẻ

• Nhận liên kết

Nguyễn Phú Cường

Cuộc sống đôi lúc không như chúng ta mong muốn nhưng đừng buồn, đừng suy nghĩ nhiều quá mà hãy tiếp tục đứng lên và chiến đấu tiếp vì tương lai của chính mình nhé!