Selamat siang sob, pada kesempatan kali ini saya mau posting nih tentang bagai mana Cara Membuat Widget Recent Post By Tag Label – Widget ini berguna untuk menampilkan daftar posting terbaru berdasarkan masing-masing label, bisa juga untuk diterapkan pada sidebar untuk menampilkan recent post berdasarkan label tertentu. tapi semua tergantung dari pengaturan untuk kebutuhan seperlunya dari blog tersebut. Ooke deh sob, ngga usah panjang lebar lagi, langsung aja nih kita mulai cara pemasanganya.
1. Pertama, copy kode berikut ini lalu taruh di atas kode
</head>
<script type='text/javascript'> //<![CDATA[ function removeHtmlTag(strx,chop){if(strx.indexOf("<")!=-1){var s=strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length)}}strx=s.join("")}chop=(chop<strx.length-1)?chop:strx.length-2;while(strx.charAt(chop-1)!=' '&&strx.indexOf(' ',chop)!=-1)chop++;strx=strx.substring(0,chop-1);return strx+'...'}function createSummaryAndThumb(pID){var div=document.getElementById(pID);var imgtag="";var img=div.getElementsByTagName("img");var summ=summary_noimg;if(img.length>=1){imgtag='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';summ=summary_img}var summary=imgtag+'<div>'+removeHtmlTag(div.innerHTML,summ)+'</div>';div.innerHTML=summary}function labelthumbs(json){document.write('<ul class="taglabel">');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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqIs6fWLKBeOmE0f3sf1cyUPdOGg5U_jv4wvoCOIUJ0ZfsG6yfeKh7lfUgskUgozeFCgBdHn0f2QnPeLWTSOisyDoKyRnE4wyuodjkFHtGF-f9ycMJrwX3DLziWCdQE09hSrq7dUowK0-i/'}var postdate=entry.published.$t;var cdyear=postdate.substring(0,4);var cdmonth=postdate.substring(5,7);var cdday=postdate.substring(8,10);var monthnames=new Array();monthnames[1]="Jan";monthnames[2]="Feb";monthnames[3]="Mar";monthnames[4]="Apr";monthnames[5]="May";monthnames[6]="Jun";monthnames[7]="Jul";monthnames[8]="Aug";monthnames[9]="Sep";monthnames[10]="Oct";monthnames[11]="Nov";monthnames[12]="Dec";document.write('<li class="clearfix">');if(showpostthumbnails==true)document.write('<a href="'+posturl+'"><img alt="'+posttitle+'" title="'+posttitle+'" class="label_thumb" src="'+thumburl+'"/></a>');document.write('<a href="'+posturl+'" title="'+posttitle+'">'+posttitle+'</a><br>');if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";var re=/<\S[^>]*>/g;postcontent=postcontent.replace(re,"");if(showpostsummary==true){if(postcontent.length<numchars){document.write('');document.write(postcontent);document.write('')}else{document.write('');postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...');document.write('')}}var towrite='';var flag=0;document.write('<br>');if(showpostdate==true){towrite=towrite+cdday+'-'+monthnames[parseInt(cdmonth,10)]+'-'+cdyear;flag=1}if(showcommentnum==true){if(flag==1){towrite=towrite+' | '}if(commenttext=='1 Comments')commenttext='1 Comment';if(commenttext=='0 Comments')commenttext='No Comments';commenttext=''+commenttext+'';towrite=towrite+commenttext;flag=1}if(displaymore==true){if(flag==1)towrite=towrite+' | ';towrite=towrite+'<a href="'+posturl+'" class="url" title="'+posttitle+'">More »</a>';flag=1}document.write(towrite);document.write('</li>');if(displayseparator==true)if(i!=(numposts-1))document.write('')}document.write('</ul>')} //]]> </script>2. Kemudian copy lagi kode berikut ini dan taruh di atas kode
]]></b:skin>
img.label_thumb{float:left;border:1px solid #aaa;margin-right:5px;height:55px;width:55px;padding:5px} .taglabel{float:left;width:100%;padding:0;margin:0} ul.taglabel li{padding:5px 0;min-height:73px}3. Selanjutnya pasang kode berikut ini pada Widget HTML/Javascript.
<script type='text/javascript'> var numposts = 5; // Jumlah Post yang di tampilkan var showpostthumbnails = true; // Ganti "false" untuk tidak menampilkan [Thumbnail] var displaymore = false; // Ganti "true" untuk menampilkan link [More] var displayseparator = false; var showcommentnum = false; // Ganti "true" untuk menampilkan [Komentar] var showpostdate = false; // Ganti "true" untuk menampilkan [Tanggal] var showpostsummary = true; // Ganti "false" untuk tidak menampilkan [Deskripsi Post] var numchars = 60; // Character Deskripsi yang di tampilkan </script> <script type="text/javascript" src="/feeds/posts/default/-/NAMA_LABEL?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>Perhatikan pada baris ini:
<script type="text/javascript" src="/feeds/posts/default/-/NAMA_LABEL?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>Apabila ingin merubah recent post menjadi default(tidak berdasarkan sebuah label), ganti baris kode tersebut dengan kode berikut ini:
<script type="text/javascript" src="/feeds/posts/default?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>Kalo sobatingin memasang di bagian bawah post homepage tapi pada template sobat belum ada elemen kolom widget, maka buat terlebih dahulu kolom widget untuk tempat penyimpanan kodenya,
untuk cara pembuatanya sobat bisa lihat di sini caranya Ooke deh, mungkin cuma itu saja yang bisa saya posting pada kesempatan ini, semoga bergun adan bermanfaat ya,. Trimakasih
Post a Comment
Pembaca yang baik selalu meninggalkan jejaknya, Silahkan berkomentar dengan bahasa yang sopan ^_^
friendConnectJs/>- Dilarang berkomentar menggunakan Live Link !!!
- Dilarang promosi disini !
- Berkomentarlah dengan sopan dan bijak sesuai dengan isi konten !!!