CARA MEMBUAT THUMBNAIL ARTIKEL TERKAIT (RELATED POST) DI BLOG

related post thumbnail di blogger

Cara membuat Atikel terkait (related post) thumbnail di blogger sangatlah penting untuk di pertimbangkan karena cara ini merupakan salah satu trick agar pengunjung blog kita semakin betah berada di blog kita, menghabiskan waktu untuk membaca-baca artikel yang dicari. 

Dengan adanya related post thumbnail maka mereka bisa membaca artikel yang berkaitan dengan isi postingan yang sedang mereka baca. Dengan thumbnail ini selain bikin betah juga mempermudah pencarian sebuah artikel :

Postingan tentang cara membuat related post thumbnail di blogger melanjutkan percakapan kita sebelumnya yaitu tentang deretan daftar blog dofollow yang mana jika agan ingin mendapatkan backlink silahkan pergi sejenak untuk membacanya.

Berikut cara membuat related post thumbnail di blogger

Untuk mencari tahu cara bagaimana membuat related post thumbnail di blogger silahkan perhatikan langkah-langkah di bawah ini :

1. Masuk ke akun blogger agan

2. Klik Template --> Edit HTML

3. Centang  Expand Template Widget

4. Simpan kode dibawah ini diatas kode </head&gt;

<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.2em;

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://kangdansen.googlecode.com/files/relatedpostwiththumbnail.js' type='text/javascript'/>

</b:if>

5. 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 == &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.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=&quot;<data:post.url/>&quot;;

var maxresults=5;

var relatedpoststitle=&quot;Postingan Terkait Tutorial Seo Blog&quot;;

removeRelatedDuplicates_thumbs();

printRelatedLabels_thumbs();

</script>

</div><div style='clear:both'/>

</b:if>

7. Simpan template dan lihat hasilnya

* Yang Berwarna Biru , Kalimatnya bisa dirubah sesuai keinginan kita.
Selamat anda sekarang sudah mempunyai related post. Semoga tutorial tentang cara membuat related post thumbnail di blogger dapat bermanfaat jika ada kesalahan dalam postingan saya minta maaf dan jika menemukan masalah dalam penerapan postingan ini silahkan isi form komentar.

Posted in: ARTIKEL TERKAIT DI BLOG, CARA BUAT REALTED POST, RELATED POST, THUMBNAIL, TUTORIAL