Home » , , , » Cara Membuat Recent Post Berdasarkan Label Kategori Dengan Thumbnail Gambar Di Blog

Cara Membuat Recent Post Berdasarkan Label Kategori Dengan Thumbnail Gambar Di Blog

Written By Ku Copas on Wednesday, 12 September 2012 | 9/12/2012 12:23:00 pm

KUCOPAS - Cara Membuat Recent Post Berdasarkan Label Kategori Dengan Thumbnail Gambar Di Blog. Pada kesempatan kali ini saya akan berbagi trik seputar dunia blogger, yaitu tentang cara membuat recent post berdasarkan label atau kategori dengan gambar (Thumbnail) diblog.

Recent Post adalah artikel postingan blog yang paling terbaru, namun trik yang akan saya share kali ini adalah recent post berdasarkan label atau kategori dengan thumbnail atau gambar. Jadi intinya recent post ini hanya akan menampilkan artikel terbaru dari label atau kategori yang bisa kita tentukan sendiri dan sertai dengan gambar atau thumbnail.

Fungsi dari recent post perlabel atau kategori dengan gambar atau thumbnail ini adalah bisa untuk mempercantik tampilan blog kita dan juga bisa untuk mengategorikan isi dari semua masing-masing artikel blog kita yang ingin di tampilkan pada satu widget maupun laman. Selain itu juga bisa untuk memudahkan para pengunjung blog kita untuk mencari artikel yang dibutuhkan dalam label atau kategori tertentu.

Sobat bisa melihat contohnya yang sudah saya pasang pada laman blog ini, Silahkan sobat klik menu Trik Blog pada menu bagian atas blog ini. Tampilan dari recent post perlabel dengan thumbnail ini kurang lebih seperti gambar screenshot berikut dibawah ini.

Cara Membuat Recent Post Berdasarkan Label Kategori Dengan Thumbnail Gambar Di Bog

Cara pemasangan recent post perlabel atau kategori dengan gambar atau thumbnail diblog, triknya sangat mudah sekali. Karena sobat tinggal memasukkan semua kode script yang saya sediakan kedalam kotak HTML/JavaScript yang berada pada Tambah Gadget Tata letak blog. Selain itu sobat juga bisa memasangnya dipostingan maupun laman blog, dan tentu saja tanpa susah-susah Edit HTML dalam Template blog sobat.

Jika sobat tertarik untuk memasang recent post perlabel atau kategori dengan gambar atau thumbnail di blog sobat, silahkan ikuti langkah-langkahnya sebagai berikut.

Cara Memasang Recent Post By Label With Thumbnail Di Sidebar Blog
  1. Langkah pertama, silahkan sobat >> Masuk/Login ke Blogger.com menggunakan akun sobat.
  2. Pada Dashboard tampilan blogger baru, pilih dan klik Menu >> Tata Letak >> Tambah gadget >> HTML/JavaScript.
  3. Kemudian >> Masukkan semua Kode berikut ke dalam kotak HTML/JavaScript.
<style>
img.recent_thumb {padding:1px;width:55px;height:55px;border:0; float:right;margin:0 0 5px 10px;}.recent_posts_with_thumbs {float: left;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://kucopas.googlecode.com/files/recent-post-by-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://kuc0pas.blogspot.com/feeds/posts/default/-/TUTORIAL%20BLOG?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs">
</script>

4. Setelah sobat masukkan semua kode kedalam kotak HTML/javaScript, langkah yang terakhir silahkan sobat klik >> Simpan dan lihat hasilnya.

Cara Memasang Recent Post By Label With Thumbnail Pada Postingan Dan Laman Blog
  1. Silahkan sobat >> Masuk/Login >> Ke Blog sobat.
  2. Setelah berhasil masuk, silahkan sobat pilih dan klik >> Buat Entri Baru atau klik Menu Laman.
  3. Kemudian sobat masukkan semua Kode di atas tadi, dengan catatan sobat masukkan Kode pada Mode HTML dan bukan Compose dalam Entri Baru maupun Laman.
  4. Langkah yang terakhir silahkan sobat klik >> Publikasikan dan lihat hasilnya.
Keterangan:
  • var numposts = 10 adalah Jumlah artikel posting yang akan di tampilakan. Ganti nilainya sesuai dengan keinginan sobat.
  • var numchars = 150 adalah Jumlah karakter atau cuplikan tulisan posting yang akan di tampilkan. Ganti nilainya sesuai dengan keinginan sobat.
  • http://kuc0pas.blogspot.com Ganti dengan alamat URL blog sobat.
  • TUTORIAL%20BLOG adalah Label atau kategori yang akan di tampilkan daftar isinya. Ganti dengan Label atau kategori blog sobat. Besar kecil huruf harus harus sesuai dengan label blog sobat. Gunakan %20 jika label blog sobat ada Space atau spasinya.
Sampai disini saya kira sobat pasti sudah bisa membuat dan memasangnya di blog sobat. Namun jika sobat masih menemui kesulitan untuk Membuat Dan memasang Recent Post Berdasarkan Label Kategori Dengan Thumbnail Gambar Di Blog sobat, silahkan bertanya dalam form komentar yang tersedia.

Semoga trik artikel seputar dunia blog yang saya share ini bisa sangat bermanfaat bagi sobat KUCOPAS semua. Selamat berkarya...

Artikel Terkait:

thumbnail Title: Cara Membuat Recent Post Berdasarkan Label Kategori Dengan Thumbnail Gambar Di Blog
Posted by:Ku Copas
Published :2012-09-12T12:23:00+07:00
Rating: 5
Reviewer: 737 Reviews
Cara Membuat Recent Post Berdasarkan Label Kategori Dengan Thumbnail Gambar Di Blog
Comments
7 Comments

7 comments:

  1. wah bagus sekali ya hasilnya...trima kasih sudah membagikan ilmu yang bermanfaat dan mudah dimengerti

    ReplyDelete
  2. This comment has been removed by a blog administrator.

    ReplyDelete
  3. Mantap gan ane dah coba... tapi gak keluar hehe mungkin blog ane yg brmasalah :D

    Mampir ya ke http://serbakuis.blogspot.com

    ReplyDelete
  4. jos mas,,,,terima kasih atas bantuanya.

    ReplyDelete
  5. min, bagaimana caranya supaya tampilannya bisa menjadi grid, hanya menampilkan tumbnail saja

    ReplyDelete

 
Support : Google | Yahoo | Bing
Copyright © 2011-2013. KUCOPAS - All Rights Reserved
Sitemap | About Me | Contact Us | Privacy Policy
Proudly powered by Blogger