Senin, Juni 08, 2009

Membuat related post

Biasanya di bagian bawah sebuah postingan terdapat tampilan Artikel terkait (Related Post), hal ini berguna untuk memudahkan pengunjung melihat artikel lain yang berhubungan dengan artikel (postingan yang aktif). Dengan adanya related post bisa meningkatkan pagehit pada blog anda.

Ada kelemahan dari link yang terdapat pada relted post, yaitu klik yang ada merupakan klik dinamis, sehingga crawl (script google) tidak menghitung klik yang terjadi pada link tersebut. Berbeda dengan link statis, setiap klik pada link statis diperhitungkan oleh google dalam menentukan pagerank sebuah halaman web.


Tampilan related post bisa anda lihat di bawah ini, kode ini saya copy dari blognya O-OM
(Di blog O-OM sangat banyak materi tentang blog dan SEO yang dapat anda pelajari).


Prosedur membuat related post:
1.Login ke Dasboard
2.Pilih Layout -> Edit HTML
3.Centang kotak Expand Widget Template


4.Kemudian cari kode ini <data:post.body/>
Letakkan script berikut ini di bawah kode <data:post.body/>



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


<div class='widget-content'>
<h3>Related Posts by Categories</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>

Kata : Related Posts by Categories bisa anda ubah menjadi kata atau teks sesuai selera anda, misalnya : Artikel Terkait

5. Jangan lupa simpan template.





Artikel Terkait :



10 komentar:

Dana Telecom mengatakan...

MaxNumberofPostPerlabel dan maxNumberofLabels menunjukkan apa ya?

kwangkxz mengatakan...

terimakasih sobat, saya sudah terapkan di blog.

gandhi mengatakan...

makasih banyak infonya, saya mau buat artikel terkait malah nyasar di bawah kotak komentar, semoga dgn cr yg ini bisa membantu, thx

Artikel Komputerku mengatakan...

@gandhi
salam kenal
@kwangkxz
salam kenal
@Dana Telecom
mengenai pentanyaan anda tentang:
MaxNumberofPostPerlabel dan maxNumberofLabels
Mungkin MaxNumberofPostPerlabel merujuk ke banyaknya jumlah postingan per tag (label)
Sedangkan maxNumberofLabels adalah banyaknya tag yang akan ditampilkan (ini hanya berfungsi jika suatu postingan mempunyai tag lebih dari satu.
Bisa anda lihat contohnya di postingan saya yg tagnya lebih dari satu:
Z TECH V 5 Mesin Absen Terbaik dan ekonomis
Saat anda membukanya ada dua "tag" yaitu:
1. Produk Komputer dan Accessories
2. Z TECH V 5 Mesin Absen Terbaik dan ekonomis
Pada masing-masing tag tersebut akan muncul link postingan.
jawaban saya bisa benar bisa juga salah, karena saya hanya pemula yang mencoba belajar tentang script html dan javascript

chyardi mengatakan...

Salam kenal sebelumnya mas, yang ingin saya tanyakan adalah apabila post kita memiliki 2 label, jika kita gunakan script di atas tentu kedua label tersebut akan muncul dong masing2 post terkaitnya.., nah kalau saya ingin menentukan salah satu label saja yang ada related post-nya kira2 scriptnya gimana ya ?, thanks sebelumnya mas.

Artikel Komputerku mengatakan...

Coba pada maxNumberOfLabelsdiubah angka 10 dan 3 menjadi 1:
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;

Anonim mengatakan...

Jadi setiap postingan, tag-nya harus diisi ya?

kejora mengatakan...

terima kasih banyak atas panduannya....

Hendri Prastio Kurniawan mengatakan...

kalo di html template ane gak ada data post body gimana gan?
silahkan cek template ane sekedarwawasan.blogspot.com

mohon bimbingannya , makasih

Srie mengatakan...

Apa kbr? dua tahun lalu sy gunakan script artikel terkait dari sini, dan berhasil. Sayangnya, 4 hari lalu, link artikel di bwh posting tiba2 hilang.
lalu saya coba ulangi, dg pasang script yg sama.

Ternyata kode tdk ada di blog saya.

Kira2 apa yg terjadi ya? Mohon sarannya. Trims