Cara Memasang Related Post di Bawah Iklan Tengah Postingan Blog

Baca Juga

Sebelumnya CB sudah share cara memasang related post di tengah postingan blog dan cara pasang iklan di tengah artikel.

Tips kali ini menggabungkan keduanya, yaitu manampilan Related Post di bawah iklan yang ada di tengah tulisan atau posting blog.

Tujuannya biar nggak terlalu mengganggu pembaca. Ini penampakannya, yang digabungkan dengan iklan link responsive.

Cara Memasang Related Post di Bawah Iklan Tengah Postingan Blog

Untuk menerapkan tips ini di blog Anda, Anda harus lebih dulu memasang iklan di tengah postingan. Setelah itu, ikuti panduan berikut ini:

1. Tema > HTML
2. Copas kode berikut ini di atas kode </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type="text/javascript">
//<![CDATA[
var relatedTitles = new Array(); var relatedTitlesNum = 0; var relatedUrls = new Array(); function related_results_labels(json) { for (var i = 0; i < json.feed.entry.length; i++) { var entry = json.feed.entry[i]; relatedTitles[relatedTitlesNum] = entry.title.$t; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') {relatedUrls[relatedTitlesNum] = entry.link[k].href; relatedTitlesNum++; break;}}}} function removeRelatedDuplicates() { var tmp = new Array(0); var tmp2 = new Array(0); for(var i = 0; i < relatedUrls.length; i++) { if(!contains(tmp, relatedUrls[i])) { tmp.length += 1; tmp[tmp.length - 1] = relatedUrls[i]; tmp2.length += 1; tmp2[tmp2.length - 1] = relatedTitles[i];}} relatedTitles = tmp2; relatedUrls = tmp;} function contains(a, e) { for(var j = 0; j < a.length; j++) if (a[j]==e) return true; return false;} function printRelatedLabels() { var r = Math.floor((relatedTitles.length - 1) * Math.random()); var i = 0; document.write('<ul>'); while (i < relatedTitles.length && i < 20) { document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>'); if (r < relatedTitles.length - 1) { r++; } else { r = 0;} i++;} document.write('</ul>');}//]]>
</script>
<style>
.related-post {position: relative;background: #fafafc;padding: 0;margin: 15px 0;float: left;width:100%;border-bottom: 1px solid #eee;}
.related-post h4{background:#666 !important;padding:8px 0 !important;margin:0;text-align:center !important;font-size:15px !important;font-weight:400;text-transform:none;color:#fff !important}
.related-post ul {margin:0;padding:0}
.related-post ul li {list-style:none !important;padding:7px 0;margin:0 7px;border-bottom:2px dotted #ddd;line-height:1.4em !important;text-align:left !important}
.related-post ul li:last-child{border:none !important}
.related-post a {color:#1b71bc;font-size:13px !important}
.related-post a:hover {text-decoration:underline}
</style>
  </b:if>

3. Copas kode berikut ini di atas atau di bawah kode iklan AdSense yang sudah dipasang di tengah postingan:

<div class='related-post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<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>
</b:if>
<h4>Related Posts</h4>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</div>

Angka 5 adalah jumlah artikel terkait yang ditampilkan.

4. Simpan template!

Demikian Cara Memasang Related Post di Bawah Iklan Tengah Postingan Blog. Good Luck & Happy Blogging! (www.contohblog.com).*