Cara Membuat Related Post Dibawah Postingan Dengan Gambar

Cara Membuat Related Post Dibawah Postingan Dengan Gambar - Ini adalah dokumentasi tips nge blog saya untuk memudahkan cara-cara edit blog sehingga tampil menarik dan memiliki CTR yang tinggi. sumber: http://mari-berbagi244.blogspot.com

Jika sobat blogger ingin memasang / menggunakan Artikel Terkait / Related Post ini di blog sobat, silahkan ikuti langkah-langkah cara membuatnya dibawah ini :

Sobat Login ke akun blog sobat.
Pilih Template =>> Edit HTML. (Saya sarankan untuk mem-backup dulu template sobat untuk menghindari hal-hal yang tidak diinginkah / error)
Sobat cari kode berikut </head> Untuk mempercepat pencarian sobat tekan Ctrl+F di kotak script Edit HTML sobat.
Kemudian letakan kode dibawah ini tepat diatas kode </head>

<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.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://my-project-favicon.googlecode.com/files/relatedposts.js.txt' type='text/javascript'/>
</b:if>

Jangan disimpan dulu template sobat.
Kemudian sobat cari lagi kode <data:post.body/> Untuk mempermudah pencarian gunakan Ctrl+F di kotak Edit HTML. (biasanya ada 3 kode seperti ini. Jika memang benar, pilih kode yang ke 2)
Copy kode berikut, dan letakan di bawah kode <data:post.body/>

<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=12"' type='text/javascript'/></b:if></b:loop>
<h3><b>Related Posts</b></h3>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=10;
var relatedpoststitle="";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://www.dataterbaru.com/' style='display:none;'></a>
</b:if>
</b:if>

Kode yang berwarna Orange bisa sobat ganti dengan kata-kata sobat sendiri apakah Artikel Terkait / Related Post.
Kode yang berwarna Merah adalah kode banyaknya artikel terkait yang akan di tampilkan di blog sobat, jadi modifikasikan sesuai dengan keinginan dan kebutuhan sobat.
Kode yang berwarna Biru sobat ganti dengan alamat URL blog sobat.
Kemudian Simpan Template dan lihat hasilnya.

Demikian artikel yang saya buat mengenai Cara Membuat Related Post / Artikel Terkait Dibawah Postingan Dengan Gambar. Semoga artikel yang saya buat ini dapat bermanfaat dan berguna buat sobat blogger yang membutuhkan. Jika ada yang ingin ditanyakan atau mengalami error dalam pembuatan silahkan berkomentar di kolom komentar atau di chatbox. Terima kasih dan Salam blogger.

Baca juga artikel sebelumnya tentang cara naikin alexa dan membuat tanda rating bintang di posting.

Update Daftar Terbaru

Cara Membuat Related Post Dibawah Postingan Dengan Gambar

Menu Halaman Statis