Blogger Related Post Sederhana Dengan Efek Check List

Pada artikel saya kali ini saya akan mencoba memberikan tutorial singkat tentang  Cara membuat Related post atau artikel terkait pada blogger,tutorial yang akan kita bahas ini adalah membuat Artikel terkait dengan efek check list,cara menambahkan artikel terkait ini pada blog sangat mudah sob,bagi yang ingin menambahkan related post ini silahkan ikuti beberapa cara dibawah ini. . ! !

cara membuat related post

• Seperti biasa,langsung saja ke edit tempelate blog anda
• Selanjutnya cari kode ]]></b:skin> pada tempelate anda
• Kalau sudah ketemu,copy CSS dibawah ini dan pastekan di atas ]]></b:skin>

.rbbox
{
 font-family:Federant;
 background:#fff;
 border:1px solid #ccc;
 height:198px;
 overflow:auto;
 margin:10px 0 15px;
 padding:10px
}
.rbbox ul li:hover
{
 cursor:pointer;
 list-style-image:url(http://4umi.com/image/icon/check.png);
 color:#3B5998
}
.rbbox ul li
{
 list-style-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMdILQ0DrXG6x_YsgTAk3Xv7Kq3VRscaOWdi_O6fRu6L7TlhRYYEgvKvnnn6f0lYIwo1JM853B-NFOWUrHvQ5lLrD3PWBKPsfnIF7RlO9IN2lk1-Qf0zGlaDkK6Vfg_ePzpQ4tGX13q5k/s12/uncheck.gif);
 padding:.5em 0 .5em .3em
}

• Kalau sudah sekarang cari kode <data:post.body/>
• Copy code dibawah ini dan pastekan dibawah <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='rbbox'>
<div>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel =999;
var maxNumberOfLabels = 999;
maxNumberOfPostsPerLabel = 999;
maxNumberOfLabels = 999;
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>

Jika Nanti Related Post diatas Tidak Muncul dibawah Posting anda, maka kode diatas sobat simpan dibawah Kode : <data:post.body/> yang 'kedua' lebih tepatnya di bawah tag </b:if>.
Atau sobat juga bisa meletakan kode kode di atas di bawah kode <div class='post-footer-line post-footer-line-1'>

Simpan hasil edit tempelate anda,dan lihat hasilnya. . :)