Membuat Link Terkait di Blogspot

Kali ini saya akan menulis trik ato tutorial untuk membuat related post di blogspot. Apa sih related post itu? Related post atau related link adalah daftar link-link atau daftar judul-judul artikel yang berkaitan atau ada hubungannya dengan artikel yang sedang ditampilkan. Berkaitan dalam artian sama kategorinya(kalo di blogspot labelnya). Kegunaan related post apa? Jawabannya untuk meningkatkan page view, dengan begini pembaca seolah-olah di-suggest/ditawari untuk membaca artikel yang berkaitan dengan artikel yang barusan dibaca.
Gimana caranya Ini dia:

1. Masuk ke mode edite template HTML.
2. “Tik” Expand widget template.
3. Cari tag html penutup head(didahului simbol slash(“/”)), seperti dibawah ini:
Untuk memudahkan tekan CTRL+F

{   </head>    }

4. Letakkan kode dibawah ini tepat diatas kode diatas(penutup tag head):

,,,,,{  <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>    …..}

5. Kemudian cari lagi kode seperti dibawah ini:

{{{{   <b:if cond=’data:post.labels’>
<data:postLabelsLabel/>
<b:loop values=’data:post.labels’ var=’label’>
<a expr:href=’data:label.url’ rel=’tag’> <data:label.name/> </a> <b:if cond=’data:label.isLast != “true”‘>,</b:if>
</b:loop>
</b:if>  }}}

6. Masukkan kode merah dibawah ini ke dalam kode diatas, sehingga hasilnya seperti:

{{{{{   <b:if cond=’data:post.labels’>
<data:postLabelsLabel/>
<b:loop values=’data:post.labels’ var=’label’>
<a expr:href=’data:label.url’ rel=’tag’><data:label.name/></a><b:if cond=’data:label.isLast != “true”‘>,</b:if>
<b:if cond=’data:blog.pageType == “item”‘>
<script expr:src='”/feeds/posts/default/-/” + data:label.name + “?alt=json-in-script&callback=related_results_labels&max-results=10″‘ type=’text/javascript’/>
</b:if>
</b:loop>
</b:if>  }}}

7. Kalo sudah, simpan perubahan templatenya…sudah ada tulisan “saved”?? Kalo sudah juga..laanjooottt…:p
8. Sekarang masuk ke mode page element, kita akan menambahkan element baru untuk dipajang diblog.
9. Tambahkan element HTML/Javascript.
10. Kasih judul dan ingat-ingat judulnya(…jangan dilupakan!! ingak..ingak….:p), misal saya masukkan judul “Related Post Ala Blognya Orang Desa”
11. Setelah itu masukkan kode dibawah ke dalam element tersebut diatas:

{{{   <script type=”text/javascript”>
removeRelatedDuplicates();
printRelatedLabels();
</script>   }}}

12. Simpan….
13. Nah, kalo cuma gini aja nanti related post kesayangan kita ini akan ditampilkan di halaman home page blog. Sangat tidak kita inginkan bukan? Oleh sebab itu tarik scrol kebawah…dan lanjutkan….
14. Masuk lagi ke mode edit template HTML, jangan lupa “tik” expand widget template.
15. Sekarang cari judul element yang sudah kita buat tadi. (masih ingat kan judulnya??), misalnya judul saya tadi “Related Post Ala Blognya Orang Desa ”
16. Jika sudah ketemu, masukkan kode berwarna merah dibawah ini kedalam rangkaian kode dengan teks seperti pada judul element tadi

{{{    <b:widget id=’HTML13′ locked=’false’ title=’Related Post Ala Blognya Orang Desa ‘ type=’HTML’>
<b:includable id=’main’>

<b:if cond=’data:blog.pageType == “item”‘>

<!– only display title if it’s non-empty –>
<b:if cond=’data:title != “”‘>
<h2 class=’title’><data:title/></h2>
</b:if>
<div class=’widget-content’>
<data:content/>
</div>
<b:include name=’quickedit’/>

</b:if>

</b:includable>
</b:widget>  }}}}

17. Jika sudah selesai, simpan perubahannya..

Selamat mencoba,,,,,,

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

%d blogger menyukai ini: