Friday, May 8, 2015

Cara Membuat Releated Post di Bawah Postingan Blog

Cara Membuat Releated Post di Bawah Postingan | Pada kesempatan kali ini Fikars Blog akan berbagi tutorial bagaimana caranya membuat releated post atau releated artikel di bawah postingan blog. Sebagian Blogger kadang bingung dan ada yang belum tau bagaiamana cara membuat releated post dibawah postingan seperti di blog ini. Nah untuk itu bagi Anda yang ingin mengetahui bagaimana cara membuat releated post dibawah postingan .

cara membuat releated post dibawah postingan
Hasilnya Seperti Ini kira-kira
Ya hasilnya akan tampak seperti gambar diatas atau bisa lihat dibawah postingan artikel blog ini, Mau tahu caranya agar bisa releated post dibawah postingan, simak saja dibawah ini.

Cara Membuat Releated Post di Bawah Postingan

1. Login ke Akun Dasbor Blogger Anda
2. Pada Menu Dasbor Blog pilih tab template. Lalu Pilih Edit HTML , dan jangan lupa klik expand widget template, Seperti gambar dibawah ini
cara membuat releated post dibawh postingan

3. Kemudian carilah kode </head> (Gunakan Ctrl + F untuk memudahkan dalam pencarian kode tersebut) setelah Anda menemukan kode tadi maka setelah itu Paste kan kode javascript dibawah ini tepat dibawah kode </head>

<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/AVvXsEgAYi5AZVqRMKukk8mZBlNm9JHfkx3qH1iPVH_TSBwImP3oC52jwhEnJgHW1bLt8JdzXy5YXY5FtJ1-rRibg7d4c-at5TI-3SX457YdIfO-AFLgMpVmHeAN218bipTIgGJF26Pb1YKfDtA/") 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. Jika cara nomor 3 diatas sudah dilakukan, langkah selanjutnya adalah cari kode berikut : <data:post.body/>, nah jika sudah ketemu kode tersebut , kemudian letakkan kembali kode javascript dibawah ini copy dan pastekan tepat dibawah <data:post.body/> 

<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. Apabila semua langkah diatas sudah selesai, maka klik simpan template 

6. Lihat hasilnya di blog seperti apa

NB : kode <data:post.body/> banyak di HTML , jadi pilih saja salah satu nya tidak apa-apa

Demikianlah Tutorial Cara Membuat Releated Post dibawah postingan, semoga bermanfaat dan membantu Anda yang sedang kebingungan dan tidak bisa membuat releated post dibawah postingan blog Anda.

No comments:

Post a Comment