Nggak mau ketinggalan artikel baru Blogger-Holic? Subscribe Sekarang
Hot Categories: Blogger News | Hack | SEO | Tips | Tutorial | more

Bikin Artikel Terkait di Blogger

16.3.08 | 5 comments

Berikut ini adalah tutorial ngebuat Related Article/Artikel Terkait dalam Blogger.

Awalnya widget ini dibuat oleh Hoctro, namun widget buatannya itu memakai 2 blog widget sehingga sekarang tidak bisa dipergunakan lagi pada Blogger. Dan untungnya, Jackbook telah memodifikasi widget buatan Hoctro tersebut sehingga widget ini masih dapat dipakai pada Blogger.

Widget ini merupakan daftar artikel terkait berdasarkan label yg sama dengan artikel tersebut. Jadi bukan berdasarkan isi yg sama.

1. ada baiknya kamu backup dulu template kamu dengan nge-Download Full Template untuk menghindari hal2 yg ngga' diinginkan terjadi.

2. Tick Expand Widget Templates.

3. cari <data:post.body/>

4. copy kode ini di bawah <data:post.body/>


<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<span class='box'>
<div class='widget-content'>
<h3>Artikel Terkait</h3>
<div id='data2007'/><br/><br/>

<script type='text/javascript'>

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

maxNumberOfPostsPerLabel = 6;
maxNumberOfLabels = 100;

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>
</span></div>

</b:if>
5. Save template

Kamu juga bisa ngatur jumlah label dan artikel yg akan muncul pada widget ini. Ubah nomor pada maxNumberOfLabels untuk mengganti jumlah label yg muncul.

Ubah nomor pada maxNumberOfPostsPerLabel untuk mengganti jumlah label yg muncul. Perlu diketahui, kamu harus nambahin dengan 1 pada jumlah artikel yg kamu mau. Jadi kalo kamu mau yg muncul 5 artikel, maka angka yg harus kamu masukin di maxNumberOfPostsPerLabel adalah 6. Saya juga ga tahu kenapa begini.

Semoga berhasil :)

5 comments:

  1. pertamax ya???..sukses oi..tenkyu sarannya..bolehkah pinjem kodenya buat ditampilkan di blog saya???

    ReplyDelete
  2. silakan aja, bro afithk :)

    ReplyDelete
  3. Ini di yang saya cari2 ... akhirnya ketemu disini... thanks bro

    ReplyDelete
  4. Bro mau tanya nih
    bisa gak yah di artikel terkait nama labelnya gak usah muncul trus artikel yg sama gak muncul 2 kali di label berbeda.

    Soalnya jadi jelek kalo ada artikel yg ada di dua label, trus muncul dua2nya.

    hmm biar jelas maksudnya tolong liat di blogku ya

    thanks

    ReplyDelete
  5. @ Arpan: nanti saya bahas deh bro.. cara lainbuat artikel terkait yg engga dobel bgitu :)

    ReplyDelete