Cara menciptakan artikel terkait bergambar di blog (Related Post)
Assalamualaikum wr. wbSalam Blogger Indonesia
Mungkin anda semua sudah tau apa itu artikel terkait di dalam Blog. ialah sekumpulan artikel yang anda kumpulan menjadi dalam satu label dan dikala pengunjung membuka artikel anda pastinya ada artikel yang lain yang mungkin diharapkan atau dicari pengunjung dan pastinya sanggup menambah jumlah pageview blog anda.
Untuk cara menciptakan nya hanya meng edit HTML di template anda, dan menambah instruksi script di dalam HTML template blog yang anda gunakan.
silahkan ikuti langkah-langkah di bawah ini :
1. Anda harus Login terlebih dahulu di blogger
2. Lalu klik Template
3. dan Pilih Edit HTML
4. Lalu anda Cari Kode </head> Di HTML Template anda (Copy code Script dibawah ini dan letakan di atas Kode </head>
<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.3em;
font-weight: bold;
color: #000000;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:#000000;
}
#related-posts a:hover{
color:#000000;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://eflianda-blogzzz.googlecode.com/files/relatedthumbs.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.3em;
font-weight: bold;
color: #000000;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:#000000;
}
#related-posts a:hover{
color:#000000;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://eflianda-blogzzz.googlecode.com/files/relatedthumbs.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
4. Masih dalam HTML Template blog anda Lalu Cari code <Div Class='Post-Footer'> dan Code ini mungkin terdapat 2 Code di dalam Template anda, Coba saja letakan Code Script Di bawah ini sempurna di atas Code <Div Cclass='Post-Footer'> yang Kedua.
<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=5;
var relatedpoststitle="Baca juga Artikel Terkait di bawah ini : ";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->
<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=5;
var relatedpoststitle="Baca juga Artikel Terkait di bawah ini : ";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->
5. Ganti aksara yang berwarna merah untuk berapa banyak artikel dan warma biru dengan Kata sesuai cita-cita anda.
6. Klik Pratinjau untuk Melihat di blog anda apakah terjadi eror atau tidak.
7. Jika OK, Klik Simpan Template.
Demikianlah cara menciptakan artikel terkait bergambar di blog (Related Post). Semoga artikel ini bermanfaat buat anda. dan Terimakasih sudah bekunjung