Cập nhật 2026: Giao diện mới và hướng đi mới ! Xem chi tiết →

Code quảng cáo góc bên phải hoặc bên trái cho Blogspot (Blogger)

Hoàng Nhân Khôi Thứ Hai, 21 tháng 9, 2015
Code quảng cáo góc bên phải hoặc bên trái cho Blogspot (Blogger)
Blog của bạn có một lượng truy cập quá khủng, tất cả ví trị trên Blog đều đã đặt hết quảng cáo: Đặt trực tiếp vào bài viết, các cột sitebar hay đặt quảng cáo trượt dọc hai bên Blog

Chính vì đều này, hôm nay Windows2it sẽ hướng dẫn các bạn đặt quảng cáo ở góc bên phải hoặc bên trái Blog nhằm tiết kiệm không gian kiềm theo nút tắt/mở quảng cáo, tránh sự khó chịu và tăng trải nghiệm của người dùng khi vào Blog của bạn.

   Đọc thêm:



☼ Bắt đầu thủ thuật _ Chỉ cần chèn đoạn Code sau đây một Widget HTML/Javascript

Đầu tiên bạn vào Blog => Bố cục => Thêm tiện ích => HTML/JavaScript và dán đoạn mã code dưới đây vào Lưu lại.

>>  Code quảng cáo góc Bên phải
Code quảng cáo góc Bên phải cho Blogspot

<script type="text/javascript">

function hide_float_right() {

    var content = document.getElementById('float_content_right');

    var hide = document.getElementById('hide_float_right');

    if (content.style.display == "none")

    {content.style.display = "block"; hide.innerHTML = '<a href="javascript:hide_float_right()">Tắt quảng cáo [X]</a>'; }

        else { content.style.display = "none"; hide.innerHTML = '<a href="javascript:hide_float_right()">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_right {border: 1px solid #01AEF0; width: 300px; height: 250px;}

#hide_float_right {text-align:right; font-size: 11px;}

#hide_float_right a {background: #01AEF0; padding: 2px 4px; color: #FFF;}

</style>

<br />
<div class="float-ck" style="right: 0px;">
<div id="hide_float_right">
<a href="javascript:hide_float_right()">Tt Qung Cáo [X]</a></div>
<div id="float_content_right">
<!-- Start quang cao-->

  <a href="http://www.windows2it.com/" taget="_blank"><img alt="Quảng cáo trên windows2it.com" src="https://cdn.adf.ly/images/banners/adfly.300x250.1.gif"/></a>

<!-- End quang cao -->
</div>
</div>  
>> Code quảng cáo góc Bên trái
Code quảng cáo góc Bên trái cho Blogspot

<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; width: 300px; height: 250px;}

#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()">Tt Qung Cáo [X]</a></div>

<div id="float_content_left">

<!-- Start quang cao-->

     <a href="http://www.windows2it.com" taget="_blank" ><img alt="Quảng cáo trên windows2it.com" src="https://ouo.io/images/banners/r4.jpg"/></a>

<!-- End quang cao -->
</div>
</div>  
☼ Tùy chỉnh

·        300px250px lần lượt là chiều rộng và chiều cao khung bao ngoài.

·        Thay link ảnh màu xanh thành link ảnh của bạn.

·        Thay windows2it.com thành link bạn muốn dẫn về.

☼ Kết luận:

·        Sử dụng 1 đoạn CSS và đoạn Scipts mở (chưa mã hóa - endcode) nên việc tùy biến rất dễ dàng. <Thủ thuật này quá đơn giản nên mình không để DEMO ngoài chỉ để DEMO trực tiếp ở bài viết>

·        2 Code quảng cáo trên các bạn có thể chèn trực tiếp vô template <theo mình nghĩ các bạn nên chèn ở HTML/JavaScript để tránh lỗi template không cần thiết (-_-)>


Còn bạn muốn Support gì thì cứ để lại comment @!


Bài Viết Liên Quan

Bình Luận (5)

Unknown
Unknown lúc 09:43 7 tháng 10, 2016
dán ở dưới code nào vậy bạn... mong bạn viết rõ hơn là đoạn code đó dán ở phần nào
Hoàng Nhân Khôi
Hoàng Nhân Khôi lúc 08:30 8 tháng 10, 2016
mình đã ghi rất ràng và có điểm nhấn nữa mà bác đọc ko hiểu thì mình cũng thui ... Thì dán code vào HTML/JavaScript chứ dán ở đâu nữa .. mình ghi rất rõ và đâu có sai lỗi gì đâu :(
Unknown
Unknown lúc 22:11 9 tháng 2, 2017
trước thẻ đóng "" cũng được bạn ạ
Shop Mỹ Phẩm Tuấn Du
Shop Mỹ Phẩm Tuấn Du lúc 01:50 25 tháng 4, 2017
bạn ơi, dán vào chỗ nào html đây... phải có vị trí nào dán vào chư, hay dán bất kỳ vào đó ak
Admin
Admin lúc 20:43 13 tháng 2, 2019
thank bác đã chia sẻ

Đăng nhận xét