Cara Menampilkan Katagori Dengan Gambar

Cara Menampilkan Katagori Dengan Gambar

Baiklah kalau sahabat tertarik untuk membuat Cara Menampilkan Katagori Dengan Gambar berikut langkah langkah yang harus sahabat lakukan :

1. Login ke akun Blogger

2. Pilih Tata Letak

4. Tambahkan Widget baru "Add Gadget"

5. Pilih HTML/Javasript

6. Copy kode dibawah ini dan pastekan kedalamnya :

<style>

    /*Katagori Gambar*/

    img.label_gambar{

    float:left;

    padding:5px;

    width:100px;

    height:100px;

    margin-right:1px;

    margin-bottom:1px;

    }

</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_gambar" src="'+thumburl+'"/></a>');

    if(i!=(numposts-1))

    document.write('');}

    document.write('</div>');}

    //]]>

    </script>

    <script type='text/javascript'>var numposts =7;</script>

    <script type="text/javascript" src="/feeds/posts/default/-/Blogger?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

7. Ganti lebar dan tinggi gambar width:100px; height:100px;sesuai selera sahabat, Ganti angka 7 dengan jumlah gambar yang akan ditampilkan. Ganti Tulisan Blogger dengan katagori yang ingin sahabat tampilkan

8.Simpan dan lihatlah hasilnya

Baiklah kalau sahabat tertarik untuk membuat  Cara Menampilkan Katagori Dengan Gambar  berikut langkah langkah yang harus sahabat lakukan : ...