Madrasah Tsanawiyah Negeri 4 Flores Timur Lebih Baik, Lebih Baik Madrasah Tsanawiyah Negeri 4 Flores Timur

Minggu, 27 September 2015

Cara membuat dan memasang label blog dengan gambar

Label Blog merupakan salah satu widget blog, yang dimana label berfungsi untuk mempermudah pembaca/visitor blog dalam memilih dan memilah artikel mana saja ingin di baca, dipelajari sampai download aplikasi mana saja sesuai dengan tujuan pembaca dalam mengunjungi blog kita.

Bagaiman cara membuat dan memasang label dengan gambar di blog ?? pertanyaan yang mudah untuk di jawab dan di terapkan

Sahabat blogger bisa googling (tanya mbah google) maka akan banyak preferensi yang bisa kita pilih sesuai dengan kehendak kita...
Salah satunya via blog ini saya akan sharing bagaima cara membuat dan memasang label blog dengan gambar hasil googling saya.
langsung saja ini triknya :


  1. Pastikan sobat login di blog sobat
  2. Buka Dashboar blog sobat
  3. Pilih Template >>> Edit Template
  4. Kemudian cari Kode ]]></b:skin> (Gunakan CTRL+F untuk mempermudah pencarian) 
  5. Pastekan kode berikut tepat sebelum kode ]]></b:skin>
  6. /*** Fitur Kategori ***/ img.label_thumb{ float:left; padding:5px; border:1px solid #8f8f8f; background:#D2D0D0; margin-right:10px; height:55px; width:55px; } img.label_thumb:hover{ background:#f7f6f6; } .label_with_thumbs { float: left; width: 100%; min-height: 70px; margin: 0px 10px 2px 0px; adding: 0; } ul.label_with_thumbs li { padding:8px 0; min-height:65px; margin-bottom:10px; } .label_with_thumbs a {} .label_with_thumbs strong {}
  7. Kemudian cari Kode </head> (Gunakan CTRL+F untuk mempermudah pencarian) 
  8. Pastekan kode berikut sebelum kode </head>
  9. <script type='text/javascript'> //<![CDATA[ function labelthumbs(json){document.write('<ul class="label_with_thumbs">');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='http://2.bp.blogspot.com/_IKigl6y9hFA/TMdcT1jzo5I/AAAAAAAAAHA/hAKuT9rJpFU/noimage.jpg';} 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+'" target ="_top"><img class="label_thumb" src="'+thumburl+'"/></a>');document.write('<strong><a href="'+posturl+'" target ="_top">'+posttitle+'</a></strong><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+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+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='<a href="'+commenturl+'" target ="_top">'+commenttext+'</a>';towrite=towrite+commenttext;flag=1;;} if(displaymore==true) {if(flag==1)towrite=towrite+' | ';towrite=towrite+'<a href="'+posturl+'" class="url" target ="_top">More »</a>';flag=1;;} document.write(towrite);document.write('</li>');if(displayseparator==true) if(i!=(numposts-1)) document.write('');}document.write('</ul>');} //]]> </script> - See more at: http://kuc0pas.blogspot.co.id/2012/09/cara-membuat-kategori-label-otomatis.html#sthash.tSgYtzvG.dpuf
  10. Demi untuk menghindari kesalahan saat Edit HTML dalam Template, silahkan sobat klik >> Preview/Pratinjau, jika tidak terjadi eror, silahkan sobat klik >> Simpan Template.
  11. Selanjutnya obat menuju ke Dashboard, Pada tampilan blog baru pilih dan klik Menu >> Tata Letak >> kemudian pilih dan klik >> Tambah Gadget >> Lalu pilih dan klik >> HTML/JavaScript.
  12. Langkah yang berikutnya, Silahkan sobat Masukkah semua kode berikut kedalam kotak HTML/JavaScript.
<script type='text/javascript'>var numposts = 5;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 50;

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

SEKARANG SOBAT COBA LIHAT HASILNYA

NOte :
  1. var numposts = 5 adalah Jumlah daftar isi label atau kategori yang di tampilkan. Silahkan sobat ganti nilainya sesuai dengan keinginan sobat.
  2. var numchars = 50 adalah Jumlah karakter ringkasan isi posting yang di tampilkan. Silahkan sobat ganti nilainya seperti keinginan sobat.
  3. true adalah Kode perintah untuk di tampilkan.
  4. false adalah Kode perintah untuk tidak di tampilkan.
  5. TUTORIAL%2OBLOG adalah Label yang isinya akan di tampilkan. Silahkan sobat ganti dengan label atau kategori blog sobat yang ingin isinya di tampilkan. (Besar kecil huruf harus sama dengan label atau kategori blog sobat, Gunakan %20 jika label atau kategori sobat ada space atau spasinya.
Comments
0 Comments

Tidak ada komentar :

Posting Komentar

Cari Blog Ini

News Populer

Wikipedia

Hasil penelusuran

=">