Cari Artikelmu | Panduan Cara Membuat Related Post Di Setiap Postingan Pada Blog


Selamat Siang teman-teman, saya akan membagikan Panduan Cara Membuat Related Post Di Setiap Postingan Pada Blog. Related Post ini sangatlah berguna karena akan menjadi daya tarik para mengunjung untuk membaca artikel terkait postingan kita. Sangat berguna sekali bukan!! Apalagi kalau kita buat Related Post kita lebih menarik dan keren serta judul postingan kita yang ada pada artikel terkait kita pasang memenuhi kebutuhan sih pengunjung, Maka otomatis sih pengunjung akan membuka postingan anda.

Sangatlah berguna sekali jika kita memasang sebuat related post di postingan kita. Langsung saja yah.

1. Login ke Dashboard=>Template=>Edit Html
2. Kemudian cari kode ini ]]</b:skin> dan copy code script CSS di bawah ini tepat di atas kode ]]</b:skin>

/* Artikel Terkait Dengan Gambar Start -------------------------------------------- */
#artikel-yg-nyambung {font-weight:bold; font-family: 'Lucida Grande', Tahoma, Verdana, Arial, sans-serif; font-size:12px;}
#artikel-yg-nyambung h3{border-bottom: 3px dotted #DBDBDB; font-family: Arial; font-size: 20px; color: #232D74; padding-bottom: 0px; text-transform: uppercase; font-weight: normal; text-align: center; height: 25px; margin-bottom: 10px; margin-top: 10px;}
#artikel-yg-nyambung ul {width:570px; margin-bottom: 20px; padding:0px; list-style:none; display:inline;}
#artikel-yg-nyambung li{float:left; display:inline; list-style:none; height:150px; margin:0 0px 10px 8px; width:133px;}
#artikel-yg-nyambung ul li a{margin:0; line-height:18px;} #artikel-yg-nyambung img{padding:0; margin:0; width:133px; height:90px; border:1px solid #eaeaea;}
#artikel-yg-nyambung img:hover{opacity:0.7;}


 3. Lanjut ke kode HTMLnya. Cari kode ini <div class='post-footer'> Kemudian Copypaste Code Di bawah ini tepat di atas kode <div class='post-footer'>


<!-- Artikel Terkait Dengan Gambar Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='artikel-yg-nyambung'> <script type='text/javascript'>//<![CDATA[ var ry='<h3 class="artikelterkait"><span>Artikel Terkait</span></h3>';rn='<h3 class="artikelterkait"><span>Jelajah Artikel Lainnya</span></h3>';rcomment='comments';rdisable='disable comments';commentYN='yes'; var dw='';titles=new Array();titlesNum=0;urls=new Array();timeR=new Array();thumb=new Array();commentsNum=new Array();comments=new Array();function related_results_labels(c){for(var b=0;b<c.feed.entry.length;b++){var d=c.feed.entry[b];titles[titlesNum]=d.title.$t;for(var a=0;a<d.link.length;a++){if('thr$total' in d){commentsNum[titlesNum]=d.thr$total.$t+' '+rcomment}else{commentsNum[titlesNum]=rdisable};if(d.link[a].rel=="alternate"){urls[titlesNum]=d.link[a].href;timeR[titlesNum]=d.published.$t;if('media$thumbnail' in d){thumb[titlesNum]=d.media$thumbnail.url}else{thumb[titlesNum]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi83dgSO584LMQIEEkfIxQZfEZy66XyiL8BgG9luhx5D-RjWkKYMBs8sNiUP_knXMvdwPrbWQGjF7RSceoBnSlFG-_-koMwb6A4RAwTYQ4czrKIoo_YadGgf_CA0UuwqFX0SFs_4WRXNfVc/s1600/no+image.jpg'};titlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);c=new Array(0);e=new Array(0);f=new Array(0);g=new Array(0);for(var a=0;a<urls.length;a++){if(!contains(b,urls[a])){b.length+=1;b[b.length-1]=urls[a];c.length+=1;c[c.length-1]=titles[a];e.length+=1;e[e.length-1]=timeR[a];f.length+=1;f[f.length-1]=thumb[a];g.length+=1;g[g.length-1]=commentsNum[a]}}urls=b;titles=c;timeR=e;thumb=f;commentsNum=g}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){var y=a.indexOf('?m=0');if(y!=-1){a=a.replace(/\?m=0/g,'')}for(var b=0;b<urls.length;b++){if(urls[b]==a){urls.splice(b,1);titles.splice(b,1);timeR.splice(b,1);thumb.splice(b,1);commentsNum.splice(b,1)}}var c=Math.floor((titles.length-1)*Math.random());var b=0;if(titles.length==0){dw+=rn}else{dw+=ry;dw+='<ul>';while(b<titles.length&&b<20&&b<maxresults){if(y!=-1){urls[c]=urls[c]+'?m=0'}if(commentYN=='yes'){comments[c]=' - '+commentsNum[c]}else{comments[c]=''};dw+='<li><div class="pthumb"><a href="'+urls[c]+'" rel="nofollow"><img alt="'+titles[c]+'" src="'+ thumb[c].replace("/s72-c/","/s150/")+'"/></a></div><a href="'+urls[c]+'" rel="nofollow">'+titles[c]+'</a><div class="clear"></div></li></div>';if(c<titles.length-1){c++}else{c=0}b++}dw+='</ul>'};urls.splice(0,urls.length);titles.splice(0,titles.length);document.getElementById('artikel-yg-nyambung').innerHTML=dw}; //]]></script> <b:loop values='data:post.labels' var='label'> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=19&quot;' type='text/javascript'/> </b:loop> <script type='text/javascript'>var maxresults=4;removeRelatedDuplicates();printRelatedLabels(&#39;<data:post.url/>&#39;);</script> </div> <div class='clear'/> </b:if> <!-- Artikel Terkait Dengan Gambar End -->


Perhatian!! Untuk kode <div class='post-footer'> ada 2 buah, pastekan di atas kode <div class='post-footer'> yang kedua.

Penjelasan= Artikel Terkait berwarna Merah bisa anda ganti sesuai nama yang anda mau. Dan untuk Yang Berwarna biru cukup ganti angka sesuai jumlah related post yang ingin anda tampilkan.

Kalau Sudah selesai, klik Save..

Sekian sampai disini untuk Panduan Cara Membuat Related Post Di Setiap Postingan Pada Blog. Moga bermanfaat,, terima kasih..