Code popup lấy thông tin họ tên, email và số điện thoại khách hàng bằng Google Docs

Tất cả mọi người khi phát triển web/blog ai cũng muốn blog của mình được nhiều người quan tâm và thực sự có ích với họ.Bằng nhiều cách như xây dựng nội dung hữu ích, tạo giao diện dễ sử dụng, các gói khuyến mại tri ân…thì việc tạo các tiện ích giúp khách truy cập dễ dàng kết nối với web/blog cũng là một lựa chọn.

Code popup lấy thông tin họ tên, email và số điện thoại khách hàng bằng Google Docs
Code popup lấy thông tin họ tên, email và số điện thoại khách hàng bằng Google Docs

Dưới đây là Code popup lấy thông tin họ tên, email và số điện thoại khách hàng bằng Google Docs có hỗ trợ giao diện Mobile – The popup receives the new post through the email for blogspot giúp bạn thực hiện điều đó.

ƯU ĐIỂM CHỈ HIỂN THỊ ĐÚNG 1 LẦN

Để cài đặt tiện ích này bạn vào bố cục tiến hành thêm một tiện ích HTML/javascript rồi dán đoạn code sau vào và lưu lại, hoặc có thể dán code nằm trên thẻ </body> hoặc /body

<style type='text/css'>
.follow-email {
    float: left;
    width: 100%;
    background: #006600;
    position: relative;
}
.follow-email .left {
    width: 220px;
    float: left;
    background: #004400;
    padding: 10px;
    position: relative;
    z-index: 99;
}
.follow-email .left input {
       line-height: 40px;
    float: left;
    width: 90%;
    margin: 5px 0;
    padding: 0 10px;
    border: 0;
}
.submitbutton{background:#ff0000;color:#fff
}
.follow-email .right {
    float: left;
    position: absolute;
    padding: 20px 20px 20px 270px;
}
.follow-email .right h3 {
    font-size: 28px;
    text-align: center;
    color: #fff;
    border-bottom: 3px dashed #004400;
    padding-bottom: 10px;
    margin-bottom: 10px;
    margin-top: 0px;
}
.follow-email .right ul {
    padding-left: 20px;
    margin: 0;
}
.follow-email .right ul li {
    list-style-type: circle;
    font-size: 18px;
    line-height: 26px;
    color: #fff;
}
#fbox-background {
    display: none;
    background: rgba(0,0,0,0.8);
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
}
#fbox-close {
    width: 100%;
    height: 100%;
}
#fbox-display {
  background: #ff0000;
    border: 5px solid #ff0000;
    width: 700px;
    height: 230px;
    position: absolute;
    top: 33%;
    left: 24%;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
#fbox-button {
    z-index: 99;
    float: right;
    cursor: pointer;
    position: absolute;
    right: 0px;
    top: -1px;
}
#fbox-button:before {
    content: "CLOSE";
    padding: 5px 8px;
    background: #ff0000;
    color: #eaeaea;
    font-weight: bold;
    font-size: 10px;
    font-family: Tahoma;
}
#fbox-link,#fbox-link a.visited,#fbox-link a,#fbox-link a:hover {
    color: #aaaaaa;
    font-size: 9px;
    text-decoration: none;
    text-align: center;
    padding: 5px;
}
@media screen and (max-width:800px){
#fbox-display{max-width:100%;top: 20%;left: 2%;float:none}
}
@media screen and (max-width:640px){
#fbox-display{max-width:100%;top: 20%;left: 0%;float:none;}
.follow-email .right h3{font-size:22px}
.follow-email .right ul li{font-size:14px}
}
@media screen and (max-width:480px){
.follow-email .right{max-width:100%;padding:180px 5px 5px;float:none;text-align:center;position: relative;}
.follow-email .left{background: #006600;width:100%;text-align:center;float:none;margin-top:20px}
.follow-email .left input{width:100%;text-align:center;}
#fbox-display{height:auto}
#fbox-button:before{width:100%;}
svg{display:none}
}
@media screen and (max-width:360px){.follow-email .right{padding-top:150px}}
@media screen and (max-width:240px){.follow-email .right ul li{display:none}}
</style>
<script type='text/javascript'>
//<![CDATA[
jQuery.cookie = function (key, value, options) {
// key and at least value given, set cookie…
if (arguments.length > 1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);
if (value === null || value === undefined) {
options.expires = -1;
}
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}
value = String(value);
return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : ", // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : ",
options.domain ? '; domain=' + options.domain : ",
options.secure ? '; secure' : "
].join("));
}
// key and possibly options given, get cookie…
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_facebook_box') != 'yes'){
$('#fbox-background').delay(5000).fadeIn('medium');
$('#fbox-button, #fbox-close').click(function(){
$('#fbox-background').stop().fadeOut('medium');
});
}
$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 1});
});
</script>
<div id='fbox-background'>
<div id='fbox-close'>
</div>
<div id='fbox-display'>
<div id='fbox-button'>
</div>
<div class='follow-email'>
<div class='left'>
<form action='https://docs.google.com/forms/u/2/d/e/1FAIpQLSdbdFo5rqvOpWY5JA-PVL9vJMyqFfLnmjaDEWmGRs3XYod9iw/formResponse' id='Contact-Form' method='POST' target='hidden_iframe' onsubmit="myFunction()">
<input name='entry.111' onblur='if (this.value == "") {this.value = "Your Name";}' onfocus='if (this.value == "Your Name") {this.value = "";}' type='text' value='Your Name'/>
<input name='entry.111' onblur='if (this.value == "") {this.value = "Your Email";}' onfocus='if (this.value == "Your Email") {this.value = "";}' type='text' value='Your Email'/>
<input name='entry.111' onblur='if (this.value == "") {this.value = "Số Điện Thoại";}' onfocus='if (this.value == "Your Email") {this.value = "";}' type='text' value='Số Điện Thoại'/>
<input name='uri' type='hidden' value='Tdblimag'/>
<input name='loc' type='hidden' value='vi_VN'/>
<input class='submitbutton' type='submit' value='Nhận tin'/>
</form>
</div>
<svg fill='#004400' height='170' style='float: left' width='25'>
<path d='M0 0 L0 170 L25 85 Z'></path>
</svg>
<div class='right'>
<h3>Nhận tin mới qua Email</h3>
<ul>
<li>Cập nhật tin tức hoàn toàn miễn phí qua Email</li>
<li>Đảm bảo an toàn thông tin của bạn</li>
<li>Tuyệt đối không spam</li>
</ul>
</div>
</div>
</div>
</div>

Sau đó cấu hình forms google docs như video bên dưới để được thông báo qua mail  nhé

2 Comments

  1. Tambehanoi 26 Tháng Hai, 2020 Reply
    • Đỗ Mạnh Hồng 21 Tháng Ba, 2020 Reply

Leave a Reply

Hotline: 0967 84 99 34
Chat zalo
Gọi điện ngay