Home » , » Cara Membuat Related Post di Bawah Postingan

Cara Membuat Related Post di Bawah Postingan

Beberapa kali saya memposting  Cara Membuat Related Post di Bawah Postingan tapi setelah beberapa lama kemudian ternyata no work atau tidak tampil dibawah postingan, membuat lumayan sebel, ini akibatkita selalu menumpang padajava script orang lain. tapi sekarang saya posting lagi dan masih menempel pada oranmg lain.

Dan ternyata blogger telah merubah cara penyimpanan htmlnya sehingga kita perlu lagi belajar bagaimana mencari salah satu kode html yang kita inginkan,karena pada cara baru ini meskipun kita menggunakan  (Gunakan Ctrl+F untuk mempermudah pencarian) belum tentu ketemu.

Namun jika template blog anda sudah menyajikan Related Post, abaikan saja ini). Sekedar berbagi saja untuk kawan-kawan.

Cara Membuat Related Post di Bawah Postingan
  1. Bukalah akun blogger anda dengan tenang dan damai sejahtera.
  2. Pilihlah Elemen Template. Lalu Pilit Edit HTML, jangan lupa centang Expand Template Widget
  3. Carilah kode </head> (Gunakan Ctrl+F untuk mempermudah pencarian), setelah anda menemukannya, letakkanlah kode javascript di bawah ini (Copy) persis di atas kode </head> tadi (Pastekan)

    <style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin: 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWaZuRVF2a58MLPLWNTxPkAlraBLNwY8gvP_AMiO1GxHIefYvwT9J2asp5iW76U7a_pvlKyck39puIUg_86BctCq11EAxqwA89icDGJyWvp8gJVjANpiILBQGmlCLRLcFOXjkdt31Q4js/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://yourjavascript.com/11631137121/related_post_pelajaran_blog.js' type='text/javascript'/>
  4. Aplagi cara no 3 diatas sudah anda lakukan, selanjutnya cari lagi kode berikut: <data:post.body/>, Sudah ketemu belum kode itu, kalau sudah ketemu, letakkan lagi kode di bawah ini (copy) tepat di bawah kode <data:post.body/> (pastekan)
    <br/><br/><b:if cond='data:blog.pageType == "item"'>
    <div id="related-posts"><font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><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&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font><script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script>
    </div></b:if>
  5. Setelah selesai, lalu simpan template blog anda.
  6. Lihat hasilnya seperti apa.

Catatan :
Kode <data:post.body/> mungkin anda akan temukan banyak, pilih saja satu, tidak apa-apa kok anda coba-coba yang penting anda faham.

sumber
bos-tutorial.blogspot.com

1 comments: