Cara membuat chatbox slide show !!!!!
Apa kabar sobat blogger .. ! saat ini kita akan membahas tentang bagaimana cara memasang atau membuat Slide Chatbox ( kotak komentar ) pada blog anda !? oke deh kita langsung aja deh ,. menuju ke tutorial nya dibawah ini !!!
Cara membuat chatbox slideshow !!!
1. Baca Bassmallah .,,
2. Sebelumnya, buat akun chatbox dulu, klik cbox,
3. langsung aja daftar ..
4. Ikuti saja perintah-perintahnya, setelah itu anda akan mendapatkan kode.!!!
5. Setelah itu masuk ke akun Blogger anda
6. Masuk ke Dashboard > Tata Letak > Tambah Gadget > Html/Javascript
7. Masukkan kode ini di tempat konten kosong(sembarang) tapi yang tersedia !!!
Klik Untuk melihat
<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/AVvXsEguAb-FVzbkAaUueC67dzutMUskTR8xKrd-9lkIWZg1yquTBIww7UK2fd2p1dWAaGo7fm8ryqqXl6HWrqv5_13eHP8s-NNy2Xrx2RUfs_g36v4RONvuJ7RTm7-R0MvUOG6lBfr3jwWo2wfr/s1600/cbblue-2.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">
LETAKAN KODE CHATOBOX SOBAT DI huruf merah ini !!!!
<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>
8. Ganti tulisan ganti tulisan chatbox disini dengan kode chatbox yang didapatkan sobat tadi
9. Setelah itu klik Simpan dan ihat hasilnya !!!!!
Keterangan " bagi warna yang berwarna merah itu adalah tempat anda meletakan code dari cbox anda !!! " , " bagi yang berwarna kuning adalah tempat untuk meletakan url untuk mengganti gambar atau tulisan chatbox " ( kalo yang diaatas sama dengan punya' saya )
Berikut beberapa bonus url gambar varian warna chatbox yang saya cari darihttp://rizaldipriantama.blogspot.com :
Berikut beberapa url gambar varian url warna chatbox :
Sekian Tips and Trik pada pertemuan kali ini !!
Semoga Bermanfaat
Wassalamualaikum Wr Wb
Tidak ada komentar:
Posting Komentar