Cara Membuat Related Post di Blogspot


Cara Membuat Related Post di Blogspot


Hai Blogger tentu kalian penasaran bagaimana Cara Membuat Related Post di Blog yang dibuat dengan blogger*com kalau pakai wordpress sih gampang tinggal install plugin related post selesai, namun di blogspot anda harus menambahkan beberapa script agar tampilan website kamu memiliki related post alias judul yang terkait /berkaitan dengan artikel yang anda posting. Related post ini memiliki thumbnail kecil yang bisa menarik perhatian pembaca untuk mengklik artikel terkait yang anda miliki. Berikut cara pemasangannya:


1. Login ke Dashboard Blog Anda
2. Pilih menu Template--> Edit HTML
3. Tekan CTRL+F dan cari kode </head>

Copy-paste script dibawah ini 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:left;width:auto;}
#related-posts a{border-right: 1px dotted #eaeaea;}
#related-posts a:active{background: #EEEEEE;}
#related-posts h2{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;}
#related-posts .related_img {margin:5px;border:2px solid #f2f2f2;object-fit: cover;width:110px;height:100px;transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;-ms-transition:all 300ms ease-in-out;-webkit-border-radius: 5px;  -moz-border-radius: 5px; border-radius: 5px; }
#related-title {color:#666;text-align:center;padding: 0px 5px 10px;font-size:12px;width:110px; height: 40px;}
#related-posts .related_img:active{border:2px solid #E8E8E8;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}</style>
<script type='text/javascript' src='http://helplogger.googlecode.com/svn/trunk/relatedposts.js' />
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

5. Tekan CTRL+F dan cari kode <data:post.body/>
6. Copy-paste script dibawah ini dibawah kode <data:post.body/>

<!-- 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>
<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:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=6;
var relatedpoststitle=&quot;<b>Related Posts:</b>&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

7. Simpan template

lihat script disini

Manfaat menambahkan Related Post adalah:
1. Agar pembaca menjadi tahu ternyata ada artikel terkait dengan artikel yang sedang ia baca
2. Menambah Link Internal website anda
3. Dengan adanya related post berarti anda mengurangi BounceRate Kecil

Apa itu Bounce Rate anda bisa baca DISINI

Jika artikel ini bermanfaat silahkan di share
jika ada kritik dan saran silahkan tulis di kolom komentar !!!


0 Response to "Cara Membuat Related Post di Blogspot"

Posting Komentar