Cara Membuat Artikel Berlangganan Di Atas Comment

Mungkin ini adalah widget wajib bagi para pemilik blog, dengan bantuan widget Feedburner ini para pembaca blog Anda dapat berlanggan artikel-artikelmu yang otomatis akan dikirim melalui email. Email update yang dikirim oleh feedburner hanya berisi kilasan dari artikel Anda, sehingga jika pembaca Anda ingin membaca artikelnya secara keseluruhan maka mereka harus meluncur ke blog Anda. Hal ini tentu akan meningkatkan trafik blog Anda. Disisi lain pembaca akan mendapatkan artikel terbaru dan memberikan komentar tanpa harus ketinggalan artikel terbaru dari Anda tanpa harus setiap hari mampir ke blog Anda untuk memantau update artikel terbaru.

Anda tahu kan bahwa form artikel berlangganan yang disediakan oleh feedburner agak kurang menarik para pengunjung, seperti ini :

Dan di artikel bagian 1 ini saya akan memberikan tutorial Bagaimana memoles lebih cantik form feedburner, seperti kepunyaan saya dibagian bawah artikel ini. 

Langkah Pertama :

1. Sign in ke blogger dan masuk ke tata letak

2. Kode dibawah ini bisa ditaruh dimana saja Anda suka, bisa di Sidebar maupun dibawah postingan. Tetapi saya anjurkan dibawah postingan saja karena jika pengunjung setelah membaca artikel anda dan tertarik mungkin sipengunjung akan berlangganan artikel Anda dan menanti-nanti updetan terbaru blog Anda

 3. Jika dibawah postingan, carilah kode  

<p><data:post.body/></p>

4. Kemudian taruh kode berikut ini dibawah kode yang berwarna merah diatas :

<!--Mulai  Script Artikel Berlangganan -->
<div class='kotakRSS1'>
<div class='Rssardi33'>
Jika Anda menyukai Artikel di blog ini, Silahkan <a href='http://feeds.feedburner.com/supri7' target='_blank' title='Berlangganan'>
<b>klik disini</b></a> untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di <font color='#0099DD'>supri7.blogspot.com</font>
<div class='ardi33subs'>
<table border='0' cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td align='left' style='padding:5px 0 0 0;' valign='top' width='65%'><form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=supri7&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='border:0px;padding:3px;text-align:center;' target='popupwindow'><div align='left'>
<input class='inpRssardi33' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Ketikkan email anda disini&quot;;}' onfocus='if (this.value == &quot;Ketikkan email anda disini&quot;) {this.value = &quot;&quot;;}' type='text' value='Ketikkan email anda disini'/>
<input name='uri' type='hidden' value='supri7'/>
<input name='title' type='hidden' value='supri7'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='sbmtRssardi33' type='submit' value='OK'/></div>
</form></td>
<td align='left' style='padding:4px 0 0 0;' valign='top' width='35%'><a href='http://feeds.feedburner.com/supri7'><img alt='' height='26' src='http://feeds.feedburner.com/~fc/supri7?bg=99CCFF&amp;fg=444444&amp;anim=0' style='border:0' width='88'/></a></td>
</tr>
</table>
</div>
</div>
</div>
<div class='clear'/>
<!-- SelesaiArtikel Berlangganan -->

Langkah Kedua :

Setelah selesai memasang kode diatas, sekarang memasang kode CSSnya. Kode CSS ini diletakkan diatas kode ]]></b:skin> 

.kotakRSS1 {background-color: rgb(255, 255, 255); -moz-border-radius: 5px; border: 1px solid #cccccc; padding:5px 10px; margin: 0 0 10px 0; } .Rssardi33 { background: url('http://sites.google.com/site/cumaisenggroup/cabinet/dasbor/rss.png') no-repeat bottom right; } .Rssardi33 a { background: none;} .inpRssardi33 { border: 1px solid #B9C1C6; width: 170px; background: rgb(255, 255, 255) url('http://i644.photobucket.com/albums/uu161/kgpromotion/RSS.png') no-repeat 2px 2px; font-size: 11px; padding:3px 4px 4px 20px; -moz-border-radius-bottomright: 10px; -moz-border-radius-topright: 10px; } .sbmtRssardi33 { padding:2px; -moz-border-radius-bottomright: 10px; -moz-border-radius-topright: 10px; } .ardi33subs table {border-collapse: inherit; border: none;} .ardi33subs tr { border:0;} .ardi33subs td { border:0;} .ardi33subs th { border:0;} .clear { clear: both; }

 Thx to : Vanmovic