Home » » Modifikasi Kotak Feedburner pada blog

Modifikasi Kotak Feedburner pada blog

Written By Rangga Arief Putra on 20 Jun 2011 | 2:55:00 AM

Pada postingan saya kali ini (pada malam yang berbahagia) hehe ..
Saya ingin memberikan tips buat sobat blogger semua bagi yang ingin Memodifikasi tampilan kota Feedburnernya memakai gambar.
Sebenarnya sudah banyak Blog lain yang sudah share tentang bagaimana cara memodifikasi kotak berlangganan Feedburner ini.

Namun saya beranikan diri lagi untuk menshare ini Versi Ala Chenkgelate


Langsung aja ya sob di baca dan di ikutin petunjuknya :))

  1. Login ke Blogger
  2. Klik Menu Design/Rancangan
  3. Selanjutnya Klik Add a Gadget , Pilih HTML/JavaScript Add Di tempat yang ingin anda pasang kotak langganan Feedburner / Bagi yang sudah mempunyai kotak berlangganan Feedburner Silahkan :
  •  Klik Design/Rancangan
  • Selanjutnya pada Gadget kotak berlangganan Anda Klik Edit
Selanjutnya:

Copas Code HTML di bawah ini pada Form  HTML/JavaScript Add  yang anda inginkan

<style>
.form {
border:0px solid #ccc; /* warna garis pinggir form */
background: #ffffff /* warna background form */
padding:3px; /* spasi form */
width:ancho; /* panjang form */
height:180px /* tinggi form */
}

.rss {
background: url("http://lh5.ggpht.com/_1j80TgNqd_8/TTXQmVGix9I/AAAAAAAABZE/_YaCDdI-tAc/s128/rss_feed_logo.png") no-repeat top right;
}

.button {
background: #006699; /* warna tombol subscribe */
color: #FFFFFF; /* warna font subscribe */
font-size: 11px; /* ukuran font subscribe */
font-family: Arial, Tahoma, Verdana; /* font subscribe */
margin-left: 5px; /* margin kiri tombol subscribe */
border: 1px solid #234B69; /* warna garis pinggir tombol subscribe */
padding:3px 5px 3px 5px; /* jarak antara font dengan garis pinggir tombol subscribe */
font-weight: bold;
}
</style>

<div class="form">
<div class="rss">
<div style="font-weight:bold; color:#333333; font-size:15px; padding:10px 5px 5px 10px;"><a href="http://feeds.feedburner.com/chenkgelate"><img src="http://lh3.ggpht.com/_15FopxVONSo/TCXI_jBHdlI/AAAAAAAADPY/Rh5cFsxiV4A/s800/005.png" /></a> <a href="http://feeds.feedburner.com/chenkgelate">GET UPDATE VIA RSS</a></div>

<div style="font-weight:bold; padding:10px 10px;">GET UPDATE VIA EMAIL</div>

<div style="padding-left:10px">Dapatkan kiriman artikel terbaru langsung ke email anda!</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=chenkgelate', '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:160px; height:18px" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Ketik email anda disini...&quot;;}" onfocus="if (this.value == &quot;Ketik email anda disini...&quot;) {this.value = &quot;&quot;}" type="text" value="Ketik email anda disini..." /> <input type="hidden" value=chenkgelate" name="uri" /><input type="hidden" name="loc" value="en_US" /><input class="button" type="submit" value="SUBCRIBE" /></div></form>

<div style="padding-left:10px"><a href="http://feeds.feedburner.com/chenkgelate"><img src="http://feeds.feedburner.com/~fc/chenkgelate?bg=ff7c00&amp;fg=444444&amp;anim=0" width="88" height="26" style="border:0" alt="" /></a></div>
</div></div>

Keterangan:
  • Ganti Tulisan yang berwarna Merah dengan alamat Feedburner sobat
  • Jika sobat mengerti kode HTML atau CSS Silahkan edit kode CSS ny

Udah dulu ya sobat blogger Tutorial Cara memodifikasi kotak Feedburner ala Chenkgelate. Capek nech mau Tidur dulu . .
Selamat Mencoba . . ! !
Share this article :

7 comments:

  1. sipp brooo...ane udah pake dan cantik banget..wkwkwk

    BalasHapus
  2. wah wah wah . . .
    Sukses dech sob :)

    BalasHapus
  3. Thank's gan....visit back za....(http://dp-media.blogspot.com)

    BalasHapus
  4. thanx boz bwat info nya.,.,

    visit back, bwat support my blog ya.,..(http://forsaysfriend.blogspot.com)

    BalasHapus
  5. nice post http://elcoom.blogspot.com

    BalasHapus

 
Support : Your Link | Your Link | Your Link
Copyright © 2013. Chenkgelate - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger