Cara Membuat Artikel Terkait Dengan Gambar

Cara Membuat Artikel Terkait Dengan Gambar

Cara Membuat Artikel Terkait Dengan Gambar - Artikel Terkait atau related post cukup penting terutama karena dengan adanya Artikel Terkait pengunjung yang sedang membaca tidak merasa bosan karena adanya artikel terkait, selain itu Artikel Terkait atau related post bagus buat SEO.

Berikut ini beberapa cara membuat artikel terkait dengan gambar pada blog kita.

1. Login Blogger
2. Masuk Menu Template - Edit HTML - Lanjutkan
3. Centang pada Expand Template Widget
4. Cari kode </head>
5. Gunakan tombol CTRL + F / F3 untuk mempermudah pencarian.
6. Lalu Copy kode berikut dan letakan tepat diatas kode </head>

<!-- Kode awal Artikel Terkait -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwM8TO43233CSiRMu0QhvLUJ3w7Xf8AmlLPy5F6c7mCdPLlus_-5yeMgwEKDLAm_GFyisZijr71Jj1mqV0-HDo0RgiRSV7cN8RAdKmbTN4hX9ZcThNL78dMA2C-73i4NIQTnxbaVVlvI3p/s1600/No+Image.jpg&quot;;
var maxresults=6;
var splittercolor=&quot;#000000&quot;;
var relatedpoststitle=&quot;Artikel Menarik Lainnya:&quot;;
</script>
<script src='https://sites.google.com/site/creativoltz/home/RelatedPoststhumCreativoltz.js' type='text/javascript'/>
</b:if>
<!-- Kode akhir Artikel Terkait -->


7. Selanjutnya cari kode berikut ( Jika ada dua kode, pilih bagian yang kedua ) :
<data:post.body/> (Gunakan Ctrl+f /F3 untuk mempermudah pencarian)


8. Copy Script dibawah dan pastekan tepat dibawah kode <data:post.body/>

<!-- Kode Awal Artikel Terkait -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<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=7&quot;' type='text/javascript'/></b:loop> <script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Kode akhir Artikel Terkait -->

Keterangan :
Sobat bisa ganti kode berikut sesuai keinginan sobat :

• Untuk jumlah artikel terkait yang akan muncul : max-results=7
• Untuk Judul artikel terkait : var relatedpoststitle=&quot;Artikel Terkait Lainnya:&quot;;
• Untuk Warna Tulisan : var splittercolor=&quot;#000000&quot;;

Mudah-mudahan Cara Membuat Artikel Terkait Dengan Gambar bisa bermanfaat juga berguna

Terimakasih