Melalui HTML/JavaScript :
Oke saya rasa tidak perlu panjang lebar, ayo di mulai...
Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.
Ikutilah langkah-langkah di bawah ini :
1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).
<style type='text/css'>
#bpslidein{z-index:5;width:400px;height:100px;padding:10px;background-color:#3eb5da;border-top:3px solid #00ff00;position:fixed;right:-430px;bottom:0;-moz-box-shadow:-2px 0 5px #00ff00;-webkit-box-shadow:-2px 0 5px #00ff00;box-shadow:-2px 0 5px #00ff00;font-family:Arial, Helvetica, sans-serif;}
#bpslidein p{font-size:11px;text-transform:uppercase;font-family:Arial,Helvetica,sans-serif;letter-spacing:1px;color:#555;}
#bpslidein_title{color:#555;font-weight:700;font-size:16px;margin:10px 20px 10px 0;}
#bpslidein a,#bpslidein a:hover,#bpslidein_title{text-decoration:none;color:#ff0000;}
#bpslidein .close,#bpslidein .expand,#bpslidein .help{border:2px solid #00ff00;cursor:pointer;color:#ff0000;width:13px;height:15px;padding:2px 0 0 5px;position:absolute;right:10px;font-size:17px;font-weight:700;font-family:Arial, Helvetica, sans-serif;font-size:12px;}
#bpslidein .help{right:35px;}
#bpslidein_title,#bpslidein_image{float:left;width:80px;}
#bpslidein_title{width:290px;}
</style>
<div id="bpslidein" style="display:none;"> <div class="help">?</div><div class="expand">+</div> <div class="close">X</div> <p>Direkomendasikan Untuk Kamu :</p> <div id="bpslidein_image"></div> <div id="bpslidein_title">Loading, please wait...</div> </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("https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-recommended-posts-slide-out-di-blog-bagian-1.js",function(){bp_async_loader("https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-recommended-posts-slide-out-di-blog-bagian-2.js",function(){},"bp-out-slide")},"jQueryjs")} </script> <a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-recommended-posts-slide-out-di-blog.html" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ0mB92g0TH8ZCEEJaHKm3YR5GlDqjEqP09vE2mc2mMX6YgmdP1tDrwvXbVAgkTXwOQA8e3XkI9yPKxdu9_Z_Yq-PhHOHXO4wNALLX8QNFbhGvr14eGLT7AxnwGNUM-z1SFWZkpPG1PC4/I/bloggerplugins.png" alt="Cara Membuat Recommended Posts Slide Out Di Blog" /></a>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-recommended-posts-slide-out-di-blog.html" target="_blank">Cara Membuat Recommended Posts Slide Out Di Blog</a></small>
#bpslidein{z-index:5;width:400px;height:100px;padding:10px;background-color:#3eb5da;border-top:3px solid #00ff00;position:fixed;right:-430px;bottom:0;-moz-box-shadow:-2px 0 5px #00ff00;-webkit-box-shadow:-2px 0 5px #00ff00;box-shadow:-2px 0 5px #00ff00;font-family:Arial, Helvetica, sans-serif;}
#bpslidein p{font-size:11px;text-transform:uppercase;font-family:Arial,Helvetica,sans-serif;letter-spacing:1px;color:#555;}
#bpslidein_title{color:#555;font-weight:700;font-size:16px;margin:10px 20px 10px 0;}
#bpslidein a,#bpslidein a:hover,#bpslidein_title{text-decoration:none;color:#ff0000;}
#bpslidein .close,#bpslidein .expand,#bpslidein .help{border:2px solid #00ff00;cursor:pointer;color:#ff0000;width:13px;height:15px;padding:2px 0 0 5px;position:absolute;right:10px;font-size:17px;font-weight:700;font-family:Arial, Helvetica, sans-serif;font-size:12px;}
#bpslidein .help{right:35px;}
#bpslidein_title,#bpslidein_image{float:left;width:80px;}
#bpslidein_title{width:290px;}
</style>
<div id="bpslidein" style="display:none;"> <div class="help">?</div><div class="expand">+</div> <div class="close">X</div> <p>Direkomendasikan Untuk Kamu :</p> <div id="bpslidein_image"></div> <div id="bpslidein_title">Loading, please wait...</div> </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("https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-recommended-posts-slide-out-di-blog-bagian-1.js",function(){bp_async_loader("https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-recommended-posts-slide-out-di-blog-bagian-2.js",function(){},"bp-out-slide")},"jQueryjs")} </script> <a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-recommended-posts-slide-out-di-blog.html" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ0mB92g0TH8ZCEEJaHKm3YR5GlDqjEqP09vE2mc2mMX6YgmdP1tDrwvXbVAgkTXwOQA8e3XkI9yPKxdu9_Z_Yq-PhHOHXO4wNALLX8QNFbhGvr14eGLT7AxnwGNUM-z1SFWZkpPG1PC4/I/bloggerplugins.png" alt="Cara Membuat Recommended Posts Slide Out Di Blog" /></a>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-recommended-posts-slide-out-di-blog.html" target="_blank">Cara Membuat Recommended Posts Slide Out Di Blog</a></small>
Keterangan :
- Warna purple adalah kode warna, silahkan kamu ganti dengan selera yang kamu mau.
- Agar lebih mudah menemukan kode warna yang kamu inginkan : Klik Di Sini
- Warna red adalah teks, silahkan kamu ganti dengan selera yang kamu mau.
- Warna orange adalah link kode "JavaScript" blog.
Catatan:
- Recommended Posts Slide Out ini akan muncul setelah pengunjung masuk ke sebuah "Artikel" blog kamu, dan menggulir sampai kebawah/akhir blog kamu (Footer Blog).
5. Simpan Pengaturan.
Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.
█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno
» Efek Artikel Blog
█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno
» Efek Artikel Blog
Ditulis Oleh : Tutorial Blog Eno » Di Sini Adalah Inspirasi Untuk Sobat Blogger Semua.
Saat ini kamu sedang membaca artikel tentang Cara Membuat Recommended Posts Slide Out Di Blog. silahkan kamu Copy-Paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link di bawah ini sebagai sumbernya. INGAT : saling menghargai kreatifitas sesama sobat blogger oke.
Tidak ada komentar:
Posting Komentar
███████████████ Peraturan Berkomentar Di Blog Ini :
» Berkomentarlah dengan baik dan sopan.
» Dilarang spam, SARA, pornografi, junk, dan sebagainya.
» Jangan membuat keributan/kekacauan.
» Jangan mencantumkan LIVE LINK di komentar ini.
» Kalau kamu ingin copy-paste dari blog ini ke blog kamu (harap cantumkan LINK SUMBERNYA).
» Jika kamu melanggar salah satu peraturan tersebut, maka komentar kamu akan saya hapus dari blog ini.
███████████████ Terima kasih atas pengertian, kunjungan dan pesannya.
» Pengunjung yang baik itu adalah yang meninggalkan komentar, walaupun itu hanya ucapan "Terima Kasih".