Sunday 19 June 2016

Cara Membuat Widget Recent Post Perlabel

Selamat datang kembali di Demo IdBoegis, Blog yang membahas seputar Tips Adsense, Tips Komputer, Tutorial Blog, SSH Gratis, Tips Youtube, Tips Smartphone dan informasi internet lainnya.

Pada Artikel kali ini kita akan membahas Cara Membuat Widget Recent Post Perlabel, Postingan ini masih berhubungan dengan Artikel Widget.

Cara Membuat Widget Recent Post Perlabel

Advertisement
Cara membuat widget artikel terbaru - Pada kesempatan ini, saya akan berbagi cara membuat widget artikel terbaru/ recent post berdasarkan label tertentu dengan thumbnail. Widget ini akan bekerja secara otomatis menampilkan update artikel terbaru kita hanya pada label yang tentunya bisa anda pilih sendiri label mana yang akan ditampilkan. Oke langsung saja tanpa harus banyak intro...

Cara Membuat Widget Recent Post Perlabel

Cara Membuat Recent Post Per Label With Thumbnail

1. Login ke akun blogger.com
2. Pilih Template kemudian Edit HTML
3. Jangan lupa centang Expand Template Widget

4. Masukkan kode css berikut di atas kode ]]></b:skin>
 img.label_thumb{float:left; padding:5px; border:1px solid #8f8f8f; background:#D2D0D0; margin-right:10px; height:55px; width:55px}
img.label_thumb:hover{background:#f7f6f6}
.label_with_thumbs{float:left; width:100%; min-height:70px; margin:0px 10px 2px 0px; adding:0}
ul.label_with_thumbs li{padding:8px 0; min-height:65px; margin-bottom:10px}
.label_with_thumbs a{}
.label_with_thumbs strong{}

5. Lalu cari kode </head> dan letakkan kode di bawah ini tepat di atasnya
 <script src='http://adablogku.googlecode.com/files/lebelgambar.js' type='text/javascript'/>  

6. Simpan Template.

7. Kemudian pilih Tata Letak lalu Tambah Gadget >> HTML/Javascript
8. Masukan kode berikut ini ke dalamnya:
<script type='text/javascript'>var numposts = 3;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 80;</script>
<script type="text/javascript" src="/feeds/posts/default/-/NAMALABEL?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

9. Ganti teks NAMALABEL dengan nama label yang akan ditampilkan.

10. Simpan jika sudah selesai. Selamat mencoba :)

Demikian artikel kali ini mengenai cara membuat recent post di blog. Terimakasih telah membaca artikel di atas :)


EmoticonEmoticon