07 March 2010

Membuat Artikel Terkait


Nah kita mulai kelas hari ini dengan mata pelajaran cara membuat artikel terkait dibawah posting. Karna kebutuhan agar bloggers lebih mudah melihat artikel - artikel yang kita punya, akhirnya saya memberanikan diri untuk memposting artikel ini dan semoga empunya-Nya juga bangga. Oke, langsung saja kita mulai :

1. Masuklah ke halaman Dashboard > Tata letak > Edit HTML.

2. Centrang kotak mungil pada tulisan 'Expand Widget Templates'.

3. Ini juga penting jangan lupa untuk mengklik 'Download Template Lengkap' ya, karna sangat bermanfaat untuk membeckUp Template apabila terjadi error. Silahkan lihat di sini cara membackup template.

4. Copy paste kode berikut  tepat diatas kode </head>


<style>
#related-posts {
float : left;
width : 540px;
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://1.bp.blogspot.com/_cNpXRtRph18/SpbSRYurg2I/AAAAAAAAD7Q/GbYNm2feyIQ/rss.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;
}
#related-posts ul li:hover {
background-color:#E2EBF8;
border-top:1px dotted #cccccc;
}
</style>
<script src='http://oemar.googlecode.com/files/Related_post_hack.js' type='text/javascript'/>



5. Apabila sudah melakukan cara di atas, sekarang carilah kode dibawah ini dengan cara menekan (Ctr+f) pada keyboard Anda:

<p><data:post.body/></p>
Atau
<div class='post-body>

pokokne cari aja kode yang sama mirip apabila Anda kesulitan.


6. Lalu copy pastekan kode berikut tepat dibawah kode diatas, apabila terdapat dua kode yang sama tempatkanlah setelah kode yang paling terakhir.

<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>




7. Untuk menempilkan link artikel terkait sebanyak mungkin ganti angka yang berwarna merah diatas dengan yang anda inginkan.

8. Simpan dan Lihatlah hasilnya.

ingin melihat cara yang lebih lengkap kunjungi lembar-coretan.blogspot.com.

Terimakasih.




PENTING : Dalam setiap posting anda harus memberikan label/category, karena Related Post ini bekerja (mengelompokkan) berdasarkan label/category masing-masing. Jika dalam setiap posting tanpa label/category atau label/category disamakan dengan judul posting, Maka Related Post (Artikel Yang Berhubungan) tidak akan muncul .




Membuat Artikel Terkait Rating: 4.5 Diposkan Oleh: Sarifa Marwa

3 komentar:

  1. pertama!! hehe
    bagus banget,kalo bikin artikel terkait bisa nambahh seo

    ReplyDelete
  2. Blog punya Mas memang mantap! Aslinya... hehe.

    Salam kenal dan salam sukses selalu ya Mas.
    dari DANY

    ReplyDelete
  3. Terima kasih... Ijin copy html ya gan... OK ? Blog yang menarik nih untuk belajar blog dan bisnis online

    ReplyDelete

Komentar Spam, Link Aktif, dan URL Blog Takkan Muncul. Tidak semua pertanyaan sempat/bisa dijawab.