Tutorial Membuat Related Post Thumbnail di blogger

Like It

, Related Post atau artikel terkait, pasti sobat semua tahu, Related Post ini merupakan widget yang sangat penting menurut saya sob. Karena dengan widget ini kita dapat menuntun pengunjung blog kita menuju postingan yang lain yang tentunya berkaitan dengan postingan yang sedang dilihat. Jika sobat belum tahu cara membuat widget related post saya akan menuliskan tutorial membuatnya disini sobat ini dia:

1. Pertama sobat pastinya harus login ke Blogger

2. Masuk Dashboard>>Template>>Edit HTML

3. Jangan lupa centang <<<<<<Expand Template Widget>>>>>>

4. Setelah itu cari kode </head> agar mudah Sobat mencarinya gunakan Ctrl+F dan letakkan kode di bawah ini tepat di atasnya.

<b:if cond='data:blog.pageType == "item"'> <style type='text/css'> #related-posts { float:center; text-transform:none; height:100%; min-height:100%; padding-top:5px;padding-left:5px;} #related-posts h2{ font-size: 1.2em; font-weight: bold; color: black; font-family: Georgia, “Times New Roman”, Times, serif; margin-bottom: 0.75em; margin-top: 0em; padding-top: 0em; } #related-posts a{ color:black; } #related-posts a:hover{ color:black; }#related-posts a:hover { background-color:#d4eaf2;} </style> <script src='http://kangdansen.googlecode.com/files/relatedpostwiththumbnail.js' type='text/javascript'/> </b:if> 

5. Lalu sobat cari kode berikut <div class='post-footer-line post-footer-line-3'/>

6. Simpan kode di bawah ini tepat di bawah kode no.5

<b:if cond='data:blog.pageType == "item"'> <div id='related-posts'> <b:loop values='data:post.labels' var='label'> <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_thumbs&max-results=6"' type='text/javascript'/></b:if></b:loop><a href='http://www.omseoli.com' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger widgets</a> <script type='text/javascript'> var currentposturl="<data:post.url/>"; var maxresults=5; var relatedpoststitle="Related Post"; removeRelatedDuplicates_thumbs(); printRelatedLabels_thumbs(); </script> </div> <div style='clear:both'/> </b:if>  

7. Simpan template dan lihat hasilnya