20 October 2009

Membuat Related Post ( Postingan terkait)

Related Post atau postingan terkait sangat membantu kita atau para pembaca blog kita untuk melihat artikel lama yang berkaitan dengan artiket yang kita buat saat ini. jadi related post ini akan di tampilkan berdasarkan kategoti dari artikel atau postingan yang kita buat. Nah, untuk yang satu ini bloger tidak menyediakan fasilitas nya, maka kita bisa saja menambahkan nya pada blog kita dengan sedikit menanam kode html ke dalam template kita. Related Post akan di tampilkan di bawah postingan kita, berikut contoh screan shoot nya :




Nah, begini cara bikinnya :

1. Pastikan anda berada di dasbor blogger
2. Pilih Tata letak » Edit HTML
3. Centeng Expand Template Widget
4. Cari kode berikut : <data:post.body/>
5. Nah, kalau sudah ketemu letakkan kode berikut di bawah kode tadi

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

<div class='widget-content'>
<h3>Related Post</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. Lalu simpan.

Sedikit tambahan :
oh iya perhatikan pada langkah ke-4 , setelah kamu menemukan kode nya letakkan script pada yang tertera pada langkah ke-5 di bawah kode pertama dari kode "
<data:post.body/> " atau " <p><data:post.body/></p> " terkadang kode tersebut agak berbeda sedikit dikarnakan perbedaan template. Biasanya kode tersebut ada dua jika kita telah memasang fasilitas "read more" pada template blog. kalau ternyata kita jumpai hanya 1 kode , kita bisa langsung memasang script tadi tepat di bawah kode tadi.



NB : " Ingat !! "

Kita juga dapat mengganti kata Related Post dengan kata Artikel terkait dengan mengubah tanda berwarna merah pada script di atas.

" Selamat Mencoba"

Read more...

  © Blogger templates Newspaper III by Ourblogtemplates.com 2008

Back to TOP