Home » » Cara Memasang Related Post Simple Tapi Keren di Blog - Works!

Cara Memasang Related Post Simple Tapi Keren di Blog - Works!

Cara Memasang Related Post Simple Tapi Keren di Blog - Works!
Cara Memasang Related Post Simple Tapi Keren di Blog - Works!

SIMPLE tapi keren. Itulah widget related posts, posting terkait, artikel terkait, atau tulisan terkait yang akan muncul di bawah postingan blog Anda, dengan memasang kode-kode di bawah ini.

Kini banyak related post yang tidak muncul di blog karena kodenya disimpan di Google Code. Sedangkan Google Code sudah tidak aktif lagi alias dihentikan Google.

Jika Anda memasang Related Post with Thumbnail Image (Gambar), tapi postingan kebanyakan tidak ada gambar, kemungkinan besar related post juga tidak akan muncul.

Cara Memasang Related Post Simple

Kode widget related post ini di-share Help Logger. Yang CB share berikut ini sudah dimodifikasi sedikit, termasuk menghapus sisipan linknya.

1. Template > Edit HTML
2. Copas kode berikut ini di atas kode </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {margin: 15px 0px;}
#related-posts h2 {font-size: 25px;font-weight: normal;color: #666;text-shadow: 1px 0px 2px #888;margin-bottom: 0.75em;}
#related-posts a {font-size: 14px;color: #949494;border-bottom:1px dotted #E2E2E2;display:block;padding:13px;text-decoration: none;}
#related-posts a:hover {color: #c00;background: #F4F4F4;}
#related-posts ul {padding: 0px;list-style-type: none;background: #f9f9f9;border-left: 5px solid #f2f2f2;}
#related-posts li {padding: 0px;}
</style>
<script type='text/javascript'>
var relatedpoststitle=&quot;Related Posts&quot;;
</script>
<script type='text/javascript'>
//<![CDATA[
var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();function related_results_labels(json){for(var i=0;i<json.feed.entry.length;i++){var entry=json.feed.entry[i];relatedTitles[relatedTitlesNum]=entry.title.$t;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){relatedUrls[relatedTitlesNum]=entry.link[k].href;relatedTitlesNum++;break}}}}function removeRelatedDuplicates(){var tmp=new Array(0);var tmp2=new Array(0);for(var i=0;i<relatedUrls.length;i++){if(!contains(tmp,relatedUrls[i])){tmp.length+=1;tmp[tmp.length-1]=relatedUrls[i];tmp2.length+=1;tmp2[tmp2.length-1]=relatedTitles[i]}}relatedTitles=tmp2;relatedUrls=tmp}function contains(a,e){for(var j=0;j<a.length;j++){if(a[j]==e){return true}};return false}function printRelatedLabels(currenturl){for(var i=0;i<relatedUrls.length;i++){if(relatedUrls[i]==currenturl){relatedUrls.splice(i,1);relatedTitles.splice(i,1)}}var r=Math.floor((relatedTitles.length-1)*Math.random());var i=0;if(relatedTitles.length>1){document.write('<h2>'+relatedpoststitle+'</h2>')}document.write('<ul>');while(i<relatedTitles.length&&i<20&&i<maxresults){document.write('<li><a href="'+relatedUrls[r]+'">'+relatedTitles[r]+'</a></li>');if(r<relatedTitles.length-1){r++}else{r=0}i++}document.write('</ul>');relatedUrls.splice(0,relatedUrls.length);relatedTitles.splice(0,relatedTitles.length);}
//]]>
</script>
</b:if>


3. Cari (Ctrl+F) kode <b:includable id='postQuickEdit' var='post'>
4. Copas kode berikut ini di atas kode </b:includable>  yang ada di atas kode <b:includable id='postQuickEdit' var='post'>

Keterangan:

PASANG KODE DI SINI
</b:includable> 
<b:includable id='postQuickEdit' var='post'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'> </b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'> var maxresults=5; removeRelatedDuplicates(); printRelatedLabels(&quot;<data:post.url/>&quot;); </script>
</div>
</b:if>


5. Save!

Demikian Cara Memasang Related Post Simple Tapi Keren di Blog, khususnya untuk blog yang minim gambar dan yang related postnya tidak berfungsi. Good Luck & Happy Blogging! (http://www.contohblog.com).*

Thanks for reading & sharing Cara Memasang Related Post Simple Tapi Keren di Blog - Works!

Previous
« Prev Post

4 comments:

Comment Page:
  1. "Kode widget related post ini di-share Help Logger. Yang CB share berikut ini sudah dimodifikasi sedikit, termasuk menghapus sisipan linknya."

    Memang HelpLogger sering menyisipkan link ya mas?

    ReplyDelete
    Replies
    1. demikianlah, sebagaimana banyak blogger lain, kecuali cb :)

      Delete
  2. Selamat sore bos.. Saya suka dengan templetenya apalagi sewaktu saya lihat versi mobile.. Boleh saya ikut menerapkan templete ini dan apa judul templetenya.. Terima kasih

    ReplyDelete
    Replies
    1. CB Style Magz, ada di sini: http://www.contohblog.com/p/galeri-template.html

      Delete

Komentar spam, menyertakan link aktif dan alamat blog tidak akan muncul. Tidak semua pertanyaan sempat atau bisa dijawab. Thanks for visiting and the comment :)

E-mail Newsletter

Receive Latest Posts from CB Blogger Straight in Your Email Inbox