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 đó.
Để 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>