Posted by : Ed
Sabtu, 07 September 2013
Selamat Malam semuanya..
Di postingan kali ini saya akan berbagi cara membuat buku tamu melayang di kanan blog..Ikuti langkah-langkahnya :
1. Langkah Pertama pergi ke Cbox
2. Lalu masuk akun Cbox atau jika belum punya daftar ke Sign Up Cbox
3. Jika Sudah mendaftar Cbox lalu pemirsa disuruh masuk Cbox
Setelah sudah masuk edit Cbox anda sendiri caranya lihat gambar :
Klik Publish
Copy semua kode yang ada dalam clipboard
dan Langkah berikutnya Copy-Paste HTML dibawah ini
<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj_UDpPE2GCwy_cx76U3a3LpWBvvo0ng5eA37FPkS_-r1Aw0IW105e5ynAtnXY9ywe8tx8sQRL8bPjJXyjfiaPqXzjmRHmVK7skV5dg_rK4e9vSHOVwG6fkCI1QC98xheZNEk4CCi-CEo/s1600/bukutamu.png') 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">
Silakan Pasang Kode Buku Tamu yang sudah di copy tadi Di Sini
<div style="text-align:right">
<a href="http://kiddie-cluster.blogspot.com/2013/09/cara-membuat-buku-tamu-melayang_7.html">[get this widget]</a>><a href="javascript:showHideGB()">
[Tutup]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj_UDpPE2GCwy_cx76U3a3LpWBvvo0ng5eA37FPkS_-r1Aw0IW105e5ynAtnXY9ywe8tx8sQRL8bPjJXyjfiaPqXzjmRHmVK7skV5dg_rK4e9vSHOVwG6fkCI1QC98xheZNEk4CCi-CEo/s1600/bukutamu.png') 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">
Silakan Pasang Kode Buku Tamu yang sudah di copy tadi Di Sini
<div style="text-align:right">
<a href="http://kiddie-cluster.blogspot.com/2013/09/cara-membuat-buku-tamu-melayang_7.html">[get this widget]</a>><a href="javascript:showHideGB()">
[Tutup]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>
Cara menaruh html di atas :
1. Ganti tulisan yang biru dengan html/javascript Cbox/buku tamu
yang tadi
2. Masuk akun blogger
3. Ke tata letak
4. Add gadget atau Tambah gadget
5. Edit html/javascript
6. Masukan html di atas
Selesai !



blog ko keren (y)
BalasHapusMakasih gan... :i
HapusMantap.. :s
BalasHapus