Cara Membuat Baca Juga Otomatis di Dalam Postingan

Cara Membuat Baca Juga Otomatis di Dalam Postingan - Menghubungkan satu artikel dengan artikel lainnya akan membuat pembaca artikel menjadi tertarik untuk berlama-lama mampir di blog kita dengan membaca artikel lain yang di sodorkan. Sesuai dengan judul kali ini saya akan membagikan kepada teman-teman cara membuat Baca Juga Otomatis di Dalam Postingan dengan mudah dan cepat.
Cara Membuat Baca Juga Otomatis di Dalam Postingan
Cara Membuat Baca Juga Otomatis di Dalam Postingan

Menggunakan fitur "Baca Juga" otomatis pada situs web Anda dapat menjadi salah satu cara terbaik untuk memperkayakan pengalaman pengunjung dan meningkatkan nilai situs web Anda. Fitur ini membantu menambahkan relevansi dan interaksi pada konten yang tersedia, sehingga mempermudah navigasi dan meningkatkan waktu pengunjung di situs web Anda. Selain itu, fitur ini juga membantu meningkatkan optimasi mesin pencari dan membangun reputasi situs web Anda. 

Manfaat Menggunakan Fitur Baca Juga

Menggunakan fitur "Baca Juga" otomatis memiliki beberapa manfaat, di antaranya:

  • Menambahkan Nilai : Fitur ini membantu meningkatkan nilai dan pengalaman pengunjung pada situs web Anda. Mereka dapat dengan mudah menemukan konten yang relevan dan terkait dengan apa yang sedang mereka baca, sehingga membuat mereka betah berlama-lama di situs Anda. 
  • Meningkatkan Trafik : Dengan membuat fitur "Baca Juga" otomatis, Anda dapat memperpanjang waktu pengunjung di situs web Anda dan membuat mereka terus menjelajahi konten yang tersedia. Ini dapat meningkatkan tingkat pengunjung dan mengarahkan mereka pada halaman lain dalam situs web Anda. 
  • Meningkatkan SEO : Fitur ini dapat membantu meningkatkan optimasi mesin pencari (SEO) situs web Anda. Algoritma mesin pencari menilai konten situs web dengan cara menilai relevansi dan interaksi pengunjung. Dengan fitur "Baca Juga" otomatis, pengunjung akan terus berinteraksi dengan konten Anda, yang akan meningkatkan nilai SEO situs web Anda. Mempermudah 
  • Navigasi : Fitur ini mempermudah navigasi pengunjung dalam menemukan konten yang relevan dan menarik. Mereka dapat dengan mudah membuka halaman lain tanpa harus kembali ke halaman utama atau melakukan pencarian manual. Dengan menggunakan fitur "Baca Juga" otomatis, Anda dapat memaksimalkan potensi situs web Anda dan meningkatkan pengalaman pengunjung. Ini akan membantu Anda membangun reputasi dan memperkuat hubungan dengan pengunjung situs web Anda.

Membuat Baca Juga Otomatis di Dalam Postingan

Sekarang ini sudah banyak penyedia jasa template yang menaruh fitur ini di dalam templatenya jadi kita tak harus memasukan sendiri kode ini, namun buat kalian yang geratisan dan suka custom atau utak atik template blog mengkobinasikannya tentu akan lebih menarik. Berikut adalah langkah langkah membuatnya : 

Silakan buka halaman dasbor BLOGGER > PILIH THEMA > EDIT HTML , dan Pastekan kode CSS dibawah ini tepat sebelum </style> atau ]]></b:skin>
.post-terkait {position:relative;background:#fff;padding:0;margin:10px 15px 0 0;float:left;width:165px;border:1px solid #1b71bc}
.post-terkait h4{background:#1b71bc !important;padding:5px 0 !important;margin:0;text-align:center !important;font-size:15px !important;font-weight:400;text-transform:uppercase;color:#fff !important}
.post-terkait ul {margin:0;padding:0}
.post-terkait 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}
.post-terkait ul li:last-child{border:none !important}
.post-terkait a {color:#1b71bc;font-size:13px !important}
.post-terkait a:hover {text-decoration:underline}

Setelah itu kita berpindah ke bagian HTML template teman-teman, silakan cari kode <data:post.body> , lalu ganti kode tersebut dengan kode dibawah ini.
<div expr:id='&quot;post1&quot; + data:post.id'/>
<div class='post-terkait'> <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' class='artbody' itemprop='articleBody description'><data:post.body/>
</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/3);
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>

Kemudian lanjut pasang kode dibawah ini tepat sebelum </head> atau juga bisa dipasang sebelum </body> 
<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>
</b:if>

Oke langkah Terahir adalah Save Template Teman-Teman dan cek hasilnya. Semogga Berhasil.