Apa kabar sobat blogger? pada hari yang cerah ini saya akan berbagi sebuah tutorial blog, yang sebelumnya saya pernah membuat tutorial tentang Cara Membuat Artikel Terkait. Perbedaannya dengan yang terdahulu yaitu, teletak pada gambar, kalau yang terdulu tidak memakai gambar akan tetapi sekarang yang akan saya share, di sertai gambar.
Untuk apa Membuat Related Post atau Artikel Terkait? menurut saya memasang hal tersebut selain mempercantik blog, juga dapat berfungsi membantu pengunjung untuk melihat artikel lain yang berhubungan dengan artikel yang sedang di baca. Jadi dengan begitu akan membuat betah pengunjung dan juga bisa meningkatkan pageview blog kita.
Ok sob, jika anda tertarik untuk membuat Related Post atau Artikel Terkait di blog kesayangan sobat, ikuti langkah - langkah berikut!
Cara Membuat Artikel Terkait di Sertai Gambar :
- Login Blogger kesayangan sobat.
- Template > Edit HTML
- Jangan lupa centang pada Expand Template Widget
- Cari kode </head> Gunakan tombol CTRL + F untuk mempermudah pencarian.
- Lalu Copy kode berikut dan letakan tepat diatas kode </head>
<!--Start Related Posts-->
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:90%;
min-height:90%;
padding-top:0px;
padding-left:8px;
}
#related-posts h2{
font-size: 1.0em;
font-weight: bold;
color: white;
font-family: Rockwell,Georgia,Serif;
margin-bottom: 0.8em;
margin-top:0em;
padding-bottom:0em;
}
#related-posts a{
color:white;
}
#related-posts a:hover{
color:white;
}
#related-posts a:hover {
background-color:#080;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTCxqP6EidCktGzzhAqV5CkZoq3XyiZEVVqYRRi46ggpRpF1rJuECfry9I1rGTTBmGWZS3RQjLl4qSFLL8jIul4RFlsYc0vveNae_e_o4lek7QpB44mttyLvBOqFTKYdehNhRm1Hqv_hmC/s1600/No+Image.jpg";
var maxresults=6;
var splittercolor="#000000";
var relatedpoststitle="Artikel Terkait:";
</script>
<script src='http://yourjavascript.com/22811210832/RelatedPoststhumb3.txt.js' type='text/javascript'/>
</b:if>
<!--End Related Post-->
6. Selanjutnya cari kode <data:post.body/> ( Jika ada dua kode, pilih bagian yang kedua ) :
<!-- Start Related Posts-->8. Paste'kan kode script diatas tepat dibawah kode :
<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>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=7"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
</b:if>
<!-- End Related Posts-->
<data:post.body/>9. Langkah terakhir klik Simpan Template.
NOT : Untuk kata berikut bisa anda ganti sesuai apa yang anda kehendaki :
- max-results=7 = Jumlah artikel yang akan di tampilkan
- Artikel Terkait = Judul (anda bisa menggantinya, contoh : related post)
- #000000 = Warna Tulisan
Sekian dari tutorial saya kali ini, semoga dapat bermanfaat bagi kalian semua.
Thanks gan infonya ....langsung ane coba
BalasHapusvisit back http://novaibnu.blogspot.com
Sama-sama gan. Terimakasih juga atas kunjungannya.
Hapusbos, di template ane gak bisa muncul bos... gmn solusinya bos?
BalasHapusjangan lupa kunjungi blog i'am
BalasHapushttp://anpezwarteg.blogspot.com
berhasil di http://alhabibi89.blogspot.com
BalasHapustq mas :)
Saya belum berhasil gan,,
BalasHapusntah knp tidak bisa di template blog ane
Mungkin salah menempatkan script yang di bawah data:postbody. Karena sript data:postbody kemungkinan di setiap template berbeda jumlah dan letaknya.
HapusSaran saya coba satu-satu menaruh script tersebut. kalau masih gak nongol juga ber'arti tamplate agan gak cocok.
terimakasih atas kunjungannya gan :)
cara no.4 gak ada, ini gimana?
BalasHapusMasa gak ada? Coba di cari lagi dengan mengunakan CTRL+F
Hapusthanks infonya. visit my blog at : http://inulwara.blogspot.com
BalasHapus