Code Popup nhận tin bài qua Email xuất hiện 1 lần hỗ trợ giao diện Mobile cho Blogspot

DEMO

$ads={1}

<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: 180px;
    position: absolute;
    top: 33%;
    left: 15%;
    -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://feedburner.google.com/fb/a/mailverify?uri=Tdblimag' method='post' onsubmit='window.open(&#39;https://feedburner.google.com/fb/a/mailverify?uri=Tdblimag, &#39;popupwindow&#39;, &#39;scrollbars=yes,width=550,height=520&#39;);return true' target='popupwindow'>
<input name='name' onblur='if (this.value == "") {this.value = "Your Name";}' onfocus='if (this.value == "Your Name") {this.value = "";}' type='text' value='Your Name'/>
<input name='email' onblur='if (this.value == "") {this.value = "Your Email";}' onfocus='if (this.value == "Your Email") {this.value = "";}' type='text' value='Your Email'/>
<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>

Việc cần làm tiếp theo là thay Your FeedBurner feed vào uri trong fom email tại thông số bôi màu vàng chanh.
Để lấy Your FeedBurner feed bạn vào bố cục thêm một tiện ích theo dõi qua Email và thông số khoanh đỏ chính là Your FeedBurner feed blog của bạn.Chỉ copy thông số feed chứ không cần lưu(hoàn thành) tiện ích.
Hoặc bạn cũng có thể lấy thông số này tại feedbuner.

Chúc bạn cài đặt thành công.