Một tiện ích hay có thể dễ dàng thêm truy cập cho blog của bạn bằng cách tự động gửi bài viết mới nhất của bạn vào email mà độc giả đăng kí.



HƯỚNG DẪN:

Bước 1: Đăng nhập Blogger > Mẫu > Chỉnh sửa HTML
Bước 2: Tìm đến thẻ ]]></b:skin> hoặc thẻ đóng </style> và chèn đoạn code sau lên trên nó và Lưu Mẫu

/* Subscribe Box */
#thinhnd-subscribe{background-color:#2A3744;margin:20px 0 0 0;padding:20px;overflow:hidden}
#thinhnd-subscribe h4{color:#827459;font-size:16px;margin-bottom:20px;text-align:center;text-transform:uppercase}
#thinhnd-subscribe .emailfield{margin:auto;text-align:center;}
#thinhnd-subscribe .emailfield form {margin:0;}
#thinhnd-subscribe .emailfield input{padding:10px;color:#bcc4ca;border:1px solid #03A9F4;font-size:13px;margin-bottom:10px}
#thinhnd-subscribe .emailfield input:focus{color:#454545;outline:none;border-color:#d5bc88;}
#thinhnd-subscribe .emailfield .submitbutton{background-color:#03A9F4;color:#fff;margin:0;font-size:13px;letter-spacing:.7px;text-transform:uppercase;cursor:pointer;border:0;transition:all .3s}
#thinhnd-subscribe .emailfield .submitbutton:active,#thinhnd-subscribe .emailfield .submitbutton:hover{background-color:#e0594f;color:#fff;}

Bước 3: Chèn đoạn code sau vào chỗ bạn muốn Khung Subscribe Box hiển thị

<div id="thinhnd-subscribe">
<h5 style="text-align: center;">
<span style="color: white; font-family: Arial, Helvetica, sans-serif; font-size: large;">THEO DÕI BLOG QUA EMAIL</span></h5>
<div style="text-align: center;">
<span style="color: white; font-family: Arial, Helvetica, sans-serif;">Xác nhận email để hoàn tất đăng kí !</span>
<br/>
<br/>
<div class="emailfield">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=ThinhNd', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Nhập email của bạn...&quot;;}" onfocus="if (this.value == &quot;Nhập email của bạn...&quot;) {this.value = &quot;&quot;;}" type="text" value="Nhập email của bạn..." />
<input name="uri" type="hidden" value="ThinhNd" />
<input name="loc" type="hidden" value="vi_VN" />
<input class="submitbutton" type="submit" value="Đăng Kí" />
</form>
</div>
</div>
<div style="clear: both;">
</div></div>

Thay ThinhNd (chữ in đậm, màu đỏ) thành url feedburner của bạn

Bạn có thể xem hướng dẫn cách  lấy url feedburner cho Blogspot/Blogger tại bài viết: Tạo hộp Theo dõi qua Email cho Blogspot

LỜI KẾT

Trên đây là 3 bước tạo Khung Subscribe Box cực đẹp cho Blogspot giống Thịnh ND đang sử dụng. Chúc bạn thành công. Xin cảm ơn!

Tạo hộp Theo dõi qua Email cho Blogspot
Hôm nay, Thịnh ND xin chia sẻ cho các bạn hộp theo dõi qua Email cho Blogspot cực đẹp. Nó có thể dễ dàng thêm truy cập cho blog của bạn bằng cách tự động gửi bài viết mới nhất của bạn vào email mà độc giả đăng kí.









HƯỚNG DẪN

Bước 1: Đăng Nhập Blogger > Bố Cục > Thêm Tiện ích > Theo dõi qua Email
Bước 2: Copy đoạn sau http://feeds.feedburner.com/ giống mình gạch chân trong ảnh dưới

Mục đích của 2 bước trên là để lấy url feedburner cho Blogspot/Blogger
Bước 3: Tiếp tục vào Bố Cục > Thêm Tiện ích > HTML/Javascript và dán đoạn code sau vào

<div class="nd-follow">
<style>
.nd-follow {width:300px; height:250px; background:#2A3744; margin:5px auto; font-size:13px; color:#d1d1d1; text-align:center; padding:10px; }
.nd-follow b {font:bold 24px helvetica; color:#fff; float:left; width:inherit; text-align:center; padding:20px 0; }
.nd-follow form {width:250px; margin:0 auto;}
</style>
<b>THEO DÕI QUA EMAIL</b><br />
Đăng kí theo dõi blog để cập nhật những bài viết mới nhất vào hòm thư của mình!<br />
<br />
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=ThinhNd', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input nd-followe="email" placeholder="Email của bạn..." style="border: 1px solid #fff; box-sizing: border-box; padding: 9px 5px; width: inherit;" type="text" />
<input nd-followe="uri" type="hidden" value="ThinhNd" />
<input nd-followe="loc" type="hidden" value="vi_VI" />
<input class="button" style="background: #03A9F4; border: none; color: white; font-size: 18px; font-weight: bold; margin: 10px auto; padding: 9px 5px; width: inherit;" type="submit" value="ĐĂNG KÝ NGAY" />
</form>
</div>

Thay ThinhNd thành đoạn bạn vừa sao chép ở bước 2
Bước 4: Bấm Lưu và kiểm tra

Lời Kết

Chúc bạn thành công nhé. Mọi thắc mắc vui lòng comment ở bên dưới, mình giúp bạn trong thời gian sớm nhất. Xin cảm ơn bạn đã quan tâm theo dõi