Membuat menu Slid-Box

kucingstres

Slid-Box ini hampir sama dengan widget dengan tampilan floating, tetapi pada widget ini tampilan yang akan muncul sedikit lain yaitu akan tampil atau bergerak/tampil dari kanan kekiri ketika halaman dari blog anda diarahkan ke akhir halaman dan akan tertutup secara otomatis ketika halaman di arahkan kembali keatas. 

Sobat dapat menempatkan apa saja kedalam widget ini, Dan untuk membuat sangatlah mudah. 

cara memasang widget

Buka Layout Page Element dan Klik add gadget, kemudian pilih HTML/javaScript

Kemudian tempatkan kode berikut :

view plainprint?

1. <!--Slidbox -->   
2.      <script type="text/javascript" src="http://marewainfo.googlecode.com/files/slidboxordinary.js"></script>   
3. <div style="position:fixed; width:342px; overflow:hidden; bottom:20px;   
4. right:10px; display:none;  
5. background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYmNG-Dtjfb6s8MQ2h6acqrGv9KneuOvF7xuCW2AnUv_Vl_YMkJYJwY706bWvvRUqhJAQawXHzLEBh18wIy_GKajMU9BQ1h_1QgDn80iyjgvSH67pHm8wE-5QzyWcX12SVgj_dOQUgwW2a/s0/bo-bg-html.gif)   
6. repeat; -moz-border-radius:15px; -webkit-border-radius:15px;   
7. border-radius:15px; border:2px solid #111111;" id="fbslidebox">   
8.    
9.     <div style="width:320px; padding:10px; margin:0 auto; overflow:hidden;">   
10.    
11.         <a href="#" style="float:right; color:#999; padding:0 3px;   
12. border:1px solid #CCC; text-decoration:none; font-size:9px; font-family:Verdana, Geneva, sans-serif;" id="fbcloseslidebox">X</a>   
13.    
14.         <strong style="color:#66ad3d;">Untuk Judul Slid-Box</strong>   
15.    
16. ///Tempatkan apa saja yang sobat inginkan (gambar,script, facebook dan lain-lain//  
17.   
18.         </div></div>  
19. <!--Slidbox end -->   

SAVE TEMPLATE Dan lihat hasilnya.
Note : Anda tidak perlu memberikan judul pada elemen tersebut.

• Twitter
• Facebook
• Google
• Tumblr
• Pinterest