Friday, April 19, 2013

Cara Membuat Widget Popular Post Blog Lebih Menarik

Cara Membuat Widget Popular Post Blog Lebih Menarik - Popular post bawaan dari blogger kalau kita lihat-lihat kurang keren, kurang menarik.
Apakah anda ingin mengubah widget popular post menjadi lebih menarik?

Saya akan memberikan tutorialnya, dijamin blog anda tidak akan bertambah berat tapi blog anda akan tetap menjadi lebih menarik.

Cara Membuat Widget Popuar Post Blog Lebih Menarik:
1. Login dulu ke blogger.com
2. Pilih menu Layout -> add gadget/tambah gadget/widget
3. Pilih gadget popular post
4. Atur seperti gambar dibawah ini, ubah Most viewed menjadi "All time", hilangkan centang pada 'image thumbnail dan 'snippet'


5. Simpan widget anda
6. Sekarang masuk ke menu Template
7. Backup dulu templatenya untuk jaga-jaga
8. Klik edit HTML
9. Tekan Ctrl+F
10 Cari kode ]]></b:skin>
11. Kemudian letakkan kode berikut ini diatas kode ]]></b:skin>

/*--- Popular Posts --- */
.popular-posts ul{padding-left:0px;}
.popular-posts ul li {
background: url("http://4.bp.blogspot.com/-7CHpNrL3BIY/UQFD2sPq6LI/AAAAAAAAI8E/Jibvq813XCE/s400/33.gif") no-repeat scroll 5px 8px rgb(255, 255, 255);
list-style-type: none;
margin: 0px 0px 5px;
padding: 5px 5px 5px 20px !important;
border: 1px solid #dddddd;
border-radius: 10px 10px 10px 10px;
}
.popular-posts ul li:hover {
border:1px solid #666666;
}
.popular-posts ul li a:hover {
text-decoration:none;
}
/*--- End Popular Posts --- */

Anda dapat melakukan perubahan untuk menyesuaikan tampilan default dari kode di atas:
  • Untuk mengubah gambar bullet, gantilah link gambar yang bercetak tebal pada kode di atas dengan URL bullet Anda.
  • Untuk mengubah warna perbatasan dalam mode aktif editlah bagian ini  #dddddd
  • Untuk mengubah warna perbatasan pada saat ditunjuk mouse edit bagian ini #666666
12. Dan terakhir, simpan Template Anda
Hasilnya seperti ini
Widget Popular Post anda akan lebih menarik dari sebelumnya. Demikianlah artikel mengenai Cara Membuat Widget Popuar Post Blog Lebih Menarik, semoga artikel ini bermanfaat untuk anda. Anda juga bisa membaca artikel lainnya  Cara Memasang Widget Berlangganan Subscibers Keren di Blog dan Widget lainnya di blog yang ada diblog ini.

Related Posts

Cara Membuat Widget Popular Post Blog Lebih Menarik
4/ 5
Oleh

22 komentar

April 20, 2013 at 1:10 PM delete

ok.. Makasih sob.. Ta' kumpul kode ini buat memperkaya literatur dan koleksi codding..

Reply
avatar
April 20, 2013 at 1:24 PM delete

ok sob,, makasih kunjungannya
saya juga banyak belajar dari blog anda

Reply
avatar
April 22, 2013 at 1:17 AM delete

mantab sob tutor nya, nanti ane praktekin :D

Reply
avatar
April 22, 2013 at 9:41 AM delete

masih ada lgi yg lebih mantab sob,,, makasih dah berkunjung
:)

Reply
avatar
April 27, 2013 at 9:06 PM delete

nice info Mas Bro

#MAHASISWA GO BLOG

Reply
avatar
May 28, 2013 at 1:02 PM delete

@Piza laaa terima kasih juga kunjungannya cheer

Reply
avatar
July 26, 2013 at 10:07 PM delete

wah keren juga nih thx udh di share :)

Reply
avatar
August 3, 2013 at 12:16 AM delete

Nice sob.. cara pasang popular post ke widget tab gimana caranya sob..?? :)

Reply
avatar
August 3, 2013 at 12:02 PM delete

tinggal copy kode widget populer post lalu paste ke widget tab.

Reply
avatar
December 27, 2013 at 11:12 AM delete

makasih, kang. 100 % berhasil, HORE (hihi)

Reply
avatar
December 27, 2013 at 11:42 PM delete

Selamat bro.. saya ikut senang :)

Reply
avatar
January 14, 2014 at 7:10 PM delete

nyimak ya sob, salam kenal dan kunjungi blog saya di http://lintas-tutor.blogspot.com/

Reply
avatar
January 26, 2014 at 4:54 AM delete

kok gagal ya, apa templatenya gak dukung ya?

Reply
avatar
January 26, 2014 at 1:34 PM delete

coba teliti dulu. mungkin ada langkah yang terlewatkan. atau mungkin populer postnya sebelumnya udah pernah di oprek.

Reply
avatar
January 26, 2014 at 4:55 PM delete

Oke gann...berhasil!!!! :-)

ternyata emang template yg dulu nggak mendukung, coba deh sekarang cek blog saya gan :-)

www.menulislah.com

makasih ....

Oya gan, saya dah bolak balik nyari tutorial membuat auto read more, nggak ada yg berhasil....minta bantuannya gannn........

Reply
avatar
January 27, 2014 at 2:41 PM delete

selamat gan udah berhasil. :)
ini gan http://aikonmedia.blogspot.com/2013/03/cara-membuat-readmore-otomatis-di-blog.html

Reply
avatar

Berkomentarlah dengan Bijaksana, spamming tidak akan pernah di publish