Beranda > blogger, Informasi, tips internet, tutorial > Cara Menyembunyikan Buku Tamu Rolling Widget pada blog

Cara Menyembunyikan Buku Tamu Rolling Widget pada blog

Sebelumnya saya telah tulis Cara Memberi gambar background untuk shoutmix, nah,sekarang ada cara yang lain lagi yang tak kalah bagusnya,yakni dengan cara menyembunyikan buku tamu dengan rolling widget. Langsung saja ya,

Jika kamu mengklik link guest book pada navbar maka akan muncul buku tamunya,dan untuk menutupnya lagi silahkan klik lagi link guest book tersebut lagi,Nah,Bagaimana cara membuatnya? gampang aja kok, karena sebenarnya widget ini bukanlah widget baru melainkan rolling widget yang script-nya sedikit saya modifikasi.

Untuk membuat rolling widget supaya bersembunyi, berikut adalah langkah-langkahnya:

1. Login ke blogspot kamu
2. Klik Rancangan
3. Klik Edit HTML
4. Centang kotak kecil html dan download html kamu untuk backup
5. Copy kode dibah ini dan letakkan tepat dibawah kode </head>

<!– Mulai Rolling Widget –>
&lt;style type=&quot;text/css&quot;&gt;
#gb{
position:fixed;
top:10px; /*jarak dari atas*/
right:0px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:none;
}
.gbcontent{
float:left;
border:2px solid #888888; /*warna bingkai*/
background:#F0F0F0; /*warna latar*/
padding:5px 10px 0px 10px;
}
&lt;/style&gt;

<script type=”text/javascript”>
function showHideGB(){
var gb = document.getElementById(&quot;gb&quot;);
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById(&quot;gb&quot;);
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + &quot;px&quot;;
if(x0!=xf){setTimeout(“moveGB(“+x+”, “+xf+”)”, 10);}
}
&lt;/script&gt;

&lt;div id=&quot;gb&quot;&gt;
<div class=”gbtab” onclick=”showHideGB()”></div>
&lt;div class=&quot;gbcontent&quot;&gt;
<div style=”text-align:center;”><a href=”javascript:showHideGB()” title=”Close/Tutup”>Guestbook

Kode Shoutbox atau Buku Tamu

&lt;script type=&quot;text/javascript&quot; src=&quot;http://infonetmu.googlecode.com/files/rollingwidget.js&quot;&gt;&lt;/script&gt;
&lt;/div&gt;&lt;/div&gt;
<!– Selesai Rolling Widget –>

6. Save template kamu

7. Setelah itu buatlah sebuah link untuk menampilkan rolling widget, seperti berikut :

<a href=”javascript:showHideGB()”>Buku Tamu&lt;/a&gt;

8. Kamu dapat menempatkan link ini pada navbar menu, sidebar, atau di tempat lain. Kamu juga dapat mengganti Buku Tamu dengan Guest Book, Chat Room, ShoutBox, atau Juga dengan gambar.

 

Iklan
  1. 7 Agustus 2012 pukul 08:25

    min . . .
    Gimana caranya nmbahkn bingkai backgraund di xtgem . . .

  2. 1 Juni 2012 pukul 12:53

    Sementara bagi pemain yang menang dan kalah, akan ber musyawarah untuk kepresisian dalam reposisi sosial mereka.

  1. No trackbacks yet.

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

%d blogger menyukai ini: