Cara Membuat Artikel Terkait di Blog

Sekarang Mr. Yellows akan membagikan bagaimana cara membuat artikel terkait atau related post otomatis pada blog di bawah postingan. Widget artikel terkait yang satu ini bisa dibilang penting dalam sebuah blog atau situs karena bila dilihat dari segi fungsi widget ini berfungsi untuk mempermudah pengunjung mengetahui artikel lain yang berkaitan satu sama lain.

Nah kali ini saya akan sharingkan bagai mana Cara Membuat  Artikel Terkait di Blog. Kita Intip dulu cara pembuatannya : 

1. Pertama sobat buka settingan template di Dashboard->Template->Edit HTML jangan lupa centang Expland Widgetnya.
2. Cari kode </head> (bisa gunakan ctrl+F untuk mempermudah pencarian) bila sudah ketemu letakkan kode berikut tepat sebelum kode </head> atau diatasnya.
   

   <style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRzjVnjWs6VW_nJsJ5YLWPumg1plERAjlipEFaDXwprnTSpk8VR_iOGhdEwmbW-xJ8CHeUwlQCq3YDGu7ndY_WMrBAaRhecrgHXRFNLHrvZSfSOvgHX75aXn-OJq8HrT2aZ0axjzKu7S4/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='https://sites.google.com/site/widgetsforfree/scripts/Related_posts_hack.js' type='text/javascript'/>

3. Sekarang cari kode <data:post.body/> Dalam beberapa template kode ini mungkin terlihat seperti ini <div class='post-body> atau  <data:post.body/>
4. Letakkan kode berikut tepat dibawahnya
   

   <b:if cond='data:blog.pageType == "item"'>
   <div id="related-posts">
   <font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><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> </font>
   <script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
   </script>
   </div></b:if>

5. Simpan Template. Selesai

Catatan : Bila sebelumnya sobat sudah membuat read more, maka letakkan kode poin 4 dibawah kode
<data:post.body/>
</b:if>

Bila ada pertanyaan silahkan kemukakan di komentar. Semoga berhasil dan terimakasih sudah membaca post Cara Membuat  Artikel Terkait di Blog