Cara Membuat Widget Recent Post Dengan Thumbnail
– Widget Recent Post atau artikel terbaru umumnya
ditempatkan diposisi sidebar. Sedangkan jenis widget recent post menurut
sepengetahuan saya hanya ada 2, yaitu widget
recent post dengan thumbnail yang statis/diam (tidak bergerak) dan ada juga widget recent post dengan slide show/bergerak
(model tayangan). Nah yang mau kita bahas pada tips blogging kali ini adalah membuat widget recent post yang statis tapi
ada gambar/thumbnailnya seperti yang ada di sidebar blog ini, biar ngga
susah-susah nyari contohnya he he. Cara
membuatnya mudah saja koq, silahkan sobat ikuti langkah-langkahnya dibawah
ini.
Cara Membuat Widget Recent Post dengan Thumbnail :
1.
Login ke dashboard blogger anda.
2.
Pilih Rancangan > Elemen Halaman > Add
Gadget (HTML/JavaScript).
3.
Copy kode CSS dan JavaScript dibawah ini dan
paste pada gadget yang baru dibuat tadi.
<right><style>
img.recent_thumb {padding-right:5px;padding-left:padding-bottom:0px;0px;width:55px;height:40px;border:0;float:left;margin:0 0 5px 0px;}
.recent_posts_with_thumbs {float: left;width: 100%;min-height: 50px;margin: 0px 0px 5px 0px;padding: 0;font-size:15px;font-color:black;font-family:calibri;}
ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;padding-left:0px;padding-right:20px;min-height:50px;list-style:normal;}
.recent_posts_with_thumbs a {text-decoration:none;}
.recent_posts_with_thumbs normal {font-size:13px;}
</style>
<script style="text/javascript" src="http://bloggerplugins.org/scripts/recentpostswiththumbs.js"></script>
<script style="text/javascript">
var numposts = 8;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = false;
var numchars = 75;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs"></script></right>
4.
Simpan dan lihat hasilnya.
5. Silahkan memodifikasi sendiri script ini untuk merubah
ukuran gambar/thumbnail, jenis dan warna huruf serta jumlah posting yang ingin ditampilkan
pada widget.
Mudah saja bukan cara membuat widget recent post dengan thumbnail ini ? Kalo masih kesulitan juga silahkan tulis
dikomentar OK ! Selamat mencoba dan salam blogger.
No comments:
Post a Comment