Sunday, January 27, 2013
Cara Membuat Widget Popular Post Blogger Menjadi Lebih Menarik

Keuntungan terbesar dari widget ini adalah bahwa kita tidak perlu menginstal Javascript apapun yang berat karena kita menggunakan widget yang tersimpan pada server Blogger dan kita hanya akan mengubah tampilan untuk membuatnya menyatu sempurna dengan blog Anda.
Saya harap Anda akan mendapatkan tutorial yang cukup menarik kali ini karena saya akan memberikan trik sederhana tentang cara membuat widget popular post menjadi sangat menarik. Jadi mari kita mainkan!
Menambahkan Widget Popular Post ke Blog
- Login dulu ke Blogger > Layout
- Klik Add a gadget dan pilih gadget "Popular Post" dari daftar yang disediakan blogger
- Setinglah seperti gambar di bawah ini! (Ubahlah Most viewed menjadi 'All time', hilangkan centang pada 'image thumbnail' dan 'snippet')
- Simpan widget Anda
- Sekarang masuklah ke Template
- Backup dulu template Anda jika perlu
- Klik Edit HTML
- Carilah kode ini
]]></b:skin>
- Kemudian letakkan kode berikut ini di atasnya
/*--- Genera 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;
}
Keterangan:
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
- Anda dapat menggunakan Kode Warna CSS milik saya untuk mencari kode warna yang tepat.
- Dan terakhir, simpan Template Anda dan katakanlah bingo!
Kunjungi blog Anda untuk melihat apakah widget popular post sudah terpasang dengan baik pada sidebar blog Anda. Jangan beritahu saya jika Anda membutuhkan bantuan lebih lanjut dalam mengubah jenis font atau warna. Widget akan secara otomatis menggunakan warna standar dari blog Anda, tetapi jika Anda ingin mengubah untuk sesuatu yang berbeda maka jangan ragu untuk membiarkan saya tahu dengan mem-posting komentar Anda di bawah ini. :D
Jika Anda menyukai artikel ini dan ingin berbagi dengan pembaca Anda mengenai tutorial ini maka silahkan cantumkan linkback ke postingan ini. Salam damai kawan.. :)
Labels: Blogging Tips, Widgets and Plugins

Author: Balaputra
Balaputra adalah seorang mahasiswa yang melakukan aktivitas blogging hanya untuk menghabiskan waktu luang. Follow @IshaMcSmile
Artikel Terkait:
Blogging Tips Widgets and Plugins
Subscribe to:
Post Comments (Atom)
Terima kasih gan,sudah saya coba dan berhasil,sukses selalu buat blog ini dan adminnya..share yang bermanfaat..:)
ReplyDeleteSama2 sob,,senang jika berhasil.. ^^
Deletecek demonya disini ya kawan kawan : http://www.8fulldownload.com/
ReplyDeletethanks, heee
Deletebagus neh,,boleh dicoba
ReplyDeleteSilahkan sobb. . .
Deletewah ... mantep ne... keren..
ReplyDeletetanks gan... salam
kalonya aada 2 popular post terus kita mau cuman ada 1 yang di percantik, yg satunya lagi ngak.. itu gmana gan??? kalo bisa koment balik ke Rahmatdi99 blog di tunggu
ReplyDeleteAndi@Trimakasih sudah berkunjung sob..
ReplyDeleteJin@ Wah maaf kawan kalau yg itu belum pernah saya coba..
url bullet tu yang mana pak
ReplyDeleteItu yg bercetak tebal sob "http://4.bp.blogspot.com/-7CHpNrL3BIY/UQFD2sPq6LI/AAAAAAAAI8E/Jibvq813XCE/s400/33.gif"
DeleteGanti dengan url yg Anda punya bila ada..
^^
keren om... makasih...
ReplyDeleteBerhasil...!!!
ReplyDeleteTerima kasih infonya...
sama2 bung..
Delete:)
tutirial anda sangat menarik sob..
ReplyDeleteTrimakasih kawan..
Deletekunjung balik blog saya ya gan www.kapanlagi-download.blogspot.com
ReplyDeleteTrimakasih sudah berkunjung sob..
Deletemau nanya nih sob, ada gak cara agar post tertentu tidak hadir dalam daftar Popular Post meskipun banyak dikunjungi?? bantuan'ny yo sob ...
ReplyDeletehttp://fajrin-dimension.blogspot.com/
Emmhhh,,sepertinya sih itu dari blogger sendiri sob...
DeleteKalo scriptnya sy belum tahu...
ane gak muncul gan,,, bisa di cek dimari..
ReplyDeletehttp://clicklifes.blogspot.com/
Jika tidak berhasil mungkin ada yang salah sob atau kadang tidak sesuai dengan template yang Anda gunakan....
Delete^^
thanks info'x gan, bermanfaat sekali bagi saya ..
ReplyDeleteTrimakasih sudah berkunjung kawan...
Deleteterimakasih mas, saya pakai di blog saya yah . . . , silahkan mampir yah ke http://davidraja43.blogspot.com/
ReplyDeleteSilahkan jika suka kawan..
Delete:)
oh iya mas, kalo mau bikin tulisan author di koment admin, gimna yah cara nya ?????
ReplyDeleteTrimakasih sudah berkunjung kawan,,
DeleteInsyaAllah jika saya sempat akan sy posting caranya, postingan yg berhubungan dg script mmang paling susah mnurut sy...
^^
Terima kasih gan izin pake yah di blog saya,, ditunggu kunjungannya gan hehe
ReplyDeletehttp://pahmistory.blogspot.com/
mantap bang.. ada widgetnya pake javascript ga bang..
ReplyDeleteMaaf kawan sy tidak punya..
Delete^^
keren mas bro..
ReplyDeletekalo popular postnya cuma gambar aja gimana mas bro?
Tinggal diatur saja di layout > add a gadget > popular post
DeleteLalu hilangkan centang pada snippet, jadi yg muncul hanya image thumbnail saja.
^^
Thanks mas broh,,,,,
ReplyDeletesama2 kawan...
Delete:)
makasi
ReplyDeleteSama-sama..
Delete:)
mantap broo, tutorial ente yang sangat membantu
ReplyDeleteTrimakasih sob,.,.
DeleteSemoga bermanfaat..
mantab boz artikelnya
ReplyDeletekok tulisannya da diatas blog sih??
ReplyDeletetolong bantu ya gan!!!!
Coba reposisi widgetnya di Layout, pindah ke tempat yang Anda inginkan..
Deleteuntuk membuat random post yang mirip dengan widget popular post seperti random post yang ada diblog anda bagaimana sobat...?
ReplyDeleteterima kasih sebelumnya sob, salam kenal dan sukses selalu:)
Yang mana mz??
DeletePunya saya kn cuman Popular Post sama Recent Post..
Kalau mau yang acak silahkan mungkin ini bisa dijadikan materi
http://d-genera.blogspot.com/2013/05/memasang-facebook-recomendation-box-di-blogger.html
ohh iya sorry salah ketik, maksud saya yg mirip dengan recent post anda sob..hehe
Deleteuntuk tutor pembuatan recent post seperti diblog anda ada kah sob...? karena simpel dengan feedburner+iconx, jadi saya cukup naksir dengan recent post sobat..:D
Owh sy pakai layanan Feedburner itu mz. . .
DeleteWah sy kesulitan jika lewat komentar ini, mungkin besok saja saya posting caranya.. ^^
Atau sementara mz utek2 dulu sj di feedburner di bagian tab Publisize > Buzzboost.
oke sob terima kasih atas responnya..:)
Deleteudah saya utek2 code diatas diblognya teman & alhamdulillah random+ post bisa saya buat kayak diside bar blognya sampean mas. hehe :D
Syukur lah kalo begitu mz....
DeleteHappy blogging. :)
Demonya mana ne sob?
ReplyDeleteDemonya tidak saya buat,,,tapi hasilnya persis seperti yang saya pasang di sidebar kanan blog saya kang..
Deletetq gan tas infonya dan saya coba ternyata berhasil
ReplyDeletedi tunggu kunbalnya gan tq
Oke kawan trimakasih sudah mampir...
Deletekok gk ada b:skin nya ya?
ReplyDeleteCoba diperiksa lagi kawan, masa tidak ada??
Deletemakasi kawan
ReplyDeleteSama2 kawan..
Deleteterimakasih gan
ReplyDeleteSama2 kawan, terimakasih sudah berkunjung...
DeleteTolong ramaikan halaman ini ya masbro
ReplyDeletesaling follow juga okey
http://www.facebook.com/addnonstop
http://www.facebook.com/forumanakrantau
http://www.facebook.com/MaenPokerTanpaModalWithdrawBisaJadiDuitAsli
http://www.facebook.com/KoleksiVideoOveraVanJavaDiTrans7
grup fb http://www.facebook.com/groups/134276456647027
situs http://bloggeronecu.blogspot.com/
http://koleksivideoovj.blogspot.com/
no spamming
punya saya kok klo klo mau di klik ga keliatan tulisannya jadi putih gitu. ga seperti punya ente gan.. mhon pencerahannya
ReplyDeleteMungkin ada script lain yg menyebabkn seperti itu kawan....
DeleteHarus dicari satu per satu itu..
cara backupnya gimana
ReplyDeleteDi Dashboard blogger - Anda mauk ke tab Template lalu di pojok kanan atas ada tombol Backup/ Restore. Tombol itu yg dipakai untuk membackup..
Deletesipppppppp. thanks.
ReplyDeletevisit:
http://fconan45.blogspot.com
hihi mantap om sukses
ReplyDeleteTrimakasih kawannn . . .
Deleteberhasil mas...makasih banyak yaa mas
ReplyDeletejangan lupa mas,mampir di blog ku http://belajarmencaritahu.blogspot.com
Oke kawan..
DeleteSalam kenal.
Saya coba dulu gan....
ReplyDeleteMakasih atas panduannya.
ReplyDelete"judlnya cara membuat" tp artikel ini tidak melibatkan pembaca untuk membuat kode yang bisa merubah populer post menjadi menarik"
ReplyDeletekita hanya disuruk copy paste kode yang sudah ada supaya popules pos menjadi lebih menarik.
Wah maaf kawan kalau disuruh menerangkan bagaimana cara membuat kodenya sih terlalu banyak bahasan kawan,, bahkan di bangku kuliah saja butuh beberapa pertemuan untuk memahami kode2 itu.
DeleteApalagi melalui blog, sulit sekali. Dan tidak efektif..
jasa pembuatan akun google adsense murah dan terpecaya silahkan klik JASA GOOGLE ADSENSE MURAH DAN TERPECAYA
ReplyDeletehttp://netiplisiskom.blogspot.com/2013/09/jasa-google-adsense-paling-murah.html
Deleteklo supaya popular postnya itu gambar sama judul dari artikel aja yang kelihatan bisa gan ?? mohon pencerahan :)
ReplyDeleteada ng yang dikasih foto? biar lebih enak
ReplyDeletecomeback
keren gan,simple dan menawan ,makasih sharenya
ReplyDeletekunjungan balik menuju blog belajar seo pemula ane ya !
thanks gan...
ReplyDeletesangat bermanfaat...
sebagai pengguna blog, artikel ini sangat membantu. Thanks jangan lupa kunbalnya
ReplyDeletekok tulisan ]]> gak ada ya gan, gimana cara menambahkanya???
ReplyDeleteGurih2 nyoy...
ReplyDeleteDimasanwaraziz.blogspot.com
Nice,, Thanks
ReplyDeleteKunjungi : http://alldownlooad.blogspot.com
kren mass..
ReplyDeletemantep jadi mas..
ReplyDeleteterimaksih..
bisa jadi referensi memperjcantik blog q
Makasih Gan keren banget popular post,nya Jos deh pokoknya.... tak kasih satu G+ dah....
ReplyDeletetapi kalo sempat mampir ya Gan :D
stonypedia.blogspot.com
gini bang..
ReplyDeletesaya coba sih bisa,tapi ko judul dari populer postnya muncul klo cursor di arahin di post populernya..
klo cursornya ga di arahin judulnya ga kliatan,cma kotak putih..itu saya yang salah apa emang gara" temanya..
blz ya kk
klo di buat judulnya keliatan terus bisa ga..
ReplyDeleteMakasih sob....berhasil nih....jangan lupa berkunjung ke blog ku ya
ReplyDeleteDownload soal-soal CPNS Gratis : www.beapt.com
makasih mas tutorial nya
ReplyDeleteizn saya mencobanya http://kutipan-terbaru.blogspot.com/
Gan, bisa ga code itu di taruh dlm textarea soalnya kalo copas bgt jdi kebanyakn spasinya, trims gan sblmnya...
ReplyDeletebermanfangat sekali,,,, sipp maen yok yg punya keluhan penyakit kulit http://solusi-penyakitkulit.blogspot.com
ReplyDeletemakasih sob...dah tak coba and berhasil
ReplyDeletehttp://pospuisi.blogspot.com
keren widgetnya mas
ReplyDeleteBinggGO...ini nih yang saya cari2 dari kmren baru nemu disini.makasih ya mastaH.so simle n cute.
ReplyDeleteby the way blog saya sepi kaya kuburan http://bucabacabanyaktau.blogspot.com kujungin donk ya,,,,semangat terus pembagi ilmu smoga berkah.amin....
makasih ilmunya saling berbagi
ReplyDeletetrik sempurna mempercantik blog
ReplyDeletesangat bermanfaat sekali postingnya
ReplyDeleteberhasil dipasang, makasih panduannya sob
ReplyDeleteWah !! cocok sekali kalau dipasang di blog ane yang ini gan : www.gividia.com
ReplyDeleteselamat beraktifitas, salam sehat
ReplyDeletehttp://goo.gl/nNMUC2
Makasih gan untuk informasi tutornya :)
ReplyDeletehttp://goo.gl/yQnQ3T
Thanks broh untuk informasi artikelnya :)
ReplyDeletehttp://goo.gl/lTbc2h
nice post agan, terimakasih. Kunjung balik ya :)
ReplyDeletehttp://bit.ly/1HhCDry
dari beberapa jenis yang saya coba, saya cocok sama yang ini, thanks
ReplyDeletethanks guys infonya
ReplyDeleteJakarta, Aktual.com — Seiring dengan bertambahnya usia, keriput muncul dan kulit manusia akan kehilangan kemilau alaminya. Selama proses penuaan, kulit kehilangan elastisitas dan ini mendukung munculnya kerutan pada kulit.
ReplyDeleteNamun, nampaknya ada alasan substansial yang menyebabkan penuaan pada kulit yang cepat timbul.
Penuaan kulit secara dini merupakan hasil dari aktivitas radikal bebas berlebihan yang secara langsung terkait dengan tubuh. Radikal bebas yaitu, molekul yang... Baca Selengkapnya di Aktual.com
terima kasih bro.. sudah saya praktekin di blog saya
ReplyDeletehttp://climate4life.blogspot.co.id
Thank gan nice info
ReplyDeletevisit back>>> http://aldiamrullah.blogspot.co.id/
Popular postnya jadi keren gan. Terimakasih banyak atas triknya. Sukses selalu dan salam kenal dari http://www.pemasaranjaringan.com
ReplyDeletekeren gan lihat juga punya saya http://pengembarahitam.blogspot.com/
ReplyDeletemenyimak..
ReplyDeletebagus bisa di mengerti artikelnya
bos saya isi blog ya mw di persingkat bagaimana ya ??
ReplyDeletemohon bantuannya