Breaking News
Loading...
Monday, August 5, 2013

Memasang Widget Tersembunyi Di Kanan Blog

Halo Bloggers , saya mau share cara pasang Widget ChatBox Tersembunyi Di kanan Blog , Caranya gampang banget sob , ikuti aja oke ?

1. Masuk Ke tata letak
2. Klik Tambah Widget
3. Pilih HTML / Java Script
4. Masukin Kode HTML berikut ini sob

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:300px;
width:50px;
float:left;
cursor:pointer;
background:url('http://4.bp.blogspot.com/-bj4eeCVV6hM/Tk9GSbUTreI/AAAAAAAAAKA/ZCtLxHeV5uY/s1600/Bukutamu6.gif') no-repeat;}.gbcontent{ float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
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("gb");
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() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()">
 </div>
<div class="gbcontent">

Masukan Kode Chatbox agan kesini

<div style="text-align: center;">
<span style="font-size: 10px;"><span style="font-family: "Trebuchet MS",sans-serif;">Mau Widget Ini? <a href="http://tempatkumpulblogger.blogspot.com/2013/08/memasang-widget-tersembunyi-di-kanan.html" target="_blank">Klik Disini</a></span></span></div>
<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div>
5. Atur ukuran dan posisi pada kode berwarna biru.
6. Ganti tulisan warna Pink dengan kode html chat box sobat.
7. Ganti URL gambar pada kode warna ungu dengan gambar yang sobat inginkan.
8. Atur warna background dan warna border pada kode warna hijau.

URL Gambar lainnya sob :

Tombol Chat Box       Tombol Chat Box        Tombol Chat Box         Tombol Chat Box          Tombol Chat Box          Tombol Chat Box          Tombol Chat Box

Note : Klik Gambarnya terus Copy Link yang ada di address box browser kalian , lalu Paste ke kode warna ungu

Note : Tunjukan jika anda punya balas budi dengan tidak mengganti link blog ini dengan link blog anda

Maka jadinya akan seperti ini



Sekian sob semoga bermanfaat

0 comments:

Post a Comment

 
Toggle Footer