Membuat Artikel Terkait

Setelah melihat gambar, seperti itulah related post tau artikel terkait menggunakan thumbnail. Namun jika kita telusuri menurut fungsinya, sebenarnya sama dengan related post yang pernah saya jelaskan sebelumnya. Sekarang tergantung selera Anda mau pakai yang mana, jika Anda ingin menggunakan dengan thumbnail perhatikan tutorial dibawah ini :

1. Seperti biasa Login terlebih dahulu ke akun blogger Anda

2. Kemudian klik rancangan

3. Klik menu Edit HTML

4. Ceklis atau centang kotak Expand Widget Templates (sebelumnya download template dahulu untuk berjaga-jaga jika terjadi kesalahan)

ceklis expand widget templates

5. Langkah berikutnya adalah cari kode </head> (gunakan ctrl + f untuk mempermudah pencarian)

6. Jika sudah dapat, sisipkan kode dibawah ini tepat diatas kode </head> tadi

<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/AVvXsEhzaQyyttwGOOu2JM874GU0Wp1Uk_F30-6WwnSa09ECUc_fg6YJLVdSTLZ_nufeEDbcgGEzWbJSXjGVJ4oWhTA9mHiYJoBtUisSuOYBbqKfeN4Avwobb8kadssOJmp-X7FKsg6QkrB7-jg/") 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://mas-ahmad.googlecode.com/files/related_post_pelajaran_blog.js' type='text/javascript'/>

7. Lanjut kelangkah berikutnya, yaitu cari kode <data:post.body/>  (jika anda menggunakan fungsi readmore maka kode tersebut ada 2, maka letakkan kode dibawah ini tepat dibawah kode <data:post.body/> yang kedua

<br/><br/><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 != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>

8. Simpan / Save dan lihat hasilnya

Anda baru saja membaca artikel yang berkategori blogging dengan judul Membuat Artikel Terkait. Anda bisa bookmark halaman ini dengan URL http://kumpulantrikgratis.blogspot.com/2012/12/membuat-artikel-terkait.html. Terima kasih!

Ditulis oleh: ahmad - Minggu, 16 Desember 2012