HALAMAN

Related Post / Artikel Terkait di Blog



Membuat related Post
Artikel terkait / Related post sangat bermanfaat untuk para pengunjung blog anda, karena akan memudahkan pengunjung untuk membaca artikel-artikel yang masih mempunyai topik yang sama. Bahkan jika anda perhatikan ketika anda menggunakan google search di bagian bawah ada beberapa saran pencarian yang masih berhubungan  dengan artikel atau sesuatu yang sedang anda cari, saya berkesimpulan itu adalah sesuatu yang hampir sama fungsinya dengan related post atau artikel terkait tetapi mungkin beda penamaan saja.

Setelah mengetahui beberapa hal diatas jadi saya setuju dengan para master seo bahwa memasang related post atau artikel terkait adalah salah satu teknik seo yang disarankan, karena google pun menggunakan hal yang sama.

Selanjutnya jika anda tertarik untuk memasang artikel terkait / related post ikuti langkah-langkah yang saya berikan. Gambar di bawah adalah contoh related post yang akan saya jelaskan cara memasangnya.

contoh related post
Cara membuat related Post
  • Masuk ke Blogger >> TEMPLATE
  • Pilih EDIT HTML >> Tunggu sampai Kode HTML terbuka
  • Temukan kode ]]></b:skin> dan letakan kode dibawah tepat di atasnya.
    /* Teknik SEO Mudah Related Posts --- */
        .related-post .post-thumbnail {
        z-index: 1;
        position: relative;
        width: 98px;
        height: 98px;
        margin: 0;
        display: block;
        border-right: 1px solid #fff;
        border-bottom: 1px solid #fff;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        -webkit-box-shadow: inset 2px 2px 5px #444;
        -moz-box-shadow: inset 2px 2px 5px #444;
        box-shadow: inset 2px 2px 5px #555;
        }
        .related-post {
        float: left;
        position: relative;
        width: 98px;
        height: 98px;
        margin: 0 10px 10px 0;
        background: #F6F6F6;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        }
        .related-post .related-post-title {
        display: none;
        float: left;
        background: #000;
        color: #fff;
        text-shadow: none;
        font-weight: bold;
        padding: 10px;
        position: absolute;
        top: -20px;
        left: 40px;
        z-index: 2;
        width: 200px;
        -webkit-box-shadow: 0 0 2px #444;
        -moz-box-shadow: 0 0 2px #444;
        box-shadow: 0 0 2px #444;
        }
        .related-post:hover .related-post-title {display: block;}
  • Selanjutnya cari kode yang mirip dengan kode dibawah >> cari kode yang pertama dan jika tidak ada cari kode-kode selanjutnya.
    <div class='post-footer'>
            <div class='post-footer-line post-footer-line-1'/>
              <div class='post-footer-line post-footer-line-2'/>
              <div class='post-footer-line post-footer-line-3'/>
            </div>
          </div>
  • Jika anda sudah menemukan kode yang mirip dengan kode diatas, copy kode dibawah tepat dibawah kode di atas.
    <div id='related-posts'>
        <b:if cond='data:blog.pageType == &quot;item&quot;'>
        <script type='text/javascript'>//<![CDATA[
        var ry='<h3>Related Posts</h3>';rn='<h3>&nbsp;&nbsp;&nbsp;No related post available</h3>';rcomment='comments';rdisable='disable comments';commentYN='no';
        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/AVvXsEjNjkdQ2YGjTfGGs15bj7ScIib5RANXBUYgLbx7ElmAW9zGVQWx6tt48Cs8PqtVsVMY1G-5t6s3vIK04VoSVpxaejvxWq8UcZ7qw9aTXr0UZ7PIwloxNSm_WurCSZR5mxchyr1O6wgxrzXW/'};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+='<div class="clear"/></div><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+='<div class="related-post"><div class="related-post-title">'+titles[c]+'</div><a href="'+urls[c]+'" rel="nofollow"><img border="0" class="post-thumbnail" alt="'+titles[c]+'" src="'+thumb[c]+'"/></a></div></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('related-posts').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&quot;' type='text/javascript'/>
        </b:loop>
        <script type='text/javascript'>var maxresults=6;removeRelatedDuplicates();printRelatedLabels(&#39;<data:post.url/>&#39;);</script>
        </b:if>
        </div>
        <div class='clear'/>

#Keterangan:
    Warna Biru Bisa anda sesuaikan dengan ukuran template anda
    warna Hijau Jumlah artikel yang akan anda tampilkan.
  • Simpan Template anda >> Selesai
Sekarang template anda sudah memeliki artikel terkait atau related post untuk memudahkan pengunjung menjelajahi blog anda. Jika anda ingin membuat template menjadi seo-friendly tetapi tidak tahu syarat dan kriterianya silahkan baca SYARAT DAN KRITERIA TEMPLATE SEO.

Semoga artikel ini bisa membantu blog anda untuk lebih banyak pengunjung dan ramai tentunya, memang menjadi blogger harus bersabar yang terpinting andalahtulisan kita bermanfaat untuk orang lain. .
Salam Blogger,!!!


UNTUK ANDA KAMI ADA  ANDA SENANG KAMI PUN BANGGA
BLOGGER ITU MUDAH UNTUK DI PELAJARI 
 

BLOG TUTOR. Copyright 2013 All Rights Reserved |Template by Panduan Belajar Seo dan tutorial blog |Support Tips Trik Formasi top eleven dan Winning Eleven