- Back to Home »
- Blog , Uncategories »
- Cara Buat Artikel terkait atau Related Post di Bawah Post Blog
Posted by : Muhajir Abdullah
Sabtu, 07 Maret 2015
Tutorial Cara buat Artikel terkait atau Related Post di bawah post entri blog yang memungkinkan pengunjung untuk mudah menemukan artikel yang berhubungan sangatlah mudah, contohnya bisa lihat di bawah posting blog ini, syaratnya harus punya blog dulu (dah pasti ya) heheheee
yok langsung aja simak
- pertama-tama sobat masuk ke Menu Themplete yang ada di blogger ( backup dulu sebelum edit )
- kedua Pilih Edit HTML >>Lanjutkan >>
Ketiga Cari Kode Ini </head>
Biar lebih mudah tekan CTRL + F, tulis atau pastekan kode itu kemudian klik Enter.
Selanjudnya Pastekan kode di bawah ini tepat di atas atau sebelum kode </head>
<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts{float:left;width:auto;}
#related-posts a{border-right: 1px dotted #eaeaea;}
#related-posts a:hover{background: #EEEEEE;}
#related-posts h2{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;}
#related-posts .related_img {margin:5px;border:4px solid #f2f2f2;width:100px;height:100px;transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;-ms-transition:all 300ms ease-in-out;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }
#related-title {color:#666;text-align:center;padding: 0px 5px 10px;font-size:12px;width:110px;}
#related-posts .related_img:hover{border:4px solid #E8E8E8;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}</style>
<script src='http://helplogger.googlecode.com/svn/trunk/relatedposts.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
- Kemudian cari kode <div class='post-footer'> seperti yang sobat lakukan tadi, biasanya kode itu tidak satu, sobat boleh pilih dan coba satu persatu.
- Pastekan kode di bawah ini tepat diatasnya.
<!-- Related Posts with Thumbnails Code Start-->
<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>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=8"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=4;
var relatedpoststitle="<b>Related Posts:</b>";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div class='clear'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://helplogger.blogspot.com'><img alt='Blogger Tricks' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6E0C0XkJ8tiK32Nast4yCG_a1-P0KIp1_mIXSyH_PcyppQBD9efUa39b446X_dK6nFTQ5ohL3M77ChkUBDA_jzdytHZJddCDGXslzwWJWBdJdOeUUIb-ygB9rF23n4ouQ11q-S6M9pG5w/s1600/best+blogger+tips.png'/></a>
</b:if></b:if><!-- Related Posts with Thumbnails Code End-->
keterangan sobat boleh ubah : maxresult = 4 dengan jumlah artikel terkait yang sobat inginkan. kemudian simpan temlatenya.
Selamat mencoba !