img.label_thumb{

float:left;

width:80px;

height:80px;

margin-left:4px;

margin-bottom:10px;

-webkit-border-radius: 210px;

-moz-border-radius: 210px;

border-radius: 50%;

text-align: center;

overflow: hidden;

-webkit-box-shadow:

inset 0 0 1px 230px rgba(0,0,0,0.6),

inset 0 0 0 3px #111111;

-moz-box-shadow:

inset 0 0 1px 230px rgba(0,0,0,0.6),

inset 0 0 0 3px #111111;

box-shadow:

inset 0 0 1px 230px rgba(0,0,0,0.6),

inset 0 0 0 3px #111111;

-webkit-transition: box-shadow 400ms ease-in-out;

-moz-transition: box-shadow 400ms ease-in-out;

-o-transition: box-shadow 400ms ease-in-out;

-ms-transition: box-shadow 400ms ease-in-out;

transition: box-shadow 400ms ease-in-out;

/*For IE < 9 so that we have some kind of effect */

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

display: block;

outline: none;

-moz-transition:all .5s ease-in-out; -o-transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out; transition:all .5s ease-in-out; border:0

}

img.label_thumb:hover{

-webkit-box-shadow:

inset 0 0 0 0 rgba(0,0,0,0.6),

inset 0 0 0 20px #0dc3ff,

0 0 10px rgba(0,0,0,0.3);

-moz-box-shadow:

inset 0 0 0 0 rgba(0,0,0,0.6),

inset 0 0 0 20px #0dc3ff,

0 0 10px rgba(0,0,0,0.3);

box-shadow:

inset 0 0 0 0 rgba(0,0,0,0.6),

inset 0 0 0 20px #0dc3ff,

0 0 10px rgba(0,0,0,0.3);

/*For IE < 9 so that we have some kind of effect */

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

-moz-transform:rotate(360deg); -o-transform:rotate(360deg); -webkit-transform:rotate(360deg); transform:rotate(360deg); border:0; }

table.game_grid {font-family: "Trebuchet MS",tahoma,arial; margin: 10px 0px 10px 0px; width: 410px; border-width: 1px 1px 0px 1px; border-style: solid; border-color: #333;}

table.game_grid td { border-bottom: 1px solid #333; padding: 2px 4px 2px 6px; }

table.game_grid td.grid_heading { letter-spacing: 1px; font-weight: bold; color: #eee; font-size: 1.1em; background-color: #0dc3ff; text-align:center; }

table.game_grid td.grid_sysreqs { letter-spacing: 1px; font-weight: bold; color: #333; font-size: 1.1em; background-color: #ccc; text-align:center; }

table.game_grid td.grid_row_title { background-color: #eee; border-right: 1px solid #333;}

4. Letakkan kode berikut di atas </head>

<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>

5. Save template

6. Layout "html/javascript" dain letakkan script berikut

<script type='text/javascript'>var numposts = 8;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 70;</script>

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

 

kode kuning pada script ganti dengan nama label yang ingin di tampilkan.

7.  save dan lihat hasilnya



Silahkan dicoba, semoga bermanfaat..