Cara Membuat Featured Anime Random (Acak setelah di refresh)

Untuk DEMO kalian bisa lihat di Blog ini

Anime Seventeen

Pertama kalo mau memasang Widget di atas postingan kita harus mengubah dulu kode berikut
<b:section class='main' id='main' showaddelement='no'>

Ganti jadi
<b:section class='main' id='main' showaddelement='yes'>

Kedua Kopikan kode berikut di Widget HTML yang sudah anda buat di atas postingan tadi.

<style>
#random-posts img{
width: 116px;
height: 145px;
border: 1px solid #CCC;
padding: 1px;}
#random-posts img:hover{}
ul#random-posts {
list-style-type: none;
padding: 0px;}
#random-posts a {
font-size: 12px;
color:#333;
width: 120px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-weight: bold;
margin: 3px 0px;
text-align: center;}
#random-posts a:hover {
text-decoration: none;}
.rp-snippet {
font-size: 11px;
background: none; 
padding: 5px; 
margin-right: 8px; 
display:none;}
#random-posts span {}
#random-posts li {
margin: 10px 1px 10px 5px;
float: left;
overflow: hidden;
width: 121px;}
</style>
<ul id='random-posts'><script type='text/javaScript'>var rdp_numposts=5;var rdp_snippet_length=0;var rdp_info='no';var rdp_comment='comment';var rdp_disable='Comments Disabled';var rdp_current=[];var rdp_total_posts=0;var rdp_current=new Array(rdp_numposts);function totalposts(json){rdp_total_posts=json.feed.openSearch$totalResults.$t}document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default/-/Episode1?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');function getvalue(){for(var i=0;i<rdp_numposts;i++){var found=false;var rndValue=get_random();for(var j=0;j<rdp_current.length;j++){if(rdp_current[j]==rndValue){found=true;break}};if(found){i--}else{rdp_current[i]=rndValue}}};function get_random(){var ranNum=1+Math.round(Math.random()*(rdp_total_posts-1));return ranNum};</script><script type='text/javaScript'> function random_posts(json){for(var i=0;i<rdp_numposts;i++){var entry=json.feed.entry[i];var rdp_posttitle=entry.title.$t;if('content'in entry){var rdp_get_snippet=entry.content.$t}else{if('summary'in entry){var rdp_get_snippet=entry.summary.$t}else{var rdp_get_snippet="";}};rdp_get_snippet=rdp_get_snippet.replace(/<[^>]*>/g,"");if(rdp_get_snippet.length<rdp_snippet_length){var rdp_snippet=rdp_get_snippet}else{rdp_get_snippet=rdp_get_snippet.substring(0,rdp_snippet_length);var space=rdp_get_snippet.lastIndexOf(" ");rdp_snippet=rdp_get_snippet.substring(0,space)+"&#133;";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rdp_commentsNum=entry.thr$total.$t+' '+rdp_comment}else{rdp_commentsNum=rdp_disable};if(entry.link[j].rel=='alternate'){var rdp_posturl=entry.link[j].href;var rdp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rdp_thumb=entry.media$thumbnail.url}else{rdp_thumb="https://sites.google.com/site/anime7teen/jaquary/no-image-available.jpg"}}};document.write('<li>');document.write('<a href="'+rdp_posturl+'" rel="nofollow"><img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/></a>');document.write('<div><a href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_posttitle+'">'+rdp_posttitle+'</a></div>');if(rdp_info=='yes'){document.write('<span><div  class="rp-info">'+rdp_postdate.substring(8,10)+'/'+rdp_postdate.substring(5,7)+'/'+rdp_postdate.substring(0,4)+' - '+rdp_commentsNum)+'</div></span>'};document.write('<div class="rp-snippet">'+rdp_snippet+'</div><div style="clear:both"></div></li>')}};getvalue();for(var i=0;i<rdp_numposts;i++){document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default/-/Episode1?alt=json-in-script&start-index='+rdp_current[i]+'&max-results=1&callback=random_posts\"><\/script>')};
</script>
</ul>

Ganti Episode1 jadi Label kalian...(Inget ini cuman buat blogger ok!
untuk pengaturan yang lain kalian pasti udah pada tau... Tapi awas!! kalo yang ga bisa ngubah meningan ga usah.. soalnya kalo ada yang salah 1 huruf pun.. Featured Anime kalian ngga akan muncul..

Lalu "Save"........

Dan lihat hasilnya!


Kenapa? Gambarnya burem? Nih saya kasih caranya (liat gambar di bawah)

Pertama kalian harus tahu nama HTML dari Widget kalian! liat gambar di atas yang "hitamkan" id="HTML4"
nah ini nantinya akan dipakai untuk Script agar gambar jadi ngga burem...

Setelah sudah ketemu langsung ajah kopikan Script di bawah ini tepat di atas "</b:includable>" inget harus di dalem Widget yang kalian pasang Featured Anime nyah ok!....

<script>
//<![CDATA[
function resizeThumb(parentID, size) {
    var parent = document.getElementById(parentID),
        image = parent.getElementsByTagName('img');
    for (var i = 0; i < image.length; i++) {
        image[i].src = image[i].src.replace(/\/s72\-c/, "/s" + size + "-c");
        image[i].width = size;
        image[i].height = size;
    }}
 resizeThumb('Fansublogger', 200,160);
//]]>
    </script>

Ganti "Fansublogger" Jadi nama HTML Widget yang sudah kalian pasang Featured Anime!

Mohon maaf untuk Tutorial yang sangat Rumit dan menyusahkan dengan bahasa yang acak2-an......
Juga tolong... kalo yang punya blog Sendiri...
Bisa ngga? cantumin blog ini buat jadi Partner ato Link Ex....
Atau ngga bantu share Blog ini di blog kalian.... Itu juga kalo kalian mau.. kalo ngga? ya ngga apa2

Semoga bermanfaat!