Cara Pasang Artikel Terkait / Related Post di Postingan

Cara Pasang Artikel Terkait / Related Post di Postingan

Cara Pasang Artikel Terkait / Related Post di Postingan - Membuat artikel terkait atau related post pada blog merupakan salah satu hal yang dibutuhkan oleh setiap blogger, karena dengan kita memasang Artikel Terkait / Related Post tentu akan mempermudah pengunjung untuk mencari ataupun mendapatkan informasi yang berkaitan dengan topik yang dibaca.

Sobat bisa lihat contoh dari Artikel Terkait / Related Post di gambar atas atau di bawah postingan ini, seandainya sobat ingin menyimpan Artikel Terkait sobat di bawah postingan, sobat bisa buat dulu Cara  Membuat Dua Kolom Widget di Bawah Postingan Blog agar terlihat rapi dan profesional.

Berikut langkah-langkah Cara Pasang Artikel Terkait / Related Post di Postingan, lakukan backup template terlebih dahulu untuk menjaga sesuatu hal yang tidak kita inginkan :

1. Langkah pertama sobat masuk terlebih dahulu ke akun blogger sobat.
2. Di dashboard tampilan blog baru pilih template --> Edit HTML --> Lanjutkan (jangan lupa centang Expand Template Widget).
   
3. Cari kode </head> untuk mempermudah proses pencarian sobat bisa tekan Ctrl+F atau tekan tombol F3 pada Keyboard sobat untuk melakukan pencarian.
   
4. Copy script di bawah tepat sebelum kode </head>
<!-- Start Kode Artikel Terkait CSS -->

<style> #related-posts { float : left;height:220px;overflow:auto; width : auto; 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(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcvp3BD0o83D9oAkW3Q3T7tfijoLEdFyaPNBznDGY7M2GlUcfZw9X2WPDn8ItQ9QyWuWd-J7-lc-kuNmu34_O_GOtu7tlcAm1BAnerPJbCBpgBN95LXYOw0hUox66ywc6qW11zrd7Tai6x/s16/Creativoltzcool.png&quot;) 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'/> 
<!-- End Kode Artikel Terkait CSS -->
5. Kemudian cari kode <data:post.body/>
6. Copy kode dibawah tepat setelah kode <data:post.body/>, seandainya sobat sudah Membuat Dua Kolom Widget Di Bawah Postingan Blog sobat tingaal copas saja ketempat kolom yang mau dipasang.
   
<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='#000'><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>
7. Langkah terahir klik tombol Simpan Template, untuk melihat hasilnya sobat bisa lihat gambar di atas atau dibawah postingan ini..

Cara ini sudah saya praktekan dan berhasil 100%, mudah-mudahan Cara Pasang Artikel Terkait / Related Post di Postingan bisa bermanfaat dan berguna.

Selamat mencoba dan berkreasi