Cara Membuat Artikel Terkait Dengan Gambar di Bawah Postingan

Cara Membuat Artikel Terkait Dengan Gambar di Bawah Postingan - Cara Membuat Artikel Terkait Dengan Gambar di Bawah Postingan Blogspot, bicara soal tampilan, jika suatu barang dikemas dengan baik pasti akan banyak orang yang akan menikmatinya meski hanya sekedar melihat, yang padahal barang tersebut belum tentu berisi sama dengan kemasannya. Berbeda dengan barang yang meskipun bisa dikatakan baik, tetapi melalui penyajian yang salah maka akan tidak menarik. Seperti halnya suatu barang yang di jual maupun di pasarkan artikel pun juga begitu jika kita tidak mengemasnya dengan baik tentu akan jarang ada pengunjung. Salah satu penyajian atau pengemasan yang sering digunakan oleh para blogger adalah denga mengaitkan beberapa artikel di bawah postingan. Tapi, tidak hanya sekadar judul postingan semata tapi di bentuk secara tumbnail atau ber icon.
Mungkin bagi para blogger ada yang masih bingung cara membuatnya. Oke langsung saja
Berikut Cara Membuat Artikel Terkait Dengan Gambar di Bawah Postingan Blogspot :

⦁    Login Blogger
⦁    Masuk Menu Template - Edit HTML - Lanjutkan
⦁    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/AVvXsEi4Ot8soklKZXH6d76fe8kJViqXd7jlmBVteEwlmSf7KgeJS3gzS3ULPiBCNoxwuiY_KyWhyphenhyphenzmJY1dWxcJDH1qv6Py2ivgzhfQX7TIH5k8_cXTswyV55IFnK9CpeBKqGckz8KcBCdA1B0Cz/s1600/No+Image.jpg"; var maxresults=6; var splittercolor="#000000"; var relatedpoststitle="Silahkan Baca Ini Juga:"; </script> <script src='http://yourjavascript.com/22811210832/RelatedPoststhumb3.txt.js' type='text/javascript'/> </b:if> <!--End Related Post-->
⦁    Selanjutnya cari kode berikut ( Jika ada dua kode, pilih bagian yang kedua ) : <data:post.body/>
catatan setiap template dapat berbeda beda jika anda sudah memasang readmore anda harus mencari kode di bawahnya
⦁    Kalau kode diatas sudah ketemu, Sekarang copy'lah script berikut :
<!-- Start Related Posts--> <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-->

•  Paste'kan kode script diatas tepat dibawah kode : <data:post.body/> 

• Jika sudah, klik Simpan Template

• jika masih gagal cut kode yang kedua di atas <data:post.body/>yang lainnya,kemudian simpan begitu seteruznya.<!-- Start Related Posts--> ..................<!-- End Related Posts--> menunjukkan dimana artikel terkait kita akan kita letakkan,,kalau double dengan yang lain otomatis tidak bisa

Catatan :
Berikut ini adalah kode yang bisa sobat ganti sebelum menyimpan template, gantilah tulisan berwarna merah sesuai keinginan sobat.

⦁    Menampilkan jumlah artikel terkait yang muncul max-results=7
⦁    Judul artikel terkait var relatedpoststitle=&quot;Silahkan Baca Ini Juga:&quot;;
⦁    Warna Tulisan var splittercolor=&quot;#000000&quot;;

Nah, itulah tips blog mengenai Cara Membuat Artikel Terkait Dengan Gambar di Bawah Postingan semoga berhasil yah sobat.