Cara Mudah Membuat Widget Berlangganan Artikel/ Like Social

sobat blogger, widget kotak berlangganan artikel via email atau like social ini pasti sering anda lihat di web atau blog orang lain, widget berlangganan artiekl atau subscribe adalah jika orang atau pengunjung web atau blog setia anda ingin mengetahui update-update artikel terbaru anda bisa di kirim melalui email mereka yaitu dengan cara berlangganan melalui kolom widget email subscribe, maka dengan otomatis mereka dapat menikmati artikel terbaru anda langsung di kirim via email.

Sobat blogger,widget berlangganan ini juga disertai dengan like social seperti icon facebook,twitter,feedburner dan google+ di tambah dengan tampilan yang unik dan menarik seperti di gambarkan oleh crayon, apa anda sangat tertarik dan ingin di terapkan di blog anda, okelah itu mudah saja,anda cukup mengikuti tutorial yang saya berikan disini, namun sebelum anda melakukan tutorial ini, anda di haruskan mempunyai ID Feedburner, jika anda belum memilikinya, silahkan anda buat di sini : Cara Daftar RSS Feedburner Dan Berlangganan Email Untuk Blog.

Baca : Cara Pasang Like Box Fanspage Facebook Di Blog

Cara Membuat Widget Berlangganan Artikel/ Like Social

1. Buka Akun Blogger anda

2. Pilih Menu Tata Letak.
3. Klik Tambah Gadegt > Pilih HTML/Java Script
4. Lalu masukan kode di bawah ini ke dalam kolom pop up yang muncul.

<a href="http://feeds.feedburner.com/ID FEEDBURNER" imageanchor="1" style="margin-left: .5em; margin-right: 1em; float: center;" rel="nofollow" target="blank"><img border="0" height="40" src="http://www.sassyandgeorge.com/wp-content/uploads/2011/01/subscribe2-copy.jpg" width="290" /></a>
<style>
.mbtips-email{
background:Fff no-repeat 0px 12px ;
width:250px;
float:center;
font-size:1.4em;
font-weight:bold;
margin:2px 20px 0px 35px;
color:#686B6C;
}
.mbtips-emailsubmit{
background:#0084CE;
cursor:pointer;
color:#fff;
border:none;
padding:3px;
margin:0 0 0px 0;
text-shadow:0 -1px 1px rgbaundefined0,0,0,0.25);
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
font:12px sans-serif;
}
.mbtips-emailsubmit:hover{
background:#E98313;
}
.textarea{
padding:2px;
margin:0px 2px 0px 2px;
background:#f9f9f9;
border:1px solid #ccc;
resize:none;
box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1);
-webkit-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); font-size:13px;
width:170px;
color:#666;}
</style>
<style class="text/css">
.center
{
text-align:center;
font-weight:bold;
margin:10px;
}
</style>
<div class="center">
Submit your Email Address to Get Free Blogger Tips Directly to your Inbox
</div>
<div class="mbtips-email">
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=ID FEDDBURNER', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="3" class="textarea" name="email" onblur="if undefinedthis.value == "") {this.value = "Enter email address here";}" onfocus="if undefinedthis.value == "Enter email address here") {this.value = "";}" value="Enter email address here..." type="text" />
<input type="hidden" value="MadamVia" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<input class="mbtips-emailsubmit" value="Submit" type="submit" />
</form>
</div>
<style class="text/css">
table
{
border-bottom: 0px solid #E6E6E6;
float: center;
width: 240px;
margin:10px 0 0 15px;
}
.subicons
{
border-right: 1px solid #E6E6E6;
}
.Fadeout {
filter:alphaundefinedopacity=100);
opacity: 1.0;
border:0;
}
.Fadeout:hover{
filter:alphaundefinedopacity=80);
opacity: 0.8;
border:0;
}
</style>
<div class="table">
<table>
<tr>
<td><div class="subicons"><a class="Fadeout" href="http://www.facebook.com/pages/ID FACEBOOK" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-2pwCAYKhyphenhyphenv141UhY2qaD-F058Yx_zjCCtGzeTbsH0MYSH84F2TRdwg4jdM75yLf2ujBcurPfNTONiLX_l7wOy41JWzA4jXG1FcaBqTwF2HQWkf-my2Zj1AmkUWkMkgc-wfZm4y4fIV8D/s1600/facebook-48.png" /></a></div></td><td><div class="subicons"><a class="Fadeout" href="http://twitter.com/ID TWITTER" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMMBiORjJwmj9lSeLZwvQyIhjT35sjfj3YrXK-REfC0jaUVomWKWJGkLFlEcc81s9lT2a8KFfcpiC90nPtX9No9-yhPtwEbBXKAmyQHPFtfcJcoqvThg0xPjikC5vu7uKuUKAoCsOLQP5U/s1600/twitter-48.png" /></a></div></td>
<td><div class="subicons"><a class="Fadeout" href="http://feeds.feedburner.com/ID FEED" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS-oFNg0uZFdA_wm1lMpF4wS61FaBDQODZsgIMiumlqC_W8AYUBf0ioOfgtpLgrNqU1d1qPwqLTSdEFJRjGGYPfzcpE-HVSRTTxqehh6F0eWsq-4pe9kxy5hx8d1HABJ_QX_G4IcNoiQTF/s1600/rss-48.png" /></a></div></td>
<td><a class="Fadeout" href="https://plus.google.com/ID GOOGLE+/posts" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEha8tUteC9uyH7Evu86qfufIagy4kcNAlzPFNcR3kMxv7hnPOvVWI-4bkBUIx1uEkY2G4PPodoBt4QhzLUGLuhrB-ZISP-EM9ieUVFPfuZnJR1T6mt2jOtsxzGSBtgS__JkTJ4PTDsWIciJ/s1600/google-48.png" /></a></td>
</tr></table>
</div>

Nah,kalo sudah anda simpan di kolom jangan lupa ganti ID yang saya beri warna biru dengan ID sesuai yang saya tunujukan, sobat blogger, cukup mudah bukan cara membuat widget feedburner berlangganan artikel via email dan like social, lebih dan kurangnya saya mohon maaf, semoga sukses..