Home » Thủ thuật blog
Chèn Chabox Gtalk vào BlogSpot.
Thứ Năm, 29 tháng 12, 2011
Nếu site bạn rất nhiều bạn bè có tài khoản Google, tại sao không thử chèn thêm một ChatBox để tăng tình năng trò chuyện kết bạn cho Blog. Việc đơn giản phải làm là bạn chỉ cần nhúng một iframe của Google cho sẵn.
Các bạn coppy và cài đặt nhé. Và nhớ chỉnh lại CSS. của mình.
Xem DEMO
Các bạn coppy và cài đặt nhé. Và nhớ chỉnh lại CSS. của mình.
<style>
#chat{position:fixed; top:0px; left:1px;}
.bt{background:url('http://cdn1.iconfinder.com/data/icons/androiddevicons/dialog.png') no-repeat; width: 48px; height: 48px;}
#cbody{border-radius: 3px 10px 0px #444;}
</style>
<div id="chat">
<div class="bt" onclick="toggle()" ></div>
<p id="cbody" style="display:none;">
<iframe height="350" frameborder="0" width="300" src="http://talkgadget.google.com/talkgadget/client?fid=gtalk0&relay=http%3A%2F%2Fwww.google.com%2Fig%2Fifpc_relay"></iframe>
</p>
</div>
<script>
var $_ = function(x){return document.getElementById(x);}
function toggle(){
var ck = $_("cbody").style.display;
if(ck != "none"){
$_("cbody").style.display = "none";
}
if(ck != "block"){
$_("cbody").style.display = "block";
}
}
</script>
#chat{position:fixed; top:0px; left:1px;}
.bt{background:url('http://cdn1.iconfinder.com/data/icons/androiddevicons/dialog.png') no-repeat; width: 48px; height: 48px;}
#cbody{border-radius: 3px 10px 0px #444;}
</style>
<div id="chat">
<div class="bt" onclick="toggle()" ></div>
<p id="cbody" style="display:none;">
<iframe height="350" frameborder="0" width="300" src="http://talkgadget.google.com/talkgadget/client?fid=gtalk0&relay=http%3A%2F%2Fwww.google.com%2Fig%2Fifpc_relay"></iframe>
</p>
</div>
<script>
var $_ = function(x){return document.getElementById(x);}
function toggle(){
var ck = $_("cbody").style.display;
if(ck != "none"){
$_("cbody").style.display = "none";
}
if(ck != "block"){
$_("cbody").style.display = "block";
}
}
</script>
Chúc bạn thành công !

- Nút điều khiển lên xuống toàn trang cho blogspot
- Menu ngang co kèm hình ảnh bên cạnh rất đẹp
- Hiệu ứng Like page Facebook (FB), G+, twitter động cực đẹp cho Web, blogspot
- CSS3 với hiệu ứng hình ảnh động cực đẹp cho Web, blogspot
- Bài viết liên quan cho blogspot - Hiệu ứng ảnh thu nhỏ
- Thủ thuật thêm thống kê Blog 3 trong 1 cho blogspot
- Các truy vấn cơ bản với Blogspot
- Chèn link Google Search vào footer của bài viết
- Thêm Reactions vào bài viết của blogspot
- Hướng dẫn Bảo mật data blogger
- [ Yêu cầu ] - Ẩn 1 bài viết bất kỳ trong tiện ích Popular Posts
- [Chia sẻ] - Tạo hộp thoại thông báo cho blog
Comments[ 0 ]
Đăng nhận xét