Latest News

Cara Membuat Bukutamu Hover di Blog (Cbox!)

     Selesai sudah libur lebaran kali ini, berangkat kesekolah lagi tugas-tugas telah menanti, kesibukan-kesibukan kembali lagi. Sebelum itu saya coba share terlebih dahulu yaitu Cara Membuat ChatBox Hover pada Blog (atau bisa disebut juga buku tamu), yep itu lhooo yang ada di NK-S letaknya sebelah kanan. Hmm,, fungsinya adalah tempat komentar dari pengunjung blog. Yaahhh, karena saya membuat artikel ini terburu-buru langsung saja yaaaa.


  • Sign Up dulu di CBOX, link nya disini
  • Isikan data-data sobat, contohnya seperti ini:

  • Lalu klik "Creat my Cbox!"
  • Setelah itu, Konfirmasi email sob, (buka email sobat, klik link yang telah di kirim lewat email)
  • Setelah itu tinggal login Cbox
  • Login selesai,,, Tinggal ambil code Cbox nya (copy code Cbox)
  •  Sekarang Buka blogger, dan tambahkan Widget HTML baru. Isikan kode berikut
 <style type="text/css">
#gb{
position:fixed;
top:20px;
z-index:+1000;
}* html #gb{position:relative;}

.gbtab{
border: 1px solid black;
height:150px;
width:50px;
float:left;
background:url('http://1.bp.blogspot.com/-CqR0fWQ4trE/UCBdcFuGghI/AAAAAAAAASo/KbPg8wvdBt8/s1600/cboxlbh.png') no-repeat;
}

.gbcontent {
float:left;
border:1px solid #000000;
-moz-border-radius-bottomleft:5px;
-webkit-border-radius-bottomleft:5px;
-o-border-radius-bottomleft:5px;
-khtml-border-radius-bottomleft:5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-topleft: 5px;
background: #F2F2F2; url() no-repeat bottom;
padding:10px;
}

</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
gb.opened = !gb.opened;
}function moveGB(x0, xf){

var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 25 : 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+")", 5);}
}</script>

<div id="gb">
<div class="gbtab" onmouseover="showHideGB()"> </div>

<div class="gbcontent">
<center>
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div id="cboxdiv" style="text-align: center; line-height: 0">
<div><iframe frameborder="0" width="200" height="305" src="http://www7.cbox.ws/box/?boxid=511158&amp;boxtag=vw3cc5&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain7-511158" style="border:#48515A 1px solid;" id="cboxmain7-511158"></iframe></div>
<div><iframe frameborder="0" width="200" height="75" src="http://www7.cbox.ws/box/?boxid=511158&amp;boxtag=vw3cc5&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform7-511158" style="border:#48515A 1px solid;border-top:0px" id="cboxform7-511158"></iframe></div>
</div>
<!-- END CBOX -->
<br />
<a href="http://www.namikazestar.com/2012/08/cara-menambahkan-bukutamu-hover-di-blog.html"><small><b>×÷•.•´¯`•)»Dapatkan Cbox ini«(•´¯`•.•÷×</b></small></a>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script>
</div>
  • Ganti kode berwarna merah dengan kode Cbox yang tadi dicopy
 Selesai deh, tinggal cek blog sobat. :)


1 comment:

  1. We are the World's Largest Online Football Agent and Trusted. The transaction process is safe, fast and comfortable is our commitment to make our loyal customers even more pleased to recommend our services to their fellow colleagues. Agen Bola Terpercaya | Judi Online

    ReplyDelete

Terimakasih telah berkunjung dan membaca artikel NKS, Silahkan tinggalkan komentar anda guna meramaikan blog sederhana ini.

NamiKaze Star Shared by Themes24x7 Copyright © 2014

Theme images by Bim. Powered by Blogger.