Artikel Terkait Dengan Gambar

andrey Friday, September 25, 2009

Artikel terkait adalah salah satu cara agar mempermudah si pengunjung bisa juga melihat artikel yang mempunyai kategory yang sama dengan artikel yang sedang dibaca saat itu, ada beberapa jenis model artikel terkait salah satunya dengan yang ini.
Dengan artikel terkait ini , artikel yang akan di tampilkan akan disertai dengan sebuah gambar kecil sehingga tampilanya lebih menarik, berikut caranya :

1. Login Blog
2. Klik Tata Letak
3. Klik Edit HTML centang Expand Template Widget
4. Cari </head>
5. Pastekan script di bawah ini sebelum code </head>

 <br><b:if cond='data:blog.pageType == &quot;item&quot;'><br><style type="text/css"><br>#related-posts {float:center;text-transform:none;height:100%;min-height:100%;padding-top:5px;padding-left:5px;}<br>#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;}<br>#related-posts a{color:#820e34;<br>#related-posts a:hover{color:black;}<br>#related-posts a:hover {background-color:#d4eaf2;}<br></style><br><script src='http://hensblog.googlecode.com/files/rpthumbsv30.js' type='text/javascript'/><br></b:if><br>

6. Cari code :

<div class='post-footer-line post-footer-line-1'>

jika tidak ada cari kode dibawah ini:

<p class='post-footer-line post-footer-line-1'>

7. Copy kan code dibawah ini dibawah code diatas :

 <br><b:if cond='data:blog.pageType == &quot;item&quot;'><br><br><div id='related-posts'><br><br><b:loop values='data:post.labels' var='label'><br><br><b:if cond='data:label.isLast != &quot;true&quot;'><br><br></b:if><br><br><b:if cond='data:blog.pageType == &quot;item&quot;'><br><br><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'/><br><br></b:if><br><br></b:loop><br><br><a href='http://broncu.blogspot.com/' style='display:none;'>Artikel Terkait</a><br><br><script type='text/javascript'><br><br>var currentposturl=&quot;<data:post.url/>&quot;;<br><br>var maxresults=6;<br><br>var relatedpoststitle <a><blink>Baca Juga Artikel Dibawah Ini :</blink></a>;<br><br>removeRelatedDuplicates_thumbs();<br><br>printRelatedLabels_thumbs();<br><br></script><br><br></div><br><br><div style='clear:both'/><br><br></b:if><br>

8.Simpan Template.

nb :

• var maxresults=6; = untuk menentukan jumlah artikel terkait yang akan ditampilkan
•var relatedpoststitle <a><blink>Baca Juga Artikel Dibawah Ini :</blink></a>; = ganti dengan kata2 pilihan anda 'artikel terkait,dll'.
• tanda <a><blink></blink></a>; : Untuk membuat tulisan Baca Juga Artikel Dibawah Ini menjadi berkedip.
• #related-posts a{color:#820e34; : warna dari text Baca Juga Artikel Dibawah Ini ganti sesuai keinginan anda.

1 comment:

I'm Mrs. Right said...: kok aku gak nemu code di step no 6??; June 25, 2010 4:13 PM

Artikel Terkait Dengan Gambar

1 comment:

Post a Comment

Koment

RECENT COMMENT

Followers

History Visited