Cara Membuat Recent Post Berdasarkan Kategori Label Dengan Thumbnail


Cara Membuat Recent Post Berdasarkan Kategori Label Dengan Thumbnail - Fungsi dari fitur ini adalah untuk lebih memudahkan pembaca agar menemukan artikel yang dicarinya. Karena tampilannya disertai dengan gambar thumbnail, maka pengunjung akan lebih tertarik untuk melihat isi dari artikel postingan tersebut secara lengkapnya.

cara membuat recent pos berdasarkan kategori label, cara membuat recent post dengan thumbnail, cara membuat label kategori tertentu endolita.blogspot.com

Lihat, nanti hasilnya akan seperti ini:

cara membuat recent pos berdasarkan kategori label, cara membuat recent post dengan thumbnail, cara membuat label kategori tertentu endolita.blogspot.com

Jika tertarik, silahkan ikuti langkahnya berikut ini:

  1. Login ke akun Blogger
  2. Klik Template > Edit HTML
  3. Cari kode ]]></b:skin> lalu simpan script berikut di atasnya:

    4. /*** 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 {}

  4. Cari kode </head> , letakkan script berikut di atasnya

    5. <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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiNP6r-Te6Qnqn8lyhT8e4QhHDMkoOnv91jC3Ax49UbL6EGbsQfrhIJLcYF6oOjPJUk-Zhr_WMgLG8mylKo_glAZ80M3H1DFFfq0swH0InizdkbpU8B2ES25cTWISxiWB-foAeXuTcf-sB/';}
    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>

  5. Simpan Template
  6. Terakhir, masuk ke menu Tata Letak > pilih Tambah Gadget > pilih HTML/JavaScript
  7. Pastekan Kode berikut:

    8. <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/-/BISNIS%20ONLINE?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>
  8. Simpan Template

Catatan:
  • var numposts = 5 adalah Jumlah daftar isi label atau kategori yang di tampilkan. Silahkan Anda ganti nilainya sesuai dengan keinginan.
  • var numchars = 50 adalah Jumlah karakter ringkasan isi posting yang di tampilkan. Silahkan Anda ganti nilainya seperti keinginan.
  • true adalah Kode perintah untuk di tampilkan.
  • false adalah Kode perintah untuk tidak di tampilkan.
  • BISNIS%20ONLINE adalah Label yang isinya akan di tampilkan. Silahkan Anda ganti dengan label atau kategori blog Anda yang ingin isinya di tampilkan. (Besar kecil huruf harus sama dengan label atau kategori blog Anda, Gunakan %20 jika label atau kategori Anda ada space atau spasinya.
tags: #cara membuat recent pos berdasarkan kategori label # cara membuat recent post dengan thumbnail # cara membuat label kategori tertentu

Semoga artikelnya bermanfaat. Cek di bawah ini untuk tutorial blog lainnya:

Komentar

Posting Komentar

Postingan populer dari blog ini

Tersingkapnya Kebungkaman Nayla

Gambar
Gadis itu masih tertegun di tepi danau yang tenang, di balik pekarangan milik pamannya. Ia nampak begitu tenang pula masih dengan balutan selendang di kepalanya, menutupi setiap helai rambutnya namun samar samar mampu kulihat legam warna di balik selendang putih susu itu. Aku belum mengerti apa yang sedang ia pikirkan disana. Aku tak kuasa mendekat, hanya mampu memerhatikannya dari kejauhan. Sudah beberapa kali aku tak menyambangi danau ini, tak duduk di tepian danau dan kayu lapuk yang bertengger dengan tenang disana. Walau begitu kayu lapuknya masih mampu menampung berat badanku dengan nyaman. Ya, semenjak gadis yang selalu berselendang itu menyinggahi tempat semediku. Aku hanya diam saja tak berontak karena dia telah merebut tempat yang selama ini kujadikan persembunyian dari kejaran pikiran yang riuh rendah. Mungkin karena guratan di wajahnya mengisyaratkan sendu dan pilu yang begitu mendalam. Aku pun heran, mengapa tak ada sanak keluarganya yang datang untuk sekadar menyapanya jik...
Baca selengkapnya

Kelakar Trotoar

Gambar
Dear Nesha Allea, Nesh semalam entah mengapa kamu hadir lagi dalam lamunanku, entah tak ku ingat seberapa pekat malam itu. Bisa jadi sepekat coklat hangat yang biasa kau seduh, bisa jadi lebih Nesh. Sebab aku tak sedikitpun mendengar suara gaduh (kecuali, dipikiranku). Mungkin aku terlalu lama membolak-balik laman jejaring sosialmu saat itu. Nesh, apa kabarmu? Tanpa ku sadari hari ini tepat hari ke tujuh puluh satu sejak kau tak muncul dalam janji yang kau buat sendiri. Maafkan aku Nesh, mungkin aku serupa benalu di hidupmu. Aku terlalu menganggumu. Kau marah dengan ku? Tak apalah Nesh mungkin aku harus terbiasa menjadi pecundang yang hadirnya tak pernah kau harapkan. Kau ingat Nesh saat itu kau masih berusia lima belas tahun tepat di tanggal satu, sedangkan usiaku tepat tujuh bulan mendahuluimu. Kau senang sekali ketika aku menghadiahkanmu sebuah penanda kunci, ya seingatku kau terlalu mudah meletakan sesuatu lalu melupakannya (ya, termasuk aku contohnya). Maka dari itu ku beri kau ha...
Baca selengkapnya

I Think It Is Not About Love

Gambar
People nowadays love to talk about love, even it hurt even it happy. The best part is "i am falling love" Who is the one do not need a love? I thinks there isn't. But, i will tell not about love, i will tell a thing about friendship. When you go out. it's friendship. When you have happy times, it's friendship. When you have a same habit. it's friendship. When you love. it's friendship. When you gave an advice. it's friendship. When you won't let. it's friendship. When you are hoping & jealous. Isn't it still friendship ? YUTTA PARAMARESI TENTANG PENULIS: PELAJAR/MAHASISWI WEBSITE/BLOG: http://rumahyutta.blogspot.co.id
Baca selengkapnya