Skip to main content

How To Make Related Post



Related articles / Related post very useful for the visitors of your blog, because it will be easier for visitors to read articles that still have the same topic. Even if you look at when you use the google search at the bottom there are still some search suggestions or anything related to the article you were looking for, I conclude it is something that is almost the same function as the related post or article related but perhaps different naming it. 

after knowing some of the above so I agree with the master seo that install related post or article related is one of the techniques suggested seo, because Google also uses the same thing.

How to make related Post

1. Log into Blogger Template >> 

2. Select the Edit HTML >> Wait until open HTML Code 

3. Find the code "]]> </ b: skin>" and place the following code right above it.

     /* 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;}

4. Then look up the code similar to the code below >> code search first and if there is no next find codes.

<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>
 

5. If you find a code similar to the code above, copy the following code just below the above code.


<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/AVvXsEhkHv2sz1sRDPwSTLjtmLmhiKdtJ2AGPhYe_dOcgqNOI2-NBVFBwRSqoWHZHtH4fi88b_MeSPpQLnH6iJZlRJ2QldSTTIPtUQZTqNYOmqLlKWW3zRjij86S7KKXjRnwqyt_Ey4fnOOKwRFe/'};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'/>

Remarks:
  •      Red color number of articles will be shown.
  
6. Save your template >> Done 

Now your template already own a related article or related post to allow visitors to explore your blog.

Comments

Popular posts from this blog

How to choose between the Canon 700D or Nikon D5300

Canon EOS   700D   and Nikon   D5300   is a   digital SLR camera   aimed at   novice photographers .   Nevertheless ,   there are   features   on   both cameras are   much the same with   a more   sophisticated   camera   /   semi - pro,   so it   is good enough to   be used   in various   scene conditions .   From the shape   and size ,   at a second glance   something like the   camera .   But   when viewed   more closely ,   overall   more   compact   Nikon   D5300   a few   millimeters   and   about 100   grams lighter .   The new lens   Nikon   18-55mm   VR   II also   shorter   in   the off condition .   This can be achieved   because   the plastic   material   of the   camera   thinner . In   ...

10 Minuman Tradisional Khas Indonesia

1. Cendol  Merupakan minuman khas Indonesia yang terbuat dari tepung beras, disajikan dengan es parut serta gula merah cair dan santan. Rasa minuman ini manis dan gurih. Di daerah Sunda minuman ini dikenal dengan nama cendol sedangkan di Jawa Tengah dikenal dengan nama es dawet. Berkembang kepercayaan populer dalam masyarakat Indonesia bahwa istilah “cendol” mungkin sekali berasal dari kata “jendol”, yang ditemukan dalam bahasa Sunda, Jawa dan Indonesia; hal ini merujuk sensasi jendolan yang dirasakan ketika butiran cendol melalui mulut kala tengah meminum es cendol. Tepung beras diolah dengan diberi pewarna berwarna hijau dan di cetak melalui saringan khusus, sehingga berbentuk buliran. Pewarna yang digunakan awalnya adalah pewarna alami dari daun pandan, namun saat ini telah digunakan pewarna makanan buatan. Di Sunda cendol dibuat dengan cara mengayak kukusan tepung beras yang diwarnai dengan daun suji dengan ayakan sehingga diperoleh bentuk bulat lonjong yang lancip di ...

12 Judul Film Horor Terseram Indonesia

Dari ratusan film Indonesia yang dikoleksi, berikut ini film dengan cerita terhoror. 1. Legenda Sundel Bolong Legenda Sundel Bolong adalah sebuah film fiksi horor Indonesia yang dirilis pada 18 Oktober 2007 oleh Rapi Films. Legenda Sundel Bolong diperankan oleh Baim, Jian Batari Anwar, Tio Pakusadewo, dan Uli Auliani. Sinopsis Legenda Sundel Bolong mengisahkan mengenai seorang penari ronggeng, Imah (Jian Batari Anwar), yang memutuskan untuk berhenti menari ronggeng. Ia dan suaminya, Sarpah (Baim), memutuskan berpindah ke dusun lain di mana Sarpah bekerja di perkebunan teh milik seorang juragan, Danapati (Tio Pakusadewo) yang psikopat. Sejak awal kepindahannya mereka sudah tidak disukai oleh warga setempat, karena seorang penari ronggeng dianggap wanita penggoda lelaki. Danapati yang suka bermain perempuan ternyata menyukai Imah. Danapati melakukan apa saja untuk mendapatkannya Imah, termasuk mengutus Sarpa untuk mengambil bibit teh di daerah Sumatera. Danapati pada suatu kesempatan...