News Update :

Formulir Kontak

Nama

Email *

Pesan *

Software Free

Tutorial Blogger

Tutorial Blackberry

Cara Membuat Related Post Dengan Icon

Diposting oleh : Posted on Rabu, 14 November 2012 - 11:58 PM with No comments


Kali ini saya akan berbagi Tips Dan Tutorial Blog yaitu Cara Membuat Related Post Dengan Icon yang biasanya kamu temukan Related Post atau Artikel Terkait hanya link dan nomer saja, nah kali ini saya akan berbagi Tips untuk mempercantik Related Post atau Artikel Terkait dengan Memberi Icon disamping Link nya. Kaya di Blog Blazer



Langsung aja Cara Membuatnya

  • Login Ke Blog kamu.
  • Pilih Rancangan.
  • Pilih EDIT HTML.
  • Jangan Lupa Centang Expand Widget Template.
  • Lalu Copy Kode di bawah ini dan letakan di bawah kode </head>
<style type='text/css'> #related-posts { float : left; width : 100%; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #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 : 10px; padding : 0; } #related-posts ul li { display : block; background : url(&quot;http://3.bp.blogspot.com/-NxjtveQnzGg/TzZKcBnn_OI/AAAAAAAAAhg/ujxyW7hxzl4/s1600/Rss-icon+(11).png&quot;) no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://belajarblogging.googlecode.com/files/relpost.js' type='text/javascript'/>
Sobat bisa ganti kode yang berwarna Merah dengan URL Icon lainnya.

Selanjutnya Cari Kode <data:post.body/>, jika terdapat 4 code seperti ini kamu pilih kode yang no 2, lalu copy kode Di bawah ini tepat di bawah kode <data:post.body/>

<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </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=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>
Jika sobat menemukan 2 kode <data:post.body/> letakan aja di bawah kode yang ke 2 nya.
Jika sobat menemukan masalah haraf tinggalkan pesan di Kotak Komentar, dan jika sobat kebingungan 

Kumpulan Icon Keren Terbaru

Admin ------



Briefcase...



Label ...



Google ....



Search...



Folder label 1 ....



Back ..




Home ...




Next ...




Folder label 2 ...



Folder label 3 ...



YouTube

Komentar ...


Kumpulan Posting ...





Arsip ...



Pg Up


Facebook ...



Groop Facebook



Google +



Twitter



Star WIN 7




Tukar Link





Note ....





Tutorial Other

 

© Copyright 2-Bersaudara 2015 | Design by Herdiansyah Hamzah | Editing by 2-Bersaudara.