Cara membuat artikel terkait di blog

 Pada postingan kali ini membahas seputar Tutorial Blogspot yaitu cara membuat artikel terkait atau biasa juga disebut dengan related post. Selain Cara membuat navigasi breadcrumb, artikel terkait juga berguna untuk memudahkan pengunjung menjelajahi blog dan berperan penting terhadap SEO.

Tampilan artikel terkait ini hanya menampilkan judul-judul artikel yang berkaitan berdasarkan label dari sebuah artikel blog. Untuk contoh artikel terkait bisa sobat lihat dibawah setiap artikel blog ini, atau lihat gambar dibawah.



Dan berikut cara membuat artikel terkait atau related post dibawah postingan :

1. Login pada akun blogger sobat

2. Klik 'Rancangan' kemudian klik 'Edit HTML'

3. Centang 'Expand Template Widgets'

4. Cari kode </head>

5. Letakkan kode dibawah ini tepat diatas kode nomor 4

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {float:center;text-transform:none;height:100%;min-height:100%;padding-top:5px;padding-left:5px;}
#related-posts .widget {padding-left:5px;margin-bottom:10px;}
#related-posts .widget h2, #related-posts h2 {font-size:1.6em;font-weight:bold;color:#000;font-family:Arial, Verdana;margin-bottom:0.75em;margin-top:0em;padding-top:0em;}
#related-posts a {color:#;}
#related-posts a:hover {color:#;}
#related-posts ul {list-style-type:none;margin:6px 0 10px 12px;padding:0;text-decoration:none;font-size:13px;}
#related-posts ul li {list-style-type:none;margin-bottom:5px;padding-left:25px;padding-top:0;display:block;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCLDk4WOgPqDvRnkBidD3ebylYgZq05DZsSCoh17y_7y-pYWNhtXX1Nx8UF0tUGC5ObHzBs6fosP5b4YmPRBWrRnWXh_0sCy4PFHjZv844R-bfQP19Yx4UA9J1cNCNqSqJvDNzfh0Y9Mc/s400/arrowbullet.png) no-repeat;}
</style>

<script type='text/javascript'>
var relatedpoststitle=&quot;Artikel Terkait&quot;;
</script>
<script src='http://wandhy.googlecode.com/files/artikel-terkait-v2.js' type='text/javascript'/>
</b:if>

6. Tulisan 'Artikel Terkait' yang berwarna merah diatas merupakan judul artikel terkaitnya dan bisa diganti sesuai selera

7. Kemudian cari lagi kode <data:post.body/> jika terdapat 2 kode tersebut, maka letakkan kode dibawah ini tepat dibawah <data:post.body/> yang kedua

<div id='related-posts'>
<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=5&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
var maxresults=7;
removeRelatedDuplicates();
printRelatedLabels(&quot;<data:post.url/>&quot;);
</script>
</div>

8. Tulisan 7 diatas merupakan jumlah artikel yang ditampilkan, bisa dirubah sesuai selera

9. Simpan template sobat

Sampai disini dulu tutorial saya kali ini tentang Cara Membuat Artikel Terkait silahkan dicoba dan semoga bermanfaat :D