Khung quảng cáo nhỏ phía dưới góc màn hình cho web/blog hiện nay đang rất được ưa chuộng và được áp dụng nhiều trên các web/blog vì nó không ảnh hưởng tới tới chất lượng bài viết, không gây khó chịu cho khách truy cập như các popup bật lên tự động, hàng loạt. Ngoài ra nó còn mang lại cho bạn thêm chút ít tài chính khi đặt quảng cáo tại đó
Bài viết này mình sẽ chia sẻ với các bạn cách tạo khung quảng cáo nhỏ phía dưới góc như trang csttol.blogspot.com
Các bạn copy đoạn code sau :
<script type="text/javascript">
function hide_float_left() {
var content = document.getElementById('float_content_left');
var hide = document.getElementById('hide_float_left');
if (content.style.display == "none")
{content.style.display = "block"; hide.innerHTML = '<a href="javascript:hide_float_left()">Tắt quảng cáo [X]</a>'; }
else { content.style.display = "none"; hide.innerHTML = '<a href="javascript:hide_float_left()">Xem quảng cáo...</a>';
}
}
</script>
<style>
.float-ck { position: fixed; bottom: 0px; z-index: 9000}
* html .float-ck {position:absolute;bottom:auto;top:expression(eval (document.documentElement.scrollTop+document.docum entElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0))) ;}
#float_content_left {border: 1px solid #01AEF0; background-color: #FFFFFF;}
#hide_float_left {text-align:left; font-size: 11px;}
#hide_float_left a {background: #01AEF0; padding: 2px 4px; color: #FFF;}
</style>
<div class="float-ck" style="left: 0px" >
<div id="hide_float_left">
<a href="javascript:hide_float_left()">Tắt Quảng Cáo [X]</a></div>
<div id="float_content_left">
<div id="fb-root"></div>
<a href="csttol.blogspot.com" taget="_blank" ><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHT_DHzu5eaKBd5QOIFVJUyKsMjbPV7iM415ImV6i2mD2D0Yr70imeD-NNusuSqt4ul9bjYXhISVhVpcMuS8_hg7UozVFI8O61iHKnnPeprudxq8Or3cV36VYDaJN6fPjyXFQdyJdQaBcI/s1600/Cua-so-Pop-Up.png" width="195" height="120" /></a>
</div>
</div>
Tiếp theo để chèn vào web/blog các bạn có thể chèn bằng 2 cách sau :function hide_float_left() {
var content = document.getElementById('float_content_left');
var hide = document.getElementById('hide_float_left');
if (content.style.display == "none")
{content.style.display = "block"; hide.innerHTML = '<a href="javascript:hide_float_left()">Tắt quảng cáo [X]</a>'; }
else { content.style.display = "none"; hide.innerHTML = '<a href="javascript:hide_float_left()">Xem quảng cáo...</a>';
}
}
</script>
<style>
.float-ck { position: fixed; bottom: 0px; z-index: 9000}
* html .float-ck {position:absolute;bottom:auto;top:expression(eval (document.documentElement.scrollTop+document.docum entElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0))) ;}
#float_content_left {border: 1px solid #01AEF0; background-color: #FFFFFF;}
#hide_float_left {text-align:left; font-size: 11px;}
#hide_float_left a {background: #01AEF0; padding: 2px 4px; color: #FFF;}
</style>
<div class="float-ck" style="left: 0px" >
<div id="hide_float_left">
<a href="javascript:hide_float_left()">Tắt Quảng Cáo [X]</a></div>
<div id="float_content_left">
<div id="fb-root"></div>
<a href="csttol.blogspot.com" taget="_blank" ><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHT_DHzu5eaKBd5QOIFVJUyKsMjbPV7iM415ImV6i2mD2D0Yr70imeD-NNusuSqt4ul9bjYXhISVhVpcMuS8_hg7UozVFI8O61iHKnnPeprudxq8Or3cV36VYDaJN6fPjyXFQdyJdQaBcI/s1600/Cua-so-Pop-Up.png" width="195" height="120" /></a>
</div>
</div>
Đối với Blog : Các bạn vào bố cục -> Thêm tiện ích - > HTML/Javascrip
Và các bạn dán phần code vừa copy ở trên vào rôi Lưu lại
Đối với website : Các bạn dán đoạn code trên vào giữa cặp thẻ <body>..</body> rồi lưu lại, Với Blog ngoài cách trên bạn cũng có thể thực hiện bằng cách này.
Lưu ý : Những phần mình tô mầu cho đoạn code trên các bạn có thể chỉnh sửa lại cho phù hợp với Web/Blog của mình
style="left: 0px" : Góc bạn muốn khung quảng cáo xuất hiện,0px là khoảng cách tới khung trình duyệt
csttol.blogspot.com: Các bạn thay đổi bằng địa chỉ của liên kết cần quảng cáo src là địa chỉ hình ảnh quảng cáo
width="195" : Chiều rộng của khung quảng cáo
height="120" : Chiều dài của khung quảng cáo
rất hay cảm ơn bạn
ReplyDelete