Widget ini pasti akan meningkatkan jumlah subscribers blog anda. jika Anda menulis postingan dengan baik dan anda mengharapkan lebih banyak jumlah pelanggan maka widget ini pasti akan sangat membantu anda. Karena widget ini berisi formulir seperti berlangganan email, tombol facebook, tombol follow twitter dan beberapa ikon sosial yang indah di sebelah kanan widget. widget ini dapat di pasang dengan mudah haya dalam satu langkah bro :D, Anda hanya perlu copy dan paste kode di bawah ini ke template blog anda. Nah Sekarang mari kita lihat bagaimana untuk menambahkannya ke blog blogger?
Bagaimana cara menambahkan Widget Subscriber di Bawah Postingan ?
- Pertama anda pergi ke Blogger Dashboard dan klik tab Template
Saya sarankan backup dulu templatenya
- Klik pada Edit HTML
Karena editor HTML yang baru maka kita tidak perlu centang Expand Widget Template
Recomended : Tampilan Baru Edit HTML Blogger Tahun 2013
- Cari kode dibawah ini pada template Anda
<data:post.body/>
Kemudian tambahkan kode dibawah ini tepat setelah kode tersebut. (di bawah kode <data:post.body/>)
<b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
form.feedburner {
margin: 20px 0 0;
display: block;
clear: both;
}
.helperbloggerstyle {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhteqaX5rdJWd6xSOvYhRSufu9yCCAkWQlhMaIMNczHa9O1HGsMexTp3MsJ2CONySJl1xL44hesbKB7tlynT2jPKA1qOkz6ylcx7a9OMpKfUmge-I8KrfBoRjf52Et9-ELaxkbd9CHfsZji/s1600/helperblogger.com-email-icon.png) no-repeat scroll 4px center transparent;
padding: 7px 15px 7px 35px;
color: #666;
font-weight: bold;
text-decoration: none;
border: 1px solid #D3D3D3;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
.helperbloggersubmit {
color: #666;
font-weight: bold;
text-decoration: none;
padding: 6px 15px;
border: 1px solid #D3D3D3;
cursor: pointer;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-goog-ms-border-radius: 4px;
border-radius: 4px;
background: #fbfbfb;
background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='
#FBFBFB', endColorstr='#F4F4F4',GradientType=0 );
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
}
#helperblogger-widget {
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-goog-ms-border-radius: 10px 10px 10px 10px;
border-radius: 10px;
background: none repeat scroll 0 0 transparent;
border: 1px solid #D3D3D3;
padding: 8px;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
width: 480px;
-webkit-box-shadow: inset 0px 0px 8px rgba(50, 50, 50, 0.75);
-moz-box-shadow: inset 0px 0px 8px rgba(50, 50, 50, 0.75);
box-shadow: inset 0px 0px 8px rgba(50, 50, 50, 0.75);
-webkit-box-shadow: inset 0px 5px 0px 0px #D8D8D;
}
#helperblogger-widget:hover {
background: none repeat scroll 0 0 #FFF;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
#helperblogger-widget td {
padding: 3px 0;
}
</style>
<center><br/><div id='helperblogger-widget'>
<div id='emailwidget'>
<table style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;' width='100%'>
<tbody>
<tr style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'>
<td align='left' style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'>
<p style='color:#666; font-weight: bold; font-size: 18px; margin:0px 0px 5px 0px;font-family:georgia;font-style:italic; '>
Get free daily email updates!
</p>
<form action='http://feedburner.google.com/fb/a/mailverify' class='feedburner' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=TheNawawiPost', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='TheNawawiPost'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='helperbloggerstyle' name='email' onblur='if (this.value == "") {this.value = "Enter your email…";}' onfocus='if (this.value == "Enter your email…") {this.value = ""}' type='text' value='Enter your email…'/>
<input alt='' class='helperbloggersubmit' title='' type='submit' value='Submit'/>
</form>
</td>
<td style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'>
<p style='color:#666; font-weight: bold; font-size: 14px; margin:0px 0px 5px 0px;font-family: georgia; '>
Follow us!
</p>
<a href='http://feeds.feedburner.com/TheNawawiPost' rel='nofollow' target='_blank' title='Suscribe to RSS Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhukKoRymSFJxQEuBoTaiMkwC0P3BmJJNl-Bu_IUizs7pTS_lb6acOdgkfR_tmKBQ5FFgVWCzrTCiCJTpyySBJnsYb6CjnYS6m8ihrARZVDkh_KaQoQx5vPHZ2HFBfy43Jp1fXa9TOiSro4/s1600/helperblogger.com-rss.png'/></a>
<a href='http://twitter.com/HamdanNawawi' rel='nofollow' target='_blank' title='Follow us on Twitter'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiS5zQvFqMTrU9C_lJI1_E2PolZDWjHscza23Pdtqgjt0rnk12At7Hs9I16uC5xReTof3nkJkuj1ZpJOmPnrU-TPlYCuMgnr4LSMqr6b6R6CvLN8KNCAP-4b57EwMRmW1Ret6nOp3mBHwNV/s1600/helperblogger.com-twitter.png'/></a>
<a href='http://www.facebook.com/TheNawawiPost' rel='nofollow' target='_blank' title='Follow us on Facebook'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkgCeVWu6LXjKAxBcXyMPy_XqByMsWfP9bYi2NS4_JEWoBJLD9XHVCkkmJyqytfcWSVeq7qdASzFFBT1kYNWApln74Ut_WifNB4WlLsr7fuh6Qu6vL-sDO0lRPgXzmMW-xbHiium3xlMGr/s1600/helperblogger.com-fb.png'/></a>
<a href='https://plus.google.com/116833583873147539259' rel='nofollow' target='_blank' title='Follow us on Google+'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSym6OAxf8ncsN37lP1Je269kkQ34mSJ4PNEuOrXjkLpMBlyhGxLxOzsFRweOpAPl8CQr7_GUafWVaaQYfQJmz50e0e0epTG2I6J46qCgD6ciZi-ezQenRzgDiCiATXVKS-DWgOhjSUgMj/s1600/helperblogger.com-gplus.png'/></a>
</td>
</tr>
</tbody>
</table>
<div align='right'>
<span style='font-style: italic; font-size: 8px; color: solid #ffffff;'><a href='http://nawawipost.blogspot.com/' style='text-decoration: none;' target='_blank'><font color='#000' decoration='none'>[Get this widget]</font></a></span>
</div>
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2FTheNawawiPost&send=false&layout=standard&width=450&show_faces=true&action=like&colorscheme=light&font=verdana&height=30" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:30px;" allowtransparency="true">
</iframe>
<a class='twitter-follow-button' href='http://twitter.com/HamdanNawawi' rel='nofollow'></a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script>
</div>
</div>
</center>
</b:if>
- Ganti semua (tiga) TheNawawiPost dengan Username Feedburner Anda
- Ganti semua (dua) TheNawawiPost dengan Username Facebook Anda
- Ganti semua (dua) HamdanNawawi dengan Nama Twitter Anda
- Ganti 116833583873147539259 dengan Google + ID Anda
Terakhir simpan template Anda dan setiap anda mengunjungi posting Anda, Anda akan melihat widget ini setelah posting berakhir. yaps semoga bermanfaat mas bro :D
Comments
Post a Comment