Cara Membuat Related Post bergambar diBawah Postingan

Assalamualaikum sobat posta. Aku mau kasi Cara Membuat Related Post bergambar diBawah Postingan. Meskipun udah sangat lama, itung-itung buat ngepenuhin blogku juga. Oke langsung disimak aja yaa Cara Membuat Related Post bergambar diBawah Postingan.
sumber artikel : http://tips-gobel.blogspot.com/2013/04/cara-membuat-artikel-terkait-related-post-dengan-gambar-tumbnail.html
Penampakannya seperti ini


afinzdi.blogspot.com


  • Login ke blogger kalian
  • Pilih template, edit html
  • Cari kode ]]></b:skin> pake Ctrl+F
  • Udah ketemu copas kode dibawah ini tepat diatas kode ]]></b:skin>
<b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
#related-posts{float:center; text-transform:none; height:100%; min-height:100%}
#related-posts a{color:black}
#related-posts a:hover{background-color:transparent; box-shadow: 0 2px 10px white, 0 2px 7px blue}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixFxZS7FgA0TIL1wLxkzzDvPm5wr1C8c6uidPA5GFrcjjSmefyrq4ZijoFEt1Tn57US2nZFb9l1o9-dyHjBf3OF1Z7qPIBK2EoI8cC5PPMwFE3UBZ1MsZoZBrHNF-FMfDU10YFXmduHmc/s400/noimage.png";
var maxresults=6;
var splittercolor="#333";
var relatedpoststitle="Baca Juga ini";
</script>
<script src='http://artikel-terkait-bergambar.googlecode.com/files/artikel-terkait-bergambar.js' type='text/javascript'/>
</b:if>

  • Kemudian untuk pemasangannya dibawah artikel,kalian cari kode <data:post.body/>.
Biasanya tiap template berbeda-beda, jika kalian sudah memasang auto readmore, maka cari kode  <data:post.body/> yang kedua, atau bila ada yang ketiga
  • Jika sudah ketemu kalian copas kode dibawah ini tepat setelah kode <data:post.body/>

<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=6&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>

  • Simpan template kalian. Semoga berhasil


Demikian artikelku tentang Cara Membuat Related Post bergambar diBawah Postingan. Semoga bermanfaat untuk kalian semua. Salam Quincy ^^
Previous
Next Post »

7 comments

Click here for comments
Saya
admin
August 5, 2013 at 6:35 PM ×

Makasih gan tutornya dah berhasil nih

Reply
avatar
Afif Nuzia A
admin
August 6, 2013 at 12:40 AM ×

iya sama2
terima kasih udah mampir..

Reply
avatar
Unknown
admin
August 14, 2013 at 2:48 PM ×

Bos di template ane kode pertama bisanya di copy di bawah
kalo di taroh diatas tampilanya jadi lebar-banget
ni hasil nya di blog ane http://britanas.blogspot.com/
and MAKASIH YA ATAS INFONYA,

Reply
avatar
Afif Nuzia A
admin
August 14, 2013 at 5:17 PM ×

kenapa kok g bsa??
bsa kok,,harus diatas kode ]]> biar tampilannya maksimal,,

Reply
avatar
Unknown
admin
October 25, 2013 at 1:21 AM ×

Punyaq juga mas bro, malah jadi lebar nie.

Reply
avatar
jawa
admin
May 6, 2014 at 12:08 AM ×

berhasil mas, terimakasih ya :cendol:

Reply
avatar
Unknown
admin
June 6, 2014 at 4:34 PM ×

kereeeeeeeeeeeeenn
http://ichanmonolog27.blogspot.com/

Reply
avatar

Tata Cara Berkomentar yang Baik dan Benar :

1. Gunakan Bahasa yang Sopan.
2. Biasakanlah berkomentar sebelum meninggalkan.
3. Usahakan jangan menggunakan anonymous
4. Saya sangat berterima kasih atas komentar yang kalian berikan
5. Admin selalu berusaha melakukan yang terbaik untuk para pengunjung ConversionConversion EmoticonEmoticon

Thanks for your comment