Selamat malam sobat wepotus semunya, kali ini saya akan sharing mengenai cara membuat related post di blogger. Dengan kita membuat related post baik itu di yang simpan di teangah artikel maupun di akhir artikel, hal ini akan berpengaruh pada tingkat bounce sebuah blog.
Seperti yang kita tahu bahwa google sangat menyukai blog yang tingkat bounce ratenya sangat rendah, related post ini juga sangat ringan untuk loading ,karena related post atau artikel terkait ini akan di buat tanpa tumbhnail atau gambar, nah bagi anda yang ingin menggunakan related post ini, silahkan ikuti tutorial saya di artikel ini.
Sumber Gambar : Blog.kangismet.net |
Gambar di atas adalah tampilan related post yang akan kita buat, cukup simple dan ringan untuk loading.
Sebelum anda melakukan tutorial ini, silahkan backup template anda untuk menjaga kesalahan erorr pada template.
Cara Membuat Related Post Di Bawah Posting Blog.
1. Buka akun blogger anda.
2. Pilih menu template > klik edit Html.
3. Copy code di bawah ini dan letakan tepat di atas kode ]]></b:skin>
#related-post background:none;width:100%;margin-top:35px;margin-bottom:10px;padding:5px 0 10px 0px}
#related-post h4{font-size:150%;text-transform:uppercase;margin:0 0 15px;padding:0;font-weight:normal}
#related-post li{background:url(http://4.bp.blogspot.com/-Bt0JYGRHfpk/T7ZpN5RNSQI/AAAAAAAAGJQ/zQtrWVZwgHA/s1600/bullet.png) no-repeat 1px 5px;color:#2c3e50;text-indent:0;line-height:1.6em;margin:0;padding:0 0 3px 19px}
#related-post .widget{margin:0;padding:0}
#related-post ul{list-style:none;margin:0;padding:0}
4. Lalu copy code dibawah ini dan letakan tepat dibawah </article>
<b:if cond='data:blog.pageType == "item"'>
<!-- Related Post Widget Start -->
<b:if cond='data:blog.pageType == "item"'>
<!-- Related Post Widget Start -->
<div class='related-post' id='related-post'/>
<script type='text/javascript'>
var labelArray = [<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
"<data:label.name/>"<b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop></b:if>];
var relatedPostConfig = {
homePage: "<data:blog.homepageUrl/>",
widgetTitle: "<h4>Related Post</h4>",
numPosts: 6,
titleLength: "auto",
containerId: "related-post",
newTabLink: false,
widgetStyle: 1,
callBack: function() {}
};
</script>
<!-- Related Post Widget End -->
</b:if>
</b:if>
</b:includable>
5. Save template.
Comments (2)
dodoiddtsays:
January 24, 2018 at 10:16 amMakasih gan!
Saya coba pakai di blog saya…
Imran Prasetyasays:
January 25, 2018 at 11:32 pmsama-sama gan, semoga bermanfaat