Marhaban Yaa Ramadhan!

Kali ini saya akan memberikan tutorial bagaimana cara membuat Artikel Yang Berhubungan atau sering disebut dengan RElated Post atau kalau kalian masih bingung coba kalian lihat contohnya ini :

Ok langsung saja kita mulai tutorialnya :

1. Sign in Blogger

2. Layout

3. Edit HTML


4. Jangan lupa berikan tanda centang pada Expand Widget Templates

5. Copy kode ini :


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


6. Paste kode diatas tepat di bawah kode ini <data:post.body/>

Kalau kalian pakai Readmore taruh kode diatas tepat di bawah kode yang pertama bukan yang kedua.

7. Save dan lihat hasilnya

Jika kalian ingin mengganti namanya tinggal klik layout kemudian edit HTML lalu cari tulisan ini "Related Posts by Categories" kemudian ganti dengan sesuai keinginan kalian.

Artikel Yang Berhubungan :



6 comments

  1. Story Marker // July 6, 2008 at 8:09 AM  

    say mau mencoba yang ini,,:)

  2. Anonymous // July 11, 2008 at 9:15 AM  

    Baguz nieeh...Kucoba ah. :D

  3. a // May 28, 2009 at 12:37 AM  

    :))

  4. widodo dc // May 28, 2009 at 6:59 PM  

    thanks

  5. Anonymous // December 2, 2010 at 6:50 AM  

    dicoba gan

  6. Unknown // February 12, 2012 at 9:14 AM  

    artikelnya oke bngt Mas Muhammad sangat mendidik....
    terima kasih atas infonya....

Post a Comment

Tutorial Design Grafis