Cara membuat related post dengan efek ceklis

Selamat pagi, pada pagi ini saya akan mempostingan sebuah tutorial blog  Cara membuat related post dengan efek ceklis (tentunya) yang sangat berguna bagi sobat blogger ,tanpa perlu basa - basi langsung aja deh sob, ikutin langkah dibawah ini;

Langkah - langkah Membuat Related Post dengan efek Ceklis :

1. Buka Dasbor >> Template >> Edit HTML >> Lanjutkan >> Beri centang pada Expand Template Widget.
2. Cari kode ]]></b:skin> atau bisa juga </style> dan letakan kode berikut di atasnya :
   

   .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://lh6.googleusercontent.com/-4d5WhtoEhnQ/TszzCXAYfnI/AAAAAAAABq8/wauqCWb3uOE/s12/uncheck.gif);
       padding:.5em 0 .5em .3em
       }
   

3. Lalu cari kode : <data:post.body/>  bagi  sobat yang sudah memasang read more akan ada dua kode nah ambil kode yang  pertama  lalu sobat copy kode berikut ini  di bawah kode <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>
   
4. Simpan Template Sobat.

Catatan :

• 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'>