Kamis

Membuat Widget Recommended Post Slide Out Bergaya Wordpress

Ade Blogs - Recommended Post Slide widget atau bisa dibilang widget artikel rekomendasi ini, begitu populer di kalangan blogger luar negeri. Dan kebanyakan dipakai oleh pengguna wordpress. Widget ini cukup ringan dan tidak begitu berat. Cara membuatnya pun cukup mudah, hanya menambahkan gadget pada blog dan hanya menambahkan sedikit kode ke edit HTML template.


Oke langsung saja kita membuat widget recommended post nya.

1. Buka akun blogger > Rancangan > Tata Letak > add gadget > Html/javascript, kemudian masukkan kode berikut ini ;

<div id="bpslidein" style="display:none;"> <div class="help">?</div><div class="expand">+</div>
<div class="close">X</div> <p>Recommended for
you</p> <div id="bpslidein_image"></div> <div 
id="bpslidein_title">Loading..</div> 
<script>
if(document.location.href.split("/").length==6&&document.location.href.indexOf(".html")!=-1){if(typeof
 bp_onload_queue=='undefined')var bp_onload_queue=[];if(typeof
bp_dom_loaded=='boolean')bp_dom_loaded=false;else var
bp_dom_loaded=false;if(typeof bp_async_loader!='function'){function
bp_async_loader(src,callback,id){var
script=document.createElement('script');script.type="text/javascript";script.async=true;script.src=src;script.id=id;var
previous_script=document.getElementById(id);if(previous_script)if(previous_script.readyState=="loaded"||previous_script.readyState=="complete"){callback();return}else{script=previous_script}if(script.onload!=null)previous_callback=script.onload;script.onload=script.onreadystatechange=function(){var newcallback;if(previous_script&&previous_callback)newcallback=function(){previous_callback();callback()};else
 newcallback=callback;if(bp_dom_loaded){newcallback()}else
bp_onload_queue.push(newcallback);script.onload=null;script.onreadystatechange=null};var head=document.getElementsByTagName('head')[0];if(!previous_script)head.appendChild(script)}}if(typeof
 bp_domLoaded!='function')function
bp_domLoaded(callback){bp_dom_loaded=true;var
len=bp_onload_queue.length;for(var
i=0;i<len;i++){bp_onload_queue[i]()}}bp_domLoaded();bp_async_loader("http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js",function(){bp_async_loader("http://julak-project.googlecode.com/files/recombb2.js",function(){},"bp-out-slide")},"jQueryjs")}
 </script> <a href="http://blogbelajar2.blogspot.com/" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizkexVZvvw5XEml51xKUR-H7aSrrzFEesIYj2UQ71urVQcjf0NNDrPET0t7bNxgAhhyR5-YzVCiW92uJ9Xi6aDl0xISSC5I7yIJHPTDo-H3jqz4z6NLS5RKvpfiIUPYeTwkoxg7YaXgG4/I/bloggerplugins.png"
 alt="Artikel Rekomendasi Slide Out For Blogger" /></a></div>

2. Simpan > Simpan Setelan.

3. Kemudian masuk ke rancangan template > edit HTML > (ctrl F)  cari kode;


<div class='post-footer-line post-footer-line-1'>
          atau yang sejenis dengan itu, atau kode

<p class='post-footer-line post-footer-line-1'>
         ataupun kode

<data:post.body/>

Dari kode-kode di atas cukup pilih salah satu saja.

Kemudian masukkan kode berikut tepat dibawahnya


<b:if cond='data:blog.pageType == "item"'>
<div style='display:none' id='bpslidein_place_holder'></div>
</b:if>
 

4. Simpan template, Selesai.


Widget recommended post bergaya wordpress ini menampilkan random post atau artikel acak, tidak ada salahnya kita mencobanya untuk memperindah blog kita, oke sobat blogger, Selamat Mencoba. Thanks for Mary's Lou and Blogger pluggins for this widget.