Artikel Bloger Medan.....

Minggu, 08 April 2012

CARA MEMBUAT ARTIKEL TERKAIT DENGAN THUMBNAIL

















Banyak cara yang dilakukan para bloger untuk mempercantik tampilan blog nya agar pengunjung betah berlama-lama di blognya, salah satu nya membuat tampilan yang satu ini. Membuat menu artikel terkait dengan gambar dapat memanjakan pengunjung untuk dapat lebih mudah dalam mencari artikel-artikel yang di posting oleh pemilik blog. Berikut langkah-langkah dalam pembuatan artikel terkait dengan thumbnail.
  1. Login ke blog anda
  2. Klik Rancangan - Edit Html
  3. Centang "Expand Template Widget"
  4. Cari kode <data:post.body/> agar lebih mudah gunakan CTRL+F
  5. Copy kode berikut tepat di bawah <data:post.body/>
<!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><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'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://blogermedan.blogspot.com/2012/04/cara-membuat-artikel-terkait-dengan_07.html'></a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->



6. Lalu cari lagi kode </head>
7. Copy kode berikut tepat diatas kode </head>

<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><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 h4{
font-weight: bold;
color: black;
font:normal 14px Arial;text-transform:none;
margin:0px;letter-spacing:.01em;line-height: 1.2em;color:#666;
}
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 type='text/javascript'>
var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS6FoLsx1QL9_Qi2duGB_HliDOryi4aSQw586DCuemKb9I_o6rGz-VuI-6c7ooGk8nY25rwGvLjO46DfpEJLb5SMV5mYQFOCRpztTthHrAfHUDM0l8QF8_lVEzEuysF3GDOVBSf9o2csQ/s400/noimage.png&quot;;
var maxresults=6;
var splittercolor=&quot;#d4eaf2&quot;;
var relatedpoststitle=&quot;Artikel Lainnya&quot;;
</script>
<script src='http://infonetmu.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->


Catatan : Artikel Lainnya : Judul pada widget (Bisa anda ganti dengan tulisan lain)
var maxresults=6: Jumlah artikel yang di tampilkan (Bisa anda ganti jumlahnya)

ARTIKEL TERKAIT



7 komentar:

Meulek-Ict on 8 April 2012 pukul 05.33 mengatakan...

wah infonya mantep nih sob

Yasir Utomo on 8 April 2012 pukul 08.55 mengatakan...

pertamaX agan. kebetulan sy belum pake related post yang pake thumbnail. :)

Lina CahNdeso on 8 April 2012 pukul 13.35 mengatakan...

Thanks, Gan, ini dia yang ane cari-cari selama ini...!!!

Unknown on 8 April 2012 pukul 14.02 mengatakan...

infonya bagus,saya coba dulu ya

Khocet Blog on 14 April 2012 pukul 09.49 mengatakan...

terimakasih atas sharingnya gan.ni bermanfaat sekali.saya tunggu post berikutnya..salam blogger

andi Google + on 21 April 2012 pukul 15.48 mengatakan...

Udah dicoba step2 diatas guggle tapi Gag bisa guugle.. o_O"!!

Udah bener tuhkhan step2nya.. O.o"

Komunitas Blogger Muda Subang on 25 April 2012 pukul 11.34 mengatakan...

nggk muncul gan????

Posting Komentar

Silahkan Tulis Komentar Anda Tentang Artikel Diatas. TERIMA KASIH....

Followers

Total Tayangan Halaman

SEO Stats powered by MyPagerank.Net Adsense Indonesia Bloger Medan - Find me on Bloggers.com bloggersumut.net
 

Anak Medan. Copyright 2012 All Rights Reserved Free Wordpress Templates by Brian Gardner Blogger Templates presents HD TV Fringe Streaming. Featured on Wedding Photographers Singapore.