Cara Membuat Widget Artikel Terbaru Berdasarkan Label dengan Thumbnail
Setelah sebelumnya kita membahas cara membuat widget artikel terbaru berdasarkan label, pada kesempatan ini kita mengulas kembali tapi dengan menggunakan script yang berbeda. Yang membedakan widget yang akan kita bahas nanti dengan sebelumnya adalah widget artikel terbaru berdasarkan label ini nanti disertai dengan thumbnail gambar.
Penasaran ingin segera memasangnya pada blog? Ikuti langkah-langkahnya berikut ini :
1. Login akun blogger Anda.
2. Pilih Tata Letak ---> Tambah Gadget ---> HTML/JavaScript.
3. Letakkan kode berikut ini pada HTML/JavaScript.
var numposts = 10; Jumlah artikel yang akan ditampilkan.
var numchars = 150; Jumlah karekter posting yang akan ditampilkan.
http://id-pemula.blogspot.com Ganti dengan URL blog Anda.
Tutorial%20Blog Ganti dengan nama label yang ingin Anda tampilkan.
4. Kemudian Simpan.
Nah, sekarang pengunjung blog Anda dapat melihat posting sekaligus gambarnya dalam widget artikel terbaru berdasarkan label tersebut.
Penasaran ingin segera memasangnya pada blog? Ikuti langkah-langkahnya berikut ini :
1. Login akun blogger Anda.
2. Pilih Tata Letak ---> Tambah Gadget ---> HTML/JavaScript.
3. Letakkan kode berikut ini pada HTML/JavaScript.
<style>
img.recent_thumb {padding:1px;width:55px;height:55px;border:0; float:left;margin:0 0 5px 10px;}.recent_posts_with_thumbs {float: right;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:65px;}.recent_posts_with_thumbs a {text-decoration:none;}.recent_posts_with_thumbs strong {font-size:10px;} </style><script src="http://id-pemula-javascript.googlecode.com/files/recent-post-label-thumbnail.js">
</script><script>
var numposts = 10;var showpostthumbnails = true;var displaymore = true;var displayseparator = true;var showcommentnum = true;var showpostdate = true;var showpostsummary = true;var numchars = 150;
</script><script src="http://id-pemula.blogspot.com/feeds/posts/default/-/Tutorial%20Blog?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs">
</script>
Keterangan :img.recent_thumb {padding:1px;width:55px;height:55px;border:0; float:left;margin:0 0 5px 10px;}.recent_posts_with_thumbs {float: right;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:65px;}.recent_posts_with_thumbs a {text-decoration:none;}.recent_posts_with_thumbs strong {font-size:10px;} </style><script src="http://id-pemula-javascript.googlecode.com/files/recent-post-label-thumbnail.js">
</script><script>
var numposts = 10;var showpostthumbnails = true;var displaymore = true;var displayseparator = true;var showcommentnum = true;var showpostdate = true;var showpostsummary = true;var numchars = 150;
</script><script src="http://id-pemula.blogspot.com/feeds/posts/default/-/Tutorial%20Blog?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs">
</script>
var numposts = 10; Jumlah artikel yang akan ditampilkan.
var numchars = 150; Jumlah karekter posting yang akan ditampilkan.
http://id-pemula.blogspot.com Ganti dengan URL blog Anda.
Tutorial%20Blog Ganti dengan nama label yang ingin Anda tampilkan.
4. Kemudian Simpan.
Nah, sekarang pengunjung blog Anda dapat melihat posting sekaligus gambarnya dalam widget artikel terbaru berdasarkan label tersebut.
0 komentar:
Dí lo que piensas...