Tutorial menampilkan Artikel Terkait Pada Blogspot

Bismillahirrohmanirrrokhim ..

kali ini saya, akan memberikan 1 lagi tutorial tentang "Membuat Artikel Terkait Pada Blogger", yg berfungsi untuk menampilkan artikel" sobat yg terdahulu di setiap sobat memposting artikel baru. hal ini sangat penting di lakukan untuk memberikan layanan pada pengunjung setia Blog kita, yaitu untuk mempermudah pencarian artikel" yg mereka butuhkan .. di samping semua itu pemasangan kotak artikel terkait ini akan membuat blog sobat terlihat semakin elegant .. :)

Lihat Tutornya :

1. Login Blogger sobat ==> Dasbor ==> Template ==> Edit HTML ==> Lanjutkan dan centang kotakan kecil di atasnya ..
2. Cari Code <div class='post-footer-line post-footer-line-1'> [untuk memudahkan sobat dalam pencarian ,tekan F3 pada keyboard sobat]
3. bila sudah di temukan .. letakkan Code di bawah ini , tepat di bawah code <div class='post-footer-line post-footer-line-1'> ...

Untuk melihat file Click Spoiler

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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 = 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;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>

cat : code yg saya tandai dengan warna merah, silakan di ganti menurut selera sobat ..

4. Pratinjau .. untuk melihat apakah ada code yg Error , bila tidak ada Error .. silakan  Click "Simpan Template" , dan lihat hasilnya di potingan paling bawah sobat .. :)

Kelambit Blogspot akhiri postingan "Tutorial Membuat Artikel Terkait Pada Blogger" sampai di sini. semoga artikel ini memberikan manfaat untuk Kita semua ...

dan Semoga Rahmat serta Hidayah-Nya selalu tercurah untuk kita semua .. amin ..





<a href="http://nicroganteng.blogspot.com/2012/11/tutorial-menampilkan-artikel-terkait-pada-blogspot.html">Tutorial menampilkan Artikel Terkait Pada Blogspot</a>