Cara Membuat Baca Juga / Artikel Terkait Di Tengah Postingan Blog Seperti Template Vmagz

==Iklan Dipate Disini===

Cara Membuat Baca Juga / Artikel Terkait Di Tengah Postingan Blog Seperti Template Viomagz Lapakinfo.net - Pada kesempatan kali ini saya akan berbagi sebuah tutorial yang sangat penting perannya buat blog yaitu tutorial Cara Membuat Baca Juga / Artikel Terkait Di Tengah Postingan Blog Seperti Template Viomagz. Tujuan dari tutorial ini ialah supaya pengunjung blog berlama - lama di blog kita dan pengunjungpun bisa merasa puas karena banyaknya informasi yang di tampilkan pada blog kita.

Dengan membuat Baca juga atau Artikel Terkait di tenga postingan pada blog kalian itu bisa membuat pengunjung betah berlama - lama di blog kalian, maka blog kalian akan bagus di pandang oleh google. Saya sendiripun menerapkan cara ini dengan menggunakan cara otomatis. Nah, buat kalian yang mau membuat Baca Juga atau Artikel Terkait di tengah postingan pada blog kalian itu ada dua cara, cara manual dan cara otomatis. Tapi pada tutorial kali ini saya akan membuat Baca Juga atau Artikel Terkait di tengah postingan dengan cara otomatis.

Cara Membuat Baca Juga / Artikel Terkait Di Tengah Postingan Blog Seperti Template Viomagz

1. Buka Blog kalian
2. Pilih Tema lalu pilih Edit HTML
3. Cari kode ]]></b:skin>
4. Jika sudah ketemu salin kode di bawah ini dan letakan tepat di atas kode ]]></b:skin>

/* Related Post */
.related-simplify{position:relative;padding:20px 12px 12px 12px;margin:32px auto 24px auto;width:93%;border:4px double rgba(0,0,0,0.2)}
.related-simplify h4{background:#fff;padding:8px 10px;position:absolute;margin:0;font-size:17px;font-weight:700;color:#000;top:-21px;left:2.5%}
.related-simplify ul{margin:0;padding:0}
.related-simplify ul li{position:relative;list-style:none;padding:9px 0;margin:auto;line-height:1.4em;transition:all .3s}
.related-simplify ul li:before{content:'\f0c8';font-family:fontawesome;position:absolute;margin:0 5px 0 2px;color:rgba(0,0,0,0.5);overflow:hidden;font-size:60%;left:10px;transition:all .3s}
.related-simplify ul li:hover:before{content:'\f0c8';font-family:fontawesome;color:#0383d9;}
.related-simplify a{color:#000;font-size:14px;margin:0 0 0 30px;}
.related-simplify a:hover{color:#0383d9;}
.related-simplify ul li:nth-child(n+4) {display:none;}
@media only screen and (max-width:768px){
.related-simplify{padding:15px 0 10px 0;width:100%;border:2px solid #e74c3c;border-left:0;border-right:0}
.related-simplify h4{color:#e74c3c;padding:8px;font-size:15px;top:-18px;left:3.5%}
.related-simplify a{font-size:14px;margin:0}.related-simplify a:hover{color:#e74c3c}
.related-simplify ul li{padding:5px 0}
.related-simplify ul li:before,.related-simplify ul li:hover:before{display:none}}

5. Cari kode </head> jika sudah ketemu copy kode di bawah ini pastekan tepat di atas kode </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
var relatedSimply = new Array(); var relatedSimplyNum = 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]; relatedSimply[relatedSimplyNum] = entry.title.$t; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') {relatedUrls[relatedSimplyNum] = entry.link[k].href; relatedSimplyNum++; 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] = relatedSimply[i];}} relatedSimply = 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((relatedSimply.length - 1) * Math.random()); var i = 0; document.write('<ul>'); while (i < relatedSimply.length && i < 20) { document.write('<li><a href="' + relatedUrls[r] + '">' + relatedSimply[r] + '</a></li>'); if (r < relatedSimply.length - 1) { r++; } else { r = 0;} i++;} document.write('</ul>');}
//]]>
</script>
</b:if>

6. Lanjut cari kode <data:post.body/>   hapus kode tersebut dan ganti dengan kode dibawah ini

<div expr:id='&quot;post1&quot; + data:post.id'/>
<div class='related-simplify'>
<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=3&quot;' type='text/javascript'/>
</b:if>
</b:loop>
</b:if>
<h4>Baca Juga</h4>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</div>
<div expr:id='&quot;post2&quot; + data:post.id'><p><data:post.body/></p></div>
<script type='text/javascript'>
var obj0=document.getElementById(&quot;post1<data:post.id/>&quot;);
var obj1=document.getElementById(&quot;post2<data:post.id/>&quot;);
var s=obj1.innerHTML;
var t=s.substr(0,s.length/2);
var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;);
if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}
</script>

7. Simpan template dan selesai

Dengan memasang kode di atas kalian tidak repot - repot membuat link satu persatu pada postingan kalian karena cara di atas ialah cara otomatis, sekian postingan tentang Cara Membuat Baca Juga / Artikel Terkait Di Tengah Postingan Blog Seperti Template Viomagz, semoga bermanfaat buat kalian semua dan terimakasih sudah berkunjung.

==Iklan Dipate Disini===