- Blog Personal Informations

19 June 2013

Cara Membuat Related Post / Artikel Terkait dengan Button Icon

Artikel Terkait seo loading

Membuat Related Posts / Artikel Terkait - Kali ini saya ingin berbagi dengan sobat semuanya karena kemarin saya share tentang sebuah informasi Fenomena Lautan Paling Misterius di Dunia. sekaranng saya berbagi yang mungkin sudah banyak yang mengetahuinya.. akan tetapi tidak ada salahnya jika saya share lagi?? barang kali saja ada yang mau.. Widget Artikel Terkait ini lumayan cukup Friendly karena tidak menampilkan tumbnail, sehingga besar kemungkinan akan sedikit mengurangi beban loading blog sobat, hanya title / judul artikel saja yang di tampilkan dengan hiasan icon di depan judul tersebut.
#.Berikut cara pemasangan artikel terkait dengan mini icon.


  • Masuk Ke Rancangan => Edit HTML
  • Cari Kode </head> dan masukan kode di bawah ini tepat di atas kode </head>

<b:if cond="data:blog.pageType == &quot;item&quot;">
<style type="text/css">
#related-posts{width:100%;font-size:12px tahoma;margin: 15px 0 7px 0;}
#related-posts .widget{list-style-type:none;margin:5px 0 5px 0;padding:0;}
#related-posts .widget h2, #related-posts h2{font-size:20px;
font-weight:normal;margin:5px 7px 0; padding:0 0 5px;}
#related-posts a{text-decoration:none;}
#related-posts a:hover{text-decoration:none;}
#related-posts ul{border:medium none;margin:16px;padding:0;}
#related-posts ul li{display:block;background:url(Masukan URL image icon) no-repeat;
padding:0 0 1px 21px;margin-bottom:3px;line-height:1.6em;
border-bottom:1px dotted #cccccc;}
#related-posts ul li a{background:#fff;display:block;}
#related-posts ul li a:hover{background:#E9F5FB;}
</style>
<script src="http://putrabatak.googlecode.com/files/relatedpost-icon.js" type="text/javascript">
</b:if></blockquote>
</div>
</script></b:if>

Note: Ganti text yang berwarna MERAH dengan url icon keinginan sobat..


  • langkah selanjutnya silahkan sobat cari kode <data:post.body/> dan letakan kode di bawah ini tepat di bawahnya, biasanya ada 3 jenis kode tersebut silahkan di coba saja satu per satu yang menurut sobat cocok dan tepat..


<!-- Start Related post-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<font face='Arial' size='3'><b>Artikel lain yang berkaitan dengan <u><a expr:href='data:post.url' expr:title='data:blog.pageName'><data:blog.pageName/></a></u> : </b></font>
<font color='#FFFFFF'><b:loop values='data:post.labels' var='label'>
<data:label.name/><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&amp;max-results=7&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
</b:if>
<!--End Related post-->
Note: Angka 7 adalah jumlah posting yang di inginkan muncul di related post.
dan terakhir SAVE. untuk menghindari erorr lebih baik sebelum melakukan pengeditan, templatenya di back-up terlebih dulu untuk menghindari besar atau kecilnya erorr..

Previous
Next Post »