Sabtu, 14 April 2012

Cara Mempercantik Tampilan Feedburner Di Blog


Cara Mempercanti Tampilan Feedburner - pada postingan kali ini saya akan membuat tutorial tentang mempercantik tampilan form berlangganan. Sebelumnya feedbuner sendiri menyediakan form berlangganan dengan tampilan yang simple, nah kali ini saya akan memberikan script dengan tampilan form berlangganan yang lebih keren dan menarik.

Sekarang bagaimana cara memasangnya ?

  • Pertama, Log-in ke blogger kalian,
  • Kedua, pilih Rancangan,
  • Ketiga, pilih Tata Letak,
  • Keempat, pilih Tambah Gadget,
  • Kelima, pilih Javascript/Html,
  • Selanjutnya, sobat copy script di bawah ini ke dalamnya,
<style>
.form {
border:1px solid #ccc; 
background: #ffffff 
padding:3px;
width:300px;
height:150px 
}

.rss {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisDC3KVaQkGlUc5P9u0Ln_pD6uZ8KtHwzN9Aih8NGvYszdn4soB2_FYtBtUNYe38FMmd3oXJ8OU1PT_xqSYBb7fP-ule97zbX5h82JMV_sZp_9NDxtQsSwmxMgZjF1Awh75WuR2cMPtL0c/s400/feedreader_2.jpg")repeat-y right;
}

.button {
background: #006699;
color: #FFFFFF;
font-size: 12px;
font-family: Arial, Tahoma, Verdana;
margin-left: 5px;
border: 1px solid #234B69;
padding:3px 5px 3px 5px;
font-weight: bold;
}
</style>

<div class="form">
<div class="rss">
<div style="font-weight:bold; color:#333333; font-size:12px; padding:0x 5px 5px 10px;"><div style="padding-left:10px"><p><a href="http://feeds.feedburner.com/_deejayHan_" rel="alternate" type="application/rss+xml"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFubiV96VOzZpGpahZCNX65rbXiLyfaAWc0nY2zninueW6QbybCkticWjc9JIpB88dWKeBeQqzMbQsqUXGcmadGJNaigsSdql431b2k5ZPTvSWGuGajscJRQpzXeCnqoJSg0wpQaofaJuW/s200/feed-c.png" alt="" style="vertical-align:middle;border:0"/></a><a href="http://feeds.feedburner.com/_deejayHan_" rel="alternate" type="application/rss+xml"> Gratis berlangganan artikel via RSS</a></p></div></div>

<div style="padding-left:10px"> Anda bisa berlangganan FEED via email</div>

<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=_deejayHan_', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><div style="padding-left:10px; padding-bottom:10px; padding-top:10px"><input type="text" style="width:170px; height:16px" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Tulis email anda disini&quot;;}" onfocus="if (this.value == &quot;Tulis email anda disini&quot;) {this.value = &quot;&quot;}" type="text" value="Tulis email anda disini" /> <input type="hidden" value="DeeJayHan" name="uri" /><input type="hidden" name="loc" value="en_US" /><input class="button" type="submit" value="Subscribe" /></div></form>

<div style="padding-left:10px"><a target="_blank" href="http://feeds.feedburner.com/Koisine"><img
border="0" alt="ads" src="http://feeds.feedburner.com/~fc/_deejayHan_?bg=8a8a8a&fg=444444&anim=1"/></a></div>
</div></div>
  • Note : Ganti _deejayHan_ dengan nama Feedburner kalian.
  • Terakhir, Simpan.
Ganti sekarang juga dengan tampilan feedburner yang lebih keran.
Description: Cara Mempercantik Tampilan Feedburner Di Blog
Rating: 4.5 4.5
Share on :
 
© Copyright Top Online News | Toko News 2011 - Some rights reserved | Powered by | Blogger.com.
Template Design by Herdiansyah Hamzah | Supported by Toko Blog N GoogleCara Mempercantik Tampilan Feedburner Di Blog