Soal Materi Sekolah Membuat Widget Recommended post slide

Cara  Membuat Widget Recommended post slide seperti wordpress di blogger kita

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.

Untuk melihat live demonya sobat bisa melihatnya di blog ini atau jika belum muncul bisa membuka disini.

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> <br /><div class="close"> X</div> <p> Recommended for<br /><br />you</p> <div id="bpslidein_image"> </div> <div id="bpslidein_title"> Loading..</div> <br /><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/AVvXsEhw6_mCSWX_NnOc3IgldDceqKKBPS5-bdah7aGyY57SZ38_s_NTOW61nBkTbzgWI7b0vc971o_h-HOERFmFYasLfUJhyphenhyphen188I9w4PlhwwZKV-jeFSW6rZfCowzSXQCjxPptm9VJ-LqZORYA/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;

          atau yang sejenis dengan itu, atau kode

         ataupun kode

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 terkait, tidak ada salahnya kita mencobanya untuk memperindah blog kita, oke sobat blogger, Selamat Mencoba.