Jelajah Internet

Dalam sebuah blog, Related post/Posting Berhubungan menurut saya juga sangat penting untuk menghindarkan pengunjung blog dari kebosanan. Fungsi dari Related post atau Related Articl adalah selain memudahkan navigasi, juga mempermudah pengunjung blog kita untuk menemukan artikel yang berhubungan.

Nah untuk membuat Artikel Terkait / Related Artikel Bergambar silahkan ikuti langkah-langkah berikut ini:

1. Login di akun blogger anda
2. Pada Dashboard pilih Design» Edit HTML » Centang Expand Widget
3. Kemudian letakkan kode berikut ini, tepat diatas kode </head>

<!--Related Posts with thumbnails Scripts and Styles Start--> <b:if cond='data:blog.pageType == &quot;item&quot;'> <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.6em; font-weight: bold; color: black; font-family: Georgia, &#8220;Times New Roman&#8221;, 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://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/> </b:if> <!--Related Posts with thumbnails Scripts and Styles End-->

4. Kemudian cari kode berikut ini :

<div class='post-footer-line post-footer-line-1'>

5. Jika sudah ketemu, kemudian letakkan kode berikut tepat setelah kode diatas :

<!-- Related Posts with Thumbnails Code Start--> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='related-posts'> <b:loop values='data:post.labels' var='label'> <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_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger tutorials</a> <script type='text/javascript'> var currentposturl=&quot;<data:post.url/>&quot;; var maxresults=4; var relatedpoststitle="Related Posts"; removeRelatedDuplicates_thumbs(); printRelatedLabels_thumbs(); </script> </div><div style='clear:both'/> </b:if> <!-- Related Posts with Thumbnails Code End-->

6. Lalu Save Template.