Cara Membuat Related Post Hanya Menampilkan Judul Saja di Blogger

Related post adalah biasa disebut Artikel Terkait. Related post ini bisa dibilang user freandly karena memudahkan pengunjung untuk membaca artikel-artikel yang masih dalam satu topik yang sama. Related post juga menuntun pengunjung blog kita menuju postingan atau artikel yang lain dan yang berkaitan dengan postingan yang mereka lihat. Dengan memasang Related post di blogger kemungkinan dapat meningkatkan pageview halaman meningkat- menurut master seo, karena berada dibawah postingan.

Related post kali ini yang saya postingkan adalah hanya menampilkan judul saja. Dimana Related post ini lebih ringan daripada menggunakan Related post Thumbnail (bergambar).

Screenshoot :

 Cara Membuat Related Post Hanya Menampilkan Judul Saja di Blogger

 

Cara Pertama :

1. Buka Blogger - Kemudian login.
2. Dashboard - Template.
3. Edit HTML.

Proses Pembuatan :

1. Temukan kode ]]></b:skin> atau </style>
2. Copy&paste kode berikut ini, dan letakkan diatas kode ]]></b:skin> atau </style>

/* Related Post Title Only Start */
#related-post-title-only {
    overflow: hidden;
    margin: 15px 0;
    padding: 0
}
#related-post-title-only h3 {
    font-size: 20px;
    font-weight: bold;
    padding: 0 0 8px;
    margin: 0;
    color: #4C565F;
}
#related-post-title-only ul {
    margin-left: 20px;
    padding: 0 0 0 10px;
}
#related-post-title-only ul li {
    padding: 0 0 8px;
}
/* Related Post Title Only End */

3. Jika sudah? Temukan kode </head>
4. Copy&paste kode berikut ini, dan letakkan diatas kode </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script>
//<![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(){var r=Math.floor((relatedTitles.length-1)*Math.random());var i=0;document.write('<ul>');while(i<relatedTitles.length&&i<20){document.write('<li><a href="'+relatedUrls[r]+'">'+relatedTitles[r]+'</a></li>');if(r<relatedTitles.length-1){r++;}else{r=0;}
i++;}
document.write('</ul>');document.write();}//]]>
</script>
</b:if>

5. Selanjutnya, Temukan kode <data:post.body/> Biasanya kode ini lebih dari satu, silakan anda pilih yang kedua/ketiga.

Wajib Baca : Anda bisa meletakkan kode berikut ini, dibawah Tombol Share (jika memasangnya)

6. Copy&paste kode berikut ini, dan letakkan dibawah kode <data:post.body/>

<!-- Related posts di bawah postingan -->
<div id='related-post-title-only'>
<h3>Artikel Terkait :</h3>
<b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != &quot;true&quot;'/> <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=5&quot;' type='text/javascript'/></b:if> </b:loop> <script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels(); </script>
</div>
<!-- Related posts di bawah postingan Berakhir -->

7. Simpan Template.

Demikianlah Tutorial Blogger kali ini, Jika terjadi kesalahan? Jangan  sungkan untuk berkomentar dibawah ini. Terakhir, silakan anda lihat postingan anda, lihat bagian bawah. Sekian dari saya, Semoga Bermanfaat! Thanks for Reading, Sharing & Visited and Search :  Cara Membuat Related Post Hanya Menampilkan Judul Saja di Blogger.

Share this post

Related Post