Selamat Datang Diucapkan Kepada Semua Pengunjung Blog Ini Segala Komen Dan Saranan Teman Teman Amat Seri Hargai

Panduan Memasang Chatbox Tersembunyi

Untuk blog yang mengunakan template 2 kolom sudah tentu mempunyai ruangan terhad untuk memasang berapa aplikasi penting terutama chatbox. Chatbox tersembunyi sudah tentu menjadi pilihan utama selain ia tidak memberatkan loading sesebuah blog.


Panduan Memasang:

Masuk ke Blogger

Klik Tab Design

Klik Tab Add a Gadget

Pergi ke HTML/JavaScript dan klik untuk menampilkan satu pop-up

Salin kode 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('http://i755.photobucket.com/albums/xx200/Seri_07/Shoutbox.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 kod ChatBox anda disini

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>


Catatan:
Warna Ungu - Boleh tukar gambar ukuran 30px X 100px. Sebaik-baiknya gambar anda sendiri upload agar tidak menghadapi sebarang kesukaran dikemudian hari.
Warna Merah - Kode C/Box atau ShoutBox letak di bahagian ini.
PERHATIAN - Ukuran tinggi ChatBox jangan melebihi 450px.

Masukkan kode diruangan yang bertanda merah kemudian klik Tab SAVE. Lepas itu tekan sekali lagi Tab SAVE sebelah atas kanan.

8 Pandangan:

zaL_cdpx Januari 26, 2011  

ape nie?? xphm laa..., hasil dia cmne nnti?

kakyon Januari 26, 2011  

salam seri..
code chat box dpt di mana?

Seri Bahasa Januari 26, 2011  

zaL_cdpx@ chatbox ini akan terpapar ditepi sebelah kanan blog. bila kita klik tab SHOUTBOX baru dia akan keluar.

kakyon@ ambil dari internet tapi seri dah test banyak kali takde masalah kalau dipasang diblog

Yastro Januari 26, 2011  

Wahh...dh bagus seri wat tutorial ni...kene mcm yas yg maleh ni...dtg sini jer klau nak ape2..

~~su manje~~~ Januari 26, 2011  

Ptg Rabu berjalan-jalan
singgah ptg di blog seri
sejarah chatbox jadi pengajaran
su tak nak pasang lagi


Blog su manje tak de shoutbox
nice tutorial buat semua
traffik su rendah kerana shoutbox
salah su tak kuncikannya

Amri Abd Rani Januari 26, 2011  

wahh Seri...sntiasa ke hadapan ni...
Pakwi masih mnat shoutmix yg lama....klasik nasional....

esagelo Januari 26, 2011  

oia, terimakasih informasi untuk memasang chatbox tersembunyi nya ya mba.. sudah saya praktekan dan berhasil. Nah saya sekarang mau tanya cara membuat widget friend link seperti punga mbak itu gimana ya? maaf kalo pertanyaannya nyasar. hehe salam..

gadis senget Ogos 30, 2011  

dah buat :) mecey a lot!

Teman Setia

This Blog Is Proudly Sponsored By SURF7 Template Modified By Seri Bahasa Proud To Be A Kinabatangan Blogger