Membuat related post tau posting terkait di blog

posting Terkait  dan artikel yang berkaitan adalah cara untuk menunjukkan link dari artikel yang berhubungan dengan artikel utama dan biasanya terletak di bawah artikel utama.

Posting terkait instalasi biasanya dikelompokkan berdasarkan label atau kategori. Jadi jika ada satu artikel dari label tertentu ditampilkan maka sisa dari artikel yang memiliki label yang sama juga akan ditampilkan di bagian bawah artikel.

Tujuan membuat related post untuk memudahkan bagi pengunjung untuk menemukan artikel yang berhubungan dengan artikel utama. Jadi pengunjung tidak perlu melaporkan menemukan satu demi satu artikel pada label atau kategori menu.

Bagi mereka masih bingung, lihat contoh di bawah ini.

Bagaimana uda jelas? Nah bagi mereka yang tertarik untuk memasang posting terkait di blog Anda, ikuti langkah-langkah di bawah ini:

1. Login ke Blogger. Pilih Desain menu -> Edit HTML

2. Back-up pertama template anda dengan mengklik Download Template Lengkap.

3. Setelah itu, centang kotak "Expand Widget Template".

4. Cari kode
<data:post.body/>
5. Jika sudah ketemu, letakkan kode dibawah ini dibawah
<data:post.body/>


<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>

<div class='widget-content'>
<h3>Artikel yang berkaitan</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>

var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;


function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;

for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;

if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;data2007&#39;).appendChild(div1);
}
}
}
function search10(query, label) {

var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}

var labelArray = new Array();
var numLabel = 0;

<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;

var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>

</div>
</b:if>
Catatan:

Jika blog Anda menggunakan kode read more biasanya ada 2 kode <data:post.body/> Letakkan kode di atas di kode pertama.

6. Jika sudah, klik Save Template lalu klik View Blog untuk melihat hasilnya.

Anda dapat mengganti teks "artikel terkait" dalam kode di atas dengan teks lain sesuai keinginan Anda.

12 comments:

  1. Tips yang berguna Sob untuk memudahkan pembaca mengunjungi halaman lainnya...Nice post and happy blogging!

    BalasHapus
  2. ane ad 3 mas..yg mana ne..udh ane coba2 gag bisa2 juga...

    BalasHapus
  3. tipsnya sangat membantu untuk diterapkan, salam kenal and visit me

    BalasHapus
  4. terima kasih bang Rahmat

    BalasHapus
  5. Gak berhasil bos.... Tipsnya keliru mungkin, Buktinya BLOG agan gak ada Post Related nya.... wuaaaaaaahhhhahahah

    BalasHapus
  6. berhasil sih tapi gak ada gambar sampulnya bos -_________-

    BalasHapus
  7. gan,kalau jumlah postinganna mau saya batasi misalnya hanya 5 postingan itu gmana?


    salam rumahkomputer

    BalasHapus
  8. Maaf numpang pengalaman:

    Seperti yang kucoba,bila ada data:post.body 3,maka letakan di yang ke 2,anatara dan (disini)

    BalasHapus
  9. Antara </data:post.body> dan (disini) &lt:/bif>

    BalasHapus
  10. Thanks atas tipsnya broo..mau di coba..Newbie nih..
    Ditunggu kunjungan balik http://reformasibaru.blogspot.com

    BalasHapus

berikan komentar anda disini...
Terimakasih atas komentar anda...