Farah Tutorial & Freebies Blog


HOME Profile Tutorial Freebies Facebook Twitter Instagr Follow
About My Blog

Hello everyone, I'm Farah! I've created my blog on December 2012, just for Tutorial and Freebies. I Hope you like it~ Keep enjoy and have a great day!
Chatting Box


Banner


Copy My Banner Code
Credits

Basecode by Myself
Design by Me and I
Images by Google~

"Cara Menambahkan CBOX tersembunyi ke dalam Blog"
Selasa, 18 Desember 2012 - Permalink - 2 Comments

Hai semua.... Maaf ya semuanya!!!! hari ini Tutorialnya cukup 1 saja dulu, aku juga sambil cari cari nihhhh... mmm kali ini judulnya (Cara Menambahkan ShoutBox Tersembunyi ke dalam Blog). Tahu ShoutBox Blog gak??? itu!!! ada di sebelah Kanan, yang tulisannya ShoutBox (lihat Blog-ku). Kalian Klik tulisan itu, apa yang terjadi???? benar skali!!! akan keluar tempat percakapan. Ini seperti ChatBox, namun ini tersembunyi, sehingga disebut ShoutBox saja. mmmmm pasti ada yang kepengen tahu kan caranya???? oke langsung saja!!! (Ikuti Step).

1. Buka Blogger.

2. Klik Tata Letak.

3. Tambah Gadget. 

4. Cari HTML/JavaScript.

5. Copy LINK di Bawah 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/AVvXsEi8xA8gi6rusnpqM83kdkKP-Rj0UYOOdyXm5gNl561kXQmzJSk29HrDKQNB8itt7STAU9D_MiVWmzL3tXHo4Ett8Y1qG-ESn10RVWUvG0nhVRGzNyRVzfTpIfL6hmmfz67v1XrNkpBz1tFz/s320/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">

Letakkan kode ShoutBox kalian di sini

<div style="text-align:right">
<a href=" http://deadollixious.blogspot.com/2012/10/tutorial-hidden-shoutbox.html "><font size="2"">click to get this widget</font></a><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>
(LINK di Atas Ini Copast Bye Dea) untuk LINK Blog Dea ada di paling bawah


6. Paste LINK Tadi.

7. Titah berwarna Hijau itu adalah jenis Warna pembatas ShoutBox, kayak aku kan pembatasnya PINK, Nah kalian bisa pilih dengan salah satu di bawah ini.


http://img846.imageshack.us/img846/6586/tnavy.png

http://img267.imageshack.us/img267/5049/tmerah.png

http://img560.imageshack.us/img560/7910/tkuningo.png

http://img829.imageshack.us/img829/127/pinkcair.png

http://img710.imageshack.us/img710/7861/pinkkg.png

http://img36.imageshack.us/img36/3569/orenx.png

http://img84.imageshack.us/img84/6496/hijau.png

http://img97.imageshack.us/img97/6060/ungucair.png


8. Jika sudah dipilih, sekarang ganti tintah yang warna Orens itu, Tintah orens itu adalah Kode warna latar belakang ShoutBox, kayak aku kan putih... nah kalian bisa pilih!!! di Sini 

9. Jika sudah!!!! sekarang  ganti Tintah yang berwarna Merah itu dengan LINK ChatBox kalian (syaratnya harus daftar di Akun Chatbox, baru punya LINK-nya).

10. Sudah???? baiklah!!!!.. Klik Simpan.

11. Simpan Perubahan.

12. Selesai.

Lihat Blog Kalian, Gimana??? hihi semoga Bermanfaat ya!!!! selamat mencoba ^_^

"Wassalamualaikum" 

Credit : Dea (LINK Atas yang panjang) http://deayeon.blogspot.com/