Cara Membuat Widget Artikel Terkait di Blogspot

1 min read

Keberadaan widget artikel terkait atau related post amat berguna untuk meningkatkan page view blog. Jika Anda pengguna WordPress self hosting, banyak plugin artikel terkait yang dapat Anda gunakan secara gratis. Sementara itu, bagi Anda pengguna platform Blogger atau Blogspot Anda dapat memasangnya sendiri seperti petunjuk dibawah ini.

hosting murah unlimited

Masuk ke Dashboard Blogger

Pilih menu Template > Edit HTML

Pada jendela template editor, carilah kode </head>. Untuk mempercepat pencarian kode tersebut, silakan tekan Ctrl+F.

Jika kode </head> sudah Anda temukan, copy kode dibawah ini dan letakkan diatas kode </head>

Kode #1

<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>

Selanjutnya, cari kode <data:post.body/>. Apabila kode tersebut sudah ditemukan, silakan copy kode dibawah ini kemudian paste dibawah kode <data:post.body/>

Kode #2

<b:if cond=’data:post.labels’>
<b:loop values=’data:post.labels’ var=’label’>
<b:if cond=’data:blog.pageType == “item”‘>
<script expr:src='”/feeds/posts/default/-/” + data:label.name + “?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5″‘ type=’text/javascript’/>
</b:if>
</b:loop>
</b:if>
<b:if cond=’data:blog.pageType == “item”‘>
<h4>Artikel Terkait</h4>
<script type=”text/javascript”>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</b:if>

Simpan pengaturan template, dan silakan cek hasilnya.

cara membuat widget artikel terkait tanpa gambar
Screenshot widget artikel terkait

 

Catatan:

Bergantung pada template yang Anda gunakan, Anda akan menjumpai lebih dari satu kode <data:post.body/>. Pilihlah kode <data:post.body/> momor 2 dari bawah, dan jika widget artikel terkait belum muncul, maka silakan letakkan ulang kode #2 dibawah kode <data:post.body/> yang lain.

hosting murah gratis domain
  Menampilkan Halaman Khusus di Halaman Depan WordPress

Cara Membuat Widget Sticky di Sidebar

Widget sticky adalah widget yang tetap akan muncul meskipun laman blog di scroll ke bagian bawah oleh pengunjung. Widget sticky biasanya digunakan blogger untuk...
bl
1 min read

Cara Backup Blog WordPress

Untuk menghindari kerugian yang disebabkan oleh hal-hal yang tak terduga, ada baiknya Anda melakukan backup blog secara terjadwal. WordPress merupakan CMS opern source yang...
bl
1 min read

Cara Mengembalikan WordPress ke Versi Sebelumnya

Postingan ini akan menjelaskan kepada Anda cara downgrade WordPress jika terjadi permasalahan tertentu setelah selesai melakukan update. Update versi WordPress diperlukan untuk meningkatkan aspek...
bl
33 sec read

3 Replies to “Cara Membuat Widget Artikel Terkait di Blogspot”

Leave a Reply

Your email address will not be published. Required fields are marked *