Cara Buat dan Pasang Related Post / Artikel Terkait di Blogger

Cara Buat dan Pasang Artikel Terkait di Postingan

Langkah Pertama

Masuk Blogger>>> pilih Template >>> edit HTML

backup template jika perlu

Tekan F3 >>> cari kode tag </head>

Copy kode script dibawah ini : 

<style> #related-posts { float : left;height:200px;overflow:auto; 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/AVvXsEg-A2NrEw4ur7-ZLQJbAi058dT6EdNczfwSlF0gZAg7ovoH6llBoE5DJL4TIZdDGLymZkU44Qk24VBrS_xdhhyRgevZY5PJr8KU2i4JOk8JDkW2qlYqFxlib0rRYksPdDuH2r2VVaa9ke0/") 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='http://problogizjs.googlecode.com/files/Related-posts.js' type='text/javascript'/>

Dan pastekan atau letakkan semua code CSS tersebut sebelum tag </head>

Langkah Kedua

Masih di edit Template >>> cari kode <data:post.body/>
Copy dan pastekan kode HTML dibawah setelah tag <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='related-posts'> <font face='Arial' size='3'><b>Artikel Terkait : </b></font><font color='#151515'><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=10&quot;' type='text/javascript'/></b:if></b:loop> </font> <script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels(); </script> </div></b:if>

 Catatan :

pada beberapa template terdapat lebih dari satu tag <data:post.body/>, oleh karena itu Anda bisa pilih salah satu kalau gagal tag yang pertama pilih tag yang kedua atau cobalah semuanya dimana yang berhasil klo di blog Chelly sih dibawah yang kedua dan ganti color font sesuai dengan blog Anda

Kemudian silahkan Save Template.

Ini contoh hasilnya, seperti gambar screenshot dibawah ini :

Selesai. Anda bisa lihat hasilnya pada halaman postingan blog, dibagian paling bawah post artikel akan nampak Related Post / Artikel Terkait yang simple dengan icon RSS. Semoga Bermanfaat ya ^^