Senin, 23 Januari 2012

Cara Membuat Artikel Terkait Di Bawah Posting


By on 19.13

Cara Membuat Artikel Terkait Di Bawah Posting - Blazer Blog sekarang ini mengalamai Banyak Perubahan Pada Template Tapi tenang saja karena kali ini saya akan berbagi Tutorial Blog yaitu Cara Membuat Artikel Terkait Di Bawah Posting,tentunya dengan Memasang Artikel Terkait atau Related Post ini pengunjung akan dengan mudah melihat Artikel milik sobat yang terkait dengan Artikel lainnya.
Lihat contoh gambar di bawah ini.

Nah langsung aja cara Membuat.

1. Pilih Rancangan, Terus Klik EDIT HTML.
2. Cari Kode ]]></b:skin>
3. Letakan Kode di bawah ini tepat di atas kode nomor 2.

.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}

4. Selanjutnya cari Kode <data:post.body/>
5. Letakan Kode di bawah ini tepat di bawah kode nomor 4.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<br/>
<H2>Artikel Terkait:</H2>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:200px;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 = 10;
maxNumberOfPostsPerLabel = 10;
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>

Klik Simpan.
NB: Jika sobat menemuka 2 kode atau 3 kode <data:post.body/> pilih aja yang ke dua.

SELAMAT MENCOBA

About Syed Faizan Ali

Faizan is a 17 year old young guy who is blessed with the art of Blogging,He love to Blog day in and day out,He is a Website Designer and a Certified Graphics Designer.

8 komentar:

  1. Gan, kalau membuat 'Related Post' untuk template seluler (versi mobile) kira-kira gimana ya? Ane udah coba ngoprek template berkali-kali tapi tetap aja belum berhasil. :(

    Mohon pencerahannya. Thanks before.

    BalasHapus
  2. Maff Gan kalu Untuk Seluler kayak nya ga ada.Tapi coba cari-cari aja di google.

    BalasHapus
  3. pada template blog saya kog ga bisa gan, mohon pencerahannya gan.... sudah saya coba berulang-ulang tetap ga ada hasil..........

    BalasHapus
  4. sobat udah di centang belum Expand Widget Template nya, kalau belum ya pasti ga ada saat mencari kode Nomor 5

    BalasHapus
  5. wah mantap gan ...terima kasih banyak ya,,,,jangan lupa kunjungi juga blog saya

    BalasHapus
  6. ijin take gan..
    kunjungan baliknya gan ;;)

    BalasHapus