18.45
21

Lansung saja ya menuju ke TKP.
Untuk Tutorial yang pertama adalah
1. Sobat login dulu ke akun Blogger.
2. Kemudian ke Rancangan.
3. Setelah itu sobat menambahkan Gadget, HTML/Java Scrip.
4. Masukkan / Copy Paste Code berikut ini. Kedalam HTML/Java Scrip

<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('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.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">
<!-- Ganti ini dengan kode buku tamu kamu --> br/>
<br/>
<a href="http://www.santozaq.com">.
</a>
<div style="text-align:right">
<a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>

5. Sobat harus mengganti code yang ber warna merah Ganti Kode ini dengan kode ChatBox sobat dengan kode ChatBox sobat, yang sobat dapatkan dari situs terkait.
6. Sobat juga bisa mengatur posisinya, tinggal mengganti Top-nya sesuai dengan keinginan sobat.

21 comments:

  1. kode buku tamu ambil dari mana maz???

    BalasHapus
  2. bisa ambil dari http://www.cbox.ws/ tapi daftar dulu,,gratis kog

    BalasHapus
  3. AKU BARU BIKIN BLOG NEH KA... tolong ajari aku dong...

    BalasHapus
  4. ok silahkan,,,gimna saya bisa bantu non

    BalasHapus
  5. trs udah daftar gimana?

    BalasHapus
  6. kalo udah daftar tinggal edit layout dan lainnya,,trus publish n copas kode HTML nya

    BalasHapus
  7. binfunf knapa gan???
    bingung bikin widget atau daftarnya??

    BalasHapus
  8. dua2nya bro...^^
    ajarn qu donk bro,,cra bkin chatbox pd blog?

    BalasHapus
  9. 1. Kamu daftar dulu di web penyedia chat box gratis seperti di http://cbox.ws/
    2. Sign Up
    3. Klik LOOK & FEEL
    - Layout Options: untuk ukuran chat box nya
    - Style Present: untuk memilih modelnya
    - Colours dan Fonts: edit warna dan huruf
    - Edit CSS: editing CSS
    4. Kalau udah selesai edit trus pilih PUBLISH!
    5. Copy kode HTML di bawah
    6. Buka Racangan
    7. Tambah Widget
    8. Pilih HTML/JAVASCRIPT
    9. Copas Kode di atas
    10. Ganti kode yg berwarna merah dengan kode dari Chat Box tadi
    11. Save

    dan lihat tampilannya akan seperti CHAT BOX saya di samping itu

    BalasHapus
  10. mAKASih kawannnnnnnnnn!!! mampir d blogku ya

    BalasHapus
  11. makasih jg udah berkunjung dan berkomentar

    BalasHapus
  12. Makasih ya, jadi nambah ilmu, juga sekarang chatbox saya ngga ganggu :)

    BalasHapus
  13. sip,,mkch jg dah berkunjung n koment

    BalasHapus
  14. Terimakasih bang infonya bermanfaat.....

    visit back lucumenaik.blogspot.com

    BalasHapus