CSS
TẠO QUẢNG CÁO STICKY Ở CHÂN TRANG WEBSITE GIỐNG ADSENSE PAGE-LEVEL ADS
Adsense có dạng quảng cáo cấp trang tự điều chỉnh kích thước khi sử dụng điện thoại di động có kích thước bé. Hôm nay, z0mbie sẽ hướng dẫn các bạn làm banner ở chân trang có nút tắt. Cách thực hiện B…
Adsense có dạng quảng cáo cấp trang tự điều chỉnh kích thước khi sử dụng điện thoại di động có kích thước bé. Hôm nay, z0mbie sẽ hướng dẫn các bạn làm banner ở chân trang có nút tắt.
Cách thực hiện
Bước 1: Vào Chủ đề >> Chỉnh sửa HTML và dán đoạn CSS bên dưới vào trước thẻ ]]></b:skin>
Bước 2 : Tìm đến thẻ </body> và dán đoạn code bên dưới vào trước thẻ đó:
Bước 3. Vậy là xong rồi đấy, rất đơn giản phải không nào, việc cuối cùng là bạn hãy dán mã code quảng cáo của bạn vào đoạn HTML bên trên thôi. Kết quả sẽ hiện ra như hình bên dưới. Ngoài ra website của bạn cần sử dụng thêm Font-awesome để hiển thị mũi tên nhấp xuống nhé.
Cách thực hiện
Bước 1: Vào Chủ đề >> Chỉnh sửa HTML và dán đoạn CSS bên dưới vào trước thẻ ]]></b:skin>
.sticky_bottom{position:fixed;bottom:0;width:100%;max-width:1024px;z-index:999;background:#f2f2f2;padding:10px 5px 5px;text-align:center;box-sizing:border-box} .button_sticky_bottom{position:absolute;width:40px;height:30px;background:#f2f2f2;top:-20px;padding:10px;border-radius:100%;z-index:888;left:50%;margin-left:-15px;text-align:center}
.ads_sticky_bottom{position:relative;z-index:999}
Bước 2 : Tìm đến thẻ </body> và dán đoạn code bên dưới vào trước thẻ đó:
<div class="sticky_bottom">
<a href="javascript:;" class="button_sticky_bottom"><i class="fa fa-angle-down"></i> </a> <div class="ads_sticky_bottom" style="display: block;">
//Đặt code quảng cáo của bạn tại đây
</div>
</div> <script type="text/javascript">
$('.button_sticky_bottom').click(function(){ $(".ads_sticky_bottom").slideToggle(); })
</script>
Bước 3. Vậy là xong rồi đấy, rất đơn giản phải không nào, việc cuối cùng là bạn hãy dán mã code quảng cáo của bạn vào đoạn HTML bên trên thôi. Kết quả sẽ hiện ra như hình bên dưới. Ngoài ra website của bạn cần sử dụng thêm Font-awesome để hiển thị mũi tên nhấp xuống nhé.
Related post
Hung.Pro.VN
Nhà thiết kế WebTôi là admin trang Hung.Pro.VN là một người có đam mê với Blogspot, kinh nghiệm 5 năm thiết kế ra hàng trăm mẫu Template blogpsot như" Bán hàng, bất động sản, landing page, tin tức...
Nhận xét
Đăng nhận xét