Browse: Home / / Cara Menampilkan Artikel Terkait

Cara Menampilkan Artikel Terkait

Posted by Unknown Senin, 27 Mei 2013 1 komentar
Apakabar teman-teman semoga kita semua dalam keadaan baik baik saja kali ini saya akan berbagi tentang cara membuat artikel terkait pada bolg sebelumnya pada postingan kemarin kita membahas tentang cara membuat fans page pada blog lang sung saja ya .........................................................................................

LANGKAH - LANGKAHNYA:
1. Masuk ke Blog anda
2. Klik Template ---> Klik Edit Template
3. Cari Kode  <data:post.body/> Kode tersebut ada 2 gunakan yang ke 2
4. Copy pastekan kode di bawah ini setelah kode <data:post.body/> 


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p style='font-style:bold;'>ARTIKEL TERKAIT:</p>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:150px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 15;
maxNumberOfPostsPerLabel = 50;
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;albri&#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>
<script type='text/javascript'>RelPost();</script>
</div>
</b:if>

5. Setelah itu Cari kode ]]></b:skin>
6. Copy pastekan kode berikut ini di atas kode ]]></b:skin> 

.rbbox{border: 1px solid #000000;padding: 5px;
background-color: #F2F2F2;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #EFFBEF;}
.rbbox ul li {
display : block;
background : url(http://i1237.photobucket.com/albums/ff469/indolaron/icon/007.png) no-repeat 0px 0;
margin-left : -10px;padding-top : 0;padding-right : 0px;padding-bottom : 1px;padding-left : 20px;margin-bottom : 5px; line-height : 1em; border-bottom:1px dotted #cccccc;}


Keterangan :

maxNumberOfPostsPerLabel = 50; adalah jumlah posting atau artikel terkait yang ingin di tampilkan maxNumberOfLabels = 3; adalah jumlah label terkait yang ingin ditampilkan
background-color: #F2F2F2; adalah warna background kotak related posts
background-color: #EFFBEF; adalah warna background waktu disorot kursor(bisa diganti sesuai keinginan)
Anda juga dapat merubah background gambar dengan memasukkan link url pada kode berwarna hijau diatas.

SEKIAN DARI SAYA SEMOGA TIPS - TIPS Cara Menampilkan Artikel Terkait TERSEBUT BERMANFAAT  : )
TERIMA KASIH ATAS KUNJUNGAN SAUDARA
Judul: Cara Menampilkan Artikel Terkait
Ditulis oleh Unknown
Rating Blog 10 dari 9990 suara
Semoga artikel ini bermanfaat bagi saudara. Jika ingin mengutip, baik itu sebagian atau keseluruhan dari isi artikel ini harap menyertakan link dofollow ke http://mustofaagustriutomo.blogspot.com/2013/05/cara-menampilkan-artikel-terkait.html. Terima kasih sudah singgah membaca artikel ini.
Comments
1 Comments

1 komentar:

mengatakan...

nice Posting Bro , cuma di Visual sudah ane pasang beberapa bulan yang lalu , sekarang menghilang secara misterius related post nya

Posting Komentar

Silahkan Comment, sesuka anda
jangan lupa follow blog ini, cantumkan link anda di sini
pasti saya folback 100%