Home » , » Cara Membuat Recent Post By Label Thumbnail Saja Di Blog

Cara Membuat Recent Post By Label Thumbnail Saja Di Blog

Written By Ku Copas on Sunday, 4 March 2012 | 3/04/2012 12:12:00 am

KUCOPAS - Cara Membuat Recent Post By Label Thumbnail Saja Di Blog. Kali ini saya akan share tips dan trik lagi, yaitu tutorial blogger pemula tentang Cara Membuat Widget Recent Post By Label Dengan Thumbnail Atau Gambar Saja di Blog. Tentunya bagi sobat webmaster, tutorial ini sangat jadul sekali. Tapi bagi blogger newbie seperti saya ini, trik yang seperti ini perlu di coba dan di terapkan dalam blog.

Recent post adalah daftar posting terbaru atau juga sering disebut dengan artikel terbaru, berita terbaru. Dalam hal ini kita akan membuat widget yang khusus untuk recent post berdasarkan label atau kategori yang disertai dengan hanya thumbnail (gambar) saja dan tanpa judul artikel postingan.

Tujuan membuat widget recent post by label dengan thumbnail gambar saja di blog yaitu untuk mempercantik blog sobat, namun fungsinya bukan itu saja dan masih bayak lagi. Salah satu contoh fungsi Recent Post By Label Dengan Thumbnail Atau Gambar Saja yang di pasang dalam blog adalah tampilannya yang sangat cantik dan bisa untuk membuat pengunjung blog agar terpikat dan penasaran dengan berita yang ada di balik Thumbnail atau Gambar yang sobat pasang. Alhasil, para pengunjug di blog sobat tidak akan merasa bosan berlama-lama membaca artikel-artikel posting dalam blog sobat.

Cara membuat dan memasangnya di blog sangatlah mudah, sebab sobat tidak perlu susah-susah edit kode dalam template yang tentunya sangat rumit dilakukan oleh para blogger pemula seperti saya ini.

Agar sobat tidak penasaran tentang bagaimana tampilannya Widget Recent Post By Label Dengan Thumbnail Atau Gambar Saja di Blog, Sobat bisa melihat gambar screenshot dibawah ini.

Cara Membuat Widget Recent Post By Label Dengan Thumbnail Atau Gambar Saja di Blog

Bila sobat tertarik ingin membuat dan memasang Widget Recent Post By Label Dengan Thumbnail Gambar Saja di blog sobat, silahkan ikuti langkah-langkahnya berikut ini.

1. Login atau Masuk ke Blogger.com menggunakan akun sobat.
2. Pada Dashboard Blogger tampilan baru. Pilih dan klik Menu >> Tata Letak.
3. Lalu sobat pilih >> Add Gadget atau Tambah Gadget.
4. Pilih >> HTML/Java Script.
5. Kemudian silahkan sobat masukkan semua kode dibawah ini ke dalam kotak HTML/Java Script.

<style>
/*** Labels Thumbs ***/
img.label_thumb{
float:left;
border:1px solid #ccc;
width:85px;
height:70px;
margin-right:10px;
margin-bottom:10px;
}

</style>
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(json){document.write('<div>');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}
var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)
{s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl=d;}
else thumburl='';}
document.write('<a href="'+posturl+'" title="'+posttitle+'"><img class="label_thumb" src="'+thumburl+'"/></a>');
if(i!=(numposts-1))
document.write('');}
document.write('</div>');}
//]]>
</script>
<script type='text/javascript'>var numposts = 9;</script>
<script type="text/javascript" src="/feeds/posts/default/-/NamaLabel?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>
Keterangan:
1. var numposts = 9 >> Angka 9 adalah jumlah recent post by label yang akan di tampilkan di blog sobat, Silahkan di ganti sesuai dengan keinginan sobat.

2. Nama Label = Isi dengan Nama Label yang daftar thumbnail atau gambarnya ingin di tampilkan di blog sobat.
Contoh label >> "tutorial blog". Label yang menggunakan space (spasi), Silahkan sobat pisahkan dengan %20. Sehingga menjadi tutorial%20blog.
  • Ingat, Nama label harus cocok atau sesuai dengan label blog sobat yang ingin di tampilkan daftar thumbnail atau gambarnya dalam widget blog sobat.
  • Bila sudah selesai meng-edit, jangan lupa di Simpan ya sobat... dan silahkan lihat hasil nya...
Demikian tips dan trik Cara Membuat Widget Recent Post By Label Dengan Thumbnail Atau Gambar Saja di Blog, Semoga bisa sangat bermanfaat bagi sobat semua untuk mempercantik blog.

Artikel Terkait:

thumbnail Title: Cara Membuat Recent Post By Label Thumbnail Saja Di Blog
Posted by:Ku Copas
Published :2012-03-04T00:12:00+07:00
Rating: 5
Reviewer: 737 Reviews
Cara Membuat Recent Post By Label Thumbnail Saja Di Blog
Comments
2 Comments

2 comments:

  1. Info yang baguz sekali untuk disimak.....
    Bermanfaat sekali untuk saya....

    Mohon kunjungan baliknya yaa....
    Dan saya juga sangat berterima kasih sekali kalau anda berkenan FOLLOW dan Backlink Blog sederhana saya.... :-)

    ( zamrudhijau.blogspot.com )

    ReplyDelete
  2. @Zamrud >> Iya di tunggu kunjungan baliknya gan...

    ReplyDelete

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