Tạo Widget đăng ký nhận bản tin qua email trong blogger

Sau bài viết trước, tôi đã giới thiệu về tiện ích đầu tiên đó là bài "Tăng truy cập Blog từ mạng xã hội bằng Socializer Widget " và ở trong bài biết này, tôi sẽ giới thiệu tiếp về widget thứ hai mà chắc chắn mọi người sẽ thích nó. Bạn có thấy không, Socializer Widget là tiện ích hoàn toàn độc đáo và có tác dụng tuyệt vời với thiết kế tuyệt đẹp gây thiện cảm với đọc giả. Trong blog nếu bạn tích hợp Socializer Widget vào đúng vị trí tối ưu sao cho phù hợp với trang thì sẽ nhận được rất nhiều chia sẽ hay like trên bài viết. 

Nhưng với bài này bạn sẽ tìm hiểu công cụ thứ hai đó là công cụ “Widget đăng ký nhận bản tin qua email” công cụ này có công dụng không hề thua kém so với Socializer Widget, nó được thiết kế nhỏ gọn, bắt mắt. Và điều quan trọng hơn là công cụ này sẽ giúp website tăng số lượng các thuê bao email. Email thuê bao đóng vai trò quan trọng đối với một blog. Nó giúp blog tăng số lượng điểm tin và thu hút lượng người đọc hàng ngày. Không dừng lại ở đó, công cụ này còn tạo ra số lượng giao thông một cách thụ động. Vì sao lại tạo giao thông thụ động?Bởi vì khi một người đã đăng ký nhận bài viết qua email, tức là họ có thể nhận với một số lượng lớn các bài viết đó mà họ chưa đọc, có thể họ sẽ đọc nó trong tương lai.

           Đọc thêm:        Làm thế nào để thay đổi Fonts trong blogger

Widget đăng ký nhận bản tin qua email nó là cái gì

Đây là một widget trong sạch, có thiết kế đơn giản, hấp dẫn và rất rõ ràng. Nó sẽ giúp chủ blog xây dựng danh sách các địa chỉ email đăng ký nhận bản tin. Widget này được xây dựng chỉ với hai ngôn ngữ lập trình là CSS3 và HTML. Widget này thông dụng cho mọi trình duyệt, nó được kiểm tra chặt chẽ và thấy rằng nó hoạt động tốt trong các trình duyệt như: Chrome, FireFox, Opera, Satafy...Giao diện thiết kế của nó bao gồm một tiêu đề trên đầu trang, một đoạn mô tả ngắn và một biểu tượng thông báo cho người đăng ký những gì họ sẽ nhận được qua email. Và một dòng nhỏ phía dưới chân email để nhắc nhở với đọc giả một thông điệp rằng: “Đây không phải là thư rác, bạn nhận được thư này bởi vì bạn đăng ký nhận bản tin qua email trên trang chủ https://webblog247.blogspot.com". Nếu bạn thấy phiền hoặc không muốn nhận thông tin từ trang này, hãy ấn vào đây để hủy đăng ký ”. Widget này có chiều rộng 500 pixel. Vì vậy, nơi tốt nhất để thêm widget này là dưới cùng mỗi bài viết. Ở đây bạn có nhiều cơ hội nhận được nhiều người đăng ký mới, khi họ đọc xong bài viết của bạn và cảm thấy hay.

Làm sao để cài đặt Widget đăng ký nhận bản tin qua email cho blogger? Hãy làm theo hướng dẫn của tôi dưới đây.

• Đăng nhập vào Blogger

• Ấn vào Mẫu  và sau đó ấn vào Chỉnh sửa HTML

• Xuất hiện một bảng HTML, Kích chuột ở bất kỳ đâu trong hộp thoại HTML và ấn tổ hợp phím Ctrl+F, xuất hiện ô tìm kiếm.

• Sau đó nhập vào ô tìm kiếm đoạn mã màu đỏ sau:

 <data:post.body/> 

• Dán đoạn mã dài loằng ngoằng phía dưới vào dưới chân đoạn mã màu đỏ phía trên.

Code để dán vào:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- Đăng ký nhận bản tin của Weblog247.info -->
 background:#fff
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbBhFsilYBGw1gKdY0dBjsYx1oQZAYRdye6geVvcudiobCJaw7ZS38fUOEnsANH17eXQIrOjq_wovixafIJoIZEjSn59NBdzH8Fa1VEAfqffd45JRt8HYC_x-nRyD5R98kQT1KTsSGWmYT/s1600/name1.png)
no-repeat 7px 8px;
 background:#fff
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiNXdoOSTfnrmCNJma67i4zLYvqjQmY8ghya1Sd3Qo7YNwbym2-dzkLkMkk8kUzLt7AHmRMPbehUl1qZasDqq5KdYD863qaZEXAS7VfqAmpNvS_719sK9bs_gR67ChCzH6qFOq7vK6mXTw/s1600/2.png)
no-repeat 7px 10px;
.weblog-subsbox-name:hover,.weblog-subsbox-email:hover
{
 -webkit-box-shadow:inset 0px 1px 0px 0px
#ffffff;
 background:-webkit-gradient( linear,left
top,left bottom,color-stop(0.05,#ededed),color-stop(1,#dfdfdf) );
 background:-moz-linear-gradient( center
top,#ededed 5%,#dfdfdf 100% );
 background:-webkit-gradient( linear,left
top,left bottom,color-stop(0.05,#dfdfdf),color-stop(1,#ededed) );
 background:-moz-linear-gradient( center
top,#dfdfdf 5%,#ededed 100% );
    <link
href='http://fonts.googleapis.com/css?family=Marmelad' rel='stylesheet'
type='text/css'/>
    <link
href='http://fonts.googleapis.com/css?family=Merienda' rel='stylesheet'
type='text/css'/>
 <a href='http://www.weblog247.info'><img
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9kDFk_6yuwT_9N8q0E8AumHCIDailaohQ5jJSSk8YBUD8Rl1vPOKk6pvm6EprI7XzDC40wvdNK93uVsp93HctirgEpJKUI8EySkuwCJ0BnCsceOP_n29RRzoLwc3QzWnR9lOiSjdqb9FC/s1600/3.png'
style='float:left;'/></a>
  Đăng ký ngay để nhận các Hướng dẫn miễn phí
về công cụ tìm kiếm, Tối ưu hóa blog hướng dẫn, và nhiều hơn nữa. 100% Miễn phí!
 <form
action='http://feedburner.google.com/fb/a/mailverify?uri=Weblog247.info'
class='weblog-subsbox-form' method='post' target='_new'>
 <input class='weblog-subsbox-name'
name='name' onblur='if (this.value == &apos;&apos;) {this.value =
Name&apos;) {this.value = &apos;&apos;;}' value='Your Name'/>
 <input class='weblog-subsbox-email'
name='email' onblur='if (this.value == &apos;&apos;) {this.value =
value='Your Email Address'/>
&apos;Your Email Address&apos;) {this.value = &apos;&apos;;}'
 <input class='weblog-subsbox-submit'
type='submit' value='Sign Up!'/>
 <p style='font-family:times new
roman;margin-top:10px;font-size:15px;'>
 <b> Tôi rất ghét thư rác! </b>
Thực sự, đó&#39;là ghê sợ và tôi không bao giờ làm điều đó.
<style>
#weblog-subsbox {
 height:300px;
 width:500px;
 background:hsla(0,0%,95%,0.4);
padding:10px;
 border:5px solid hsla(0,0%,67%,0.19);
 border-radius:10px 10px 10px 10px;
#weblog-subsboxh3 {
 text-align:center;
 margin:10px;
 text-transform:uppercase;
 font-weight:bold;
 font-family:&#39;Merienda&#39;;,cursive;
 font-size:1.4em;
 letter-spacing:1px;
}
#weblog-subsboxheader {
 border-bottom:1px solid #ddd;
 border-top:1px solid #ddd;
 font-size:16px;
 padding-bottom:10px;
 font-family:&#39;Marmelad&#39;,sans-serif;
 text-align:left;
}
.weblog-subsbox-form {
 padding:20px;
}
#weblog-subsboxheader img {
 padding-right:10px;
}
.weblog-subsbox-name {
 border:1px solid #ddd;
 font-family:Arial,sans-serif;
 font-size:13px;
 font-weight:bold;
 color:hsla(0,0%,27%,0.69);
 width:90%;
 height:24px;
 padding:5px 15px 5px 28px;
 vertical-align:top;
 display:inline-block;
}
.weblog-subsbox-email {
 border:1px solid #ddd;
 font-family:Arial,sans-serif;
 font-size:13px;
 font-weight:bold;
 color:hsla(0,0%,27%,0.69);
 width:90%;
 height:24px;
 margin-top:10px;
 padding:5px 15px 5px 28px;
 vertical-align:top;
 display:inline-block;
}
 border:1px solid #bebebe;
 box-shadow:0.5px 1.5px 2px rgba(5,95,255,.1);
.weblog-subsbox-submit {
 float:right;
 margin-top:20px;
 -moz-box-shadow:inset 0px 1px 0px 0px #BF00FF;
 box-shadow:inset 0px 1px 0px 0px #BF00FF;
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=&#39;#ededed&#39;,endColorstr=&#39;#2E2EFE&#39;);
 background-color:#ededed;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 border-radius:6px;
 border:1px solid #dcdcdc;
 display:inline-block;
 color:#424242;
 font-family:arial;
 font-size:15px;
 font-weight:bold;
 padding:6px 24px;
 text-decoration:none;
 text-shadow:1px 1px 0px #BF00FF;
}
.weblog-subsbox-submit:hover {
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=&#39;#dfdfdf&#39;,endColorstr=&#39;#ededed&#39;);
 background-color:#dfdfdf;
}
.weblog-subsbox-submit:active {
 position:relative;
 top: 1px;
}
</style>
<center>
<div id='weblog-subsbox'>
 <div id='weblog-subsboxh3'>
 Subscribe To Our Newsletter
 </div>
 <div id='weblog-subsboxheader'>
 <p style='margin-top:13px;'>
 </p>
 </div>
&apos;Your Name&apos;;}' onfocus='if (this.value == &apos;Your
&apos;Your Email Adress&apos;;}' onfocus='if (this.value ==
 </form>
 </p>
</div>
</center>
 </b:if>

           Đọc thêm:     Công cụ sửa lỗi ngữ pháp tốt nhất cho Blogger

• Thay đoạn dài màu xanh ở trên bằng lời nhắn của bạn (tùy ý bạn) 

• Thay Weblog247.info  bằng trang web của bạn.

• Nhớ ấn "Lưu mẫu" để lưu lại tất cả các cài đặt.

Cuối cùng xin chúc các bạn thành công.