Cara Memasang Related Post di Bawah Iklan Tengah Postingan Blog

Cara Memasang Related Post di Bawah Iklan Tengah Postingan Blog

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.

Related Post di Bawah Iklan Tengah Postingan Blog

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).*

Thanks for reading Cara Memasang Related Post di Bawah Iklan Tengah Postingan Blog | Labels: Desain Blog edit this post
0 Komentar untuk "Cara Memasang Related Post di Bawah Iklan Tengah Postingan Blog"

1. Komentar spam, link aktif, dan alamat blog tidak akan muncul.
2. Tidak semua pertanyaan sempat/bisa dijawab.
3. Bagi yang mau tanya, sebelum bertanya, silakan cari dulu di Kotak Pencarian.
Thanks for visiting and the comment :)

Contact Form

Name

Email *

Message *