all about simple tips and ideas

Cara Membuat Related Post Blogger

loading...

Membuat Related Post dengan Thumbnail pada Blogger bukan hal yang baru lagi bagi sahabat yang sudah sekian lama hidup di dunia blogspot. Related Post yang menyertakan image alias gambar secara thumbnail akan lebih mempercantik tampilan blog, dan diyakini dapat meningkatkan pageview pada blog sahabat yang mungkin saja bisa meningkatkan kualitas alexa pagerank atau tambahan recehan dolar. Berhubung kemarin ada sahabat blogger yang bertanya di blog sebelah, maka langsung saja saya share tips yang telah tersimpan dalam sanubari :embeerrrr:, untuk sedulur yang sudah lebih expert,” tidurlah selamat malam, lupakan sajalah.. aku..” biarkan pemula ini lagi belajar merangkak -glunthang- 😀

Cara Membuat Related Post dengan Image Gambar Posting adalah sebagai berikut:

1. Edit HTML Template Blogger

Silahkan login ke blogger.com

Klik Rancangan/Design, klik Edit HTML, kemudian checkmark alias contreng Expand Widget Templates

Membuat CSS Related Post lebih dahulu, salin kode berikut ini

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<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, &#8220;Times New Roman&#8221;, 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://jiox.googlecode.com/files/sambung.js' type='text/javascript'/>

</b:if>

kemudian pasang/letakkan di atas kode </head>

3. Tekan F3, kemudian search atau cari kode ini

<div class='post-footer-line post-footer-line-1'>

kalau tidak ada, alternatifnya cari kode ini

<p class='post-footer-line post-footer-line-1'>

kemudian salin dan letakkan kode dibawah ini, setelah kode di atas

<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>

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<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:if></b:loop><a href='http://alkatro.com/' style='display:none;'>simple tips</a>

<script type='text/javascript'>

var currentposturl=&quot;<data:post.url/>&quot;;

var jumlahpost=7;var judulnya="Artikel Terkait";

removeRelatedDuplicates_thumbs();printRelatedLabels_thumbs();

</script>

</div><div style='clear:both'/>

</b:if>

Keterangan:

text yang bercetak miring dan di bold : var jumlahpost=7

menandakan jumlah judul posting yang akan muncul, angka 7 silahkan sesuaikan dengan selera sahabat

Text Artikel Terkait, adalah kalimat judul yang akan muncul di atas daftar artikel posting terkait pada blog sahabat,silahkan ganti dengan kalimat yang lebih romantis dan mendayu dayu :halah:

Kalau Sudah silahkan “Save Template”

relate post thumbnail,related post dengan gambar

Bagaimana cotoh penampakannya silahkan sahabat klik image di atas.

Demikianlah tips memasang Related post blogger dengan thumbnail image alias gambar pada blogger ini 😀

Related Post

8 Responses to Cara Membuat Related Post Blogger

  1. Berpikir Positif says:

    related post bisa menambah pageview ya mas, jujur mas rasanya agak ngeh juga bikin berpikir positif begitu, makanya aku akan menjadikannya blog kedua aku , sekarang aku keliling dengan blog yang lain

    • admin says:

      saya malah pingin seperti mas munir, blognya pake bhs inggris semua.. apadaya grammar saya katro beneran, bikin post bahasa lokal saja bahasanya ngalor ngidul 😀

      @download: klik gambar ilustrasinya gan , ada link ke blogspot contoh 🙂

      @rizky,@bang atta,@asis : yoi deh, ane malah baru belajar kemarin, he he

      @moenas: enggak tiap hari, kebetulan ada yang nanya dan kemaren lagi libur nyari rumput 🙂

      -makasih semuanya

  2. Download One Piece Indonesia says:

    Contoh jadinya kaya gimana ya gan?

  3. Rizky2009 says:

    kayaknya d blog q juga sudah saya pasang deh widged ini, keren

  4. attayaya_surat says:

    seeeeep….

    aku malah udah lupa pake script yg mana

  5. Asis Sugianto says:

    Kebetulan saya sudah memasang relead post di blog saya sob,,, untuk memudahkan pengunjung,,

  6. moenas says:

    oh…gtu brow

    tapi mantabbbzzz akhirnya bisa juga dapetin domain xoxoxo….

    kayanya updetan web yg ini setiap hari ya?..sukses buat alkatrooo

  7. DenBaGas says:

    Salam

    Berkunjung lagi kawan alkatro. Kebetulan blog saya eror tuk related post nya. Ijin ambil tutorialnya kawan.

    Salam kawan