Cách tạo quảng cáo cố định ở cuối màn hình máy tính cho blogspot

Quảng cáo Google Adsense cố định này nằm ở cuối màn hình máy tính, xuất hiện khi cuộn được 30% trang và người dùng dễ dàng loại bỏ.

Nhìn chung sticky ads at the bottom pc nó trông tương tự như quảng cáo cố định xuất hiện trên điện thoại thông minh. Chỉ là ở đây xuất hiện trên phiên bản dành cho máy tính để bàn. Và nó chỉ xuất hiện trên máy tính rất phù hợp cho người không sử dụng quảng cáo tự động.

Quảng cáo cố định này sử dụng kích thước quảng cáo là 728x90px. Quảng cáo với kích thước này lọc quảng cáo tốt hơn là quảng cáo có kích thước lớn hơn kích thước đó.

Quảng cáo dính này cũng có thể là một giải pháp thay thế cho những người sử dụng quảng cáo nổi khó đóng và rất khó chịu. Và bạn có thể sử dụng code cho nhiều trang quảng cáo khác ngoài Google Adsense.

Cài đặt quảng cáo cố định dưới màn hình máy tính để bàn

Bước 1 Sao chép css bên dưới và dán nó trên thẻ </head>

<b:if cond='data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;} and data:blog.isMobileRequest == &quot;false&quot; and not data:blog.searchQuery'>
<style>
/*<![CDATA[*/
.sticky-ad{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow:visible;position:sticky;text-align:center;bottom:-104px;left:calc(50% - 368px);width:736px;z-index:999;max-height:104px;background-image:none;background-color:#fff;box-shadow:0 0 5px 0 rgba(0,0,0,.2);margin-bottom:0;padding-top:4px;transition:all .4s ease-in-out}
.sticky-ad-close-button{position:absolute;width:28px;height:28px;top:-28px;right:0;background-image:url("data:image/svg+xml;charset=utf8,%3csvg width='13' height='13' viewBox='341 8 13 13' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cg%3e%3cpath style='fill:%234F4F4F' d='M354 9.31L352.69 8l-5.19 5.19L342.31 8 341 9.31l5.19 5.19-5.19 5.19 1.31 1.31 5.19-5.19 5.19 5.19 1.31-1.31-5.19-5.19z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");background-size:13px 13px;background-position:9px;background-color:#fff;background-repeat:no-repeat;box-shadow:0 -1px 1px 0 rgba(0,0,0,.2);border:none;border-radius:12px 0 0;cursor:pointer}
.sticky-ad-close-button:before{position:absolute;content:"";top:-20px;right:0;left:-20px;bottom:0}
*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
:active,:focus{outline:0}
/*]]>*/
</style>
</b:if>

Bước 2 Sau đó, để hiển thị quảng cáo, hãy sao chép và dán đoạn mã sau ngay trên </body>

<b:if cond='data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;} and data:blog.isMobileRequest == &quot;false&quot; and not data:blog.searchQuery'>
<div class='sticky-ad' id='sticky-ad'>
<ins class='adsbygoogle' data-ad-client='ca-pub-12345123456789' data-ad-slot='123456789' style='display:inline-block;width:728px;height:90px'/><script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
<button aria-label='Close this ad' class='sticky-ad-close-button' onclick='document.getElementById(&apos;sticky-ad&apos;).style.display=&apos;none&apos;;'/>
</div>
<script>
//<![CDATA[
window.addEventListener("scroll",function(){
  var target = document.getElementById('sticky-ad');
  if(window.pageYOffset > 300){
   target.style.bottom = "0";
  }
},false);
//]]>
</script>
</b:if>

Bạn thay ID nhà xuất bản và ID mã quảng cáo cho phù hợp sau khi bạn đã chọn một mã quảng cáo cố định kích thước 768x90 trong tài khoản Google adsense của bạn.