Quảng cáo cố định (Sticky Ads)là gì
Chúng thường được sử dụng trong đầu trang, chân trang, thanh trái / phải, thanh bên trái và phải.
Sự cần thiết của Quảng cáo dính (Sticky Ads) là gì?
Quảng cáo cố định giúp bạn đặt và nhấn mạnh quảng cáo của mình bên trong và bên ngoài bố cục trang web của bạn. Với Quảng cáo cố định, bạn sẽ tạo quảng cáo cố định, quảng cáo này luôn hiển thị trong cửa sổ trình duyệt. Với sự trợ giúp của Quảng cáo cố định, bạn có thể hiển thị quảng cáo không cuộn với màn hình.
Làm cách nào để thêm quảng cáo dính (Sticky Ads) dưới cùng trong Blogger?
Tôi sẽ hướng dẫn bạn Thêm thanh tiến trình đọc trong Blogger, Ok, chúng ta hãy bắt đầu!
Bước 1. Lúc đầu, bạn cần đi tới bảng điều khiển Blogger, tức là Blogger.com .
Bước 2. Chuyển đến Phần Chủ đề và Nhấp vào Chỉnh sửa Nút HTML.
Bước 3. Sao chép mã CSS được cung cấp bên dưới.
/* Sticky Ads */
.sticky-button{position:fixed;bottom:0;right:20px;width:50px;height:50px;border-radius:50px;background-color:#fdd929;box-shadow:0px 4px 12px 0 rgba(9,32,76,.05);z-index:20;overflow:hidden;-webkit-transition:all .2s ease;transition:all .2s ease;opacity:0;visibility:hidden}
.sticky-button.sticky{bottom:20px;opacity:1;visibility:visible}
.sticky-button > *{display:flex;align-items:center;height:100%}
.sticky-button > * svg{margin:auto;fill:inherit}
.sticky-ad{position:fixed;bottom:0;left:0;width:100%;min-height:70px;max-height:200px;padding:5px 0;box-shadow:0 -6px 18px 0 rgba(9,32,76,.1);-webkit-transition:all .1s ease-in;transition:all .1s ease-in;display:flex;align-items:center;justify-content:center;background-color:#fefefe;z-index:20}
.sticky-ad .sticky-adClose{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:12px 0 0;position:absolute;right:0;top:-30px;background-color:#fefefe;box-shadow:0 -6px 18px 0 rgba(9,32,76,.08)}
.sticky-ad .sticky-adClose svg{fill:#767676}
.sticky-ad .sticky-adContent{flex-grow:1;overflow:hidden;display:block;position:relative}
.sticky-adInput:checked + .sticky-ad{padding:0;min-height:0}
.sticky-adInput:checked + .sticky-ad .sticky-adContent{display:none}{codeBox}
Bước 4 . Dán Mã CSS phía trên thẻ ]]></b: skin> .
Bước 5 . Sao chép mã HTML được cung cấp bên dưới.
<!--<b:if cond='data:blog.isMobileRequest == "true"'>-->
<input class='sticky-adInput hidden' id='sticky-adIn' type='checkbox'/>
<div class='sticky-ad' id='sticky-ad'>
<label class='sticky-adClose' for='sticky-adIn'><svg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'></path></svg></label>
<div class='sticky-adContent'>
<!--<div class='ads-here' style='display:block;height:60px'/>-->
<ins class='adsbygoogle' data-ad-client='ca-pub-1234567891234567' data-ad-format='horizontal' data-ad-slot='3466897794' data-full-width-responsive='false' style='display:block;text-align:center'></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
</div>
</div>
<!--</b:if>-->{codeBox}
Bước 6 . Dán Mã HTML phía trên thẻ </body>.
Bước 7 . Thay đổi phần được đánh dấu bằng ID nhà xuất bản AdSense và ID vùng quảng cáo AdSense của bạn.
Bước 8 . Nhấp vào Lưu!
Vậy các bạn ơi, các bạn thích bài đăng này trên Add Bottom Sticky Ads trong Blogger như thế nào? Bây giờ bạn phải hiểu Cách thêm Quảng cáo cố định dưới cùng trong Blogger. Hãy cho chúng tôi biết cảm nhận của bạn về bài viết này về Cách thêm Quảng cáo cố định dưới cùng trong Blogger? bằng cách viết bình luận để chúng tôi cũng có thể có cơ hội học hỏi và cải thiện điều gì đó từ ý tưởng của bạn.
