Thủ thuật chèn quảng cáo đủ các kiểu lên trang web nền tảng blogspot (đa vị trí, đa nền tảng, quảng cáo đa phong cách)

[ Goghepthanh.com : Quý khách...Cần Mua Thớt Gỗ, Ván Ghép Giá Tốt, Cần Tìm Xưởng Xẻ Sấy, Bán Nguyên Liệu Gỗ Tràm... Uy Tín, Chất Lượng... Gọi Ngay : 0968 970 650
Mời Quý Khách Ghé Thăm Công Ty - Rất Hân Hạnh Được Phục Vụ. ]

🔥 Hot Topics :

🏷️ Thớt Gỗ Teak 🏷️ Xưởng Thớt Gỗ Xuất Khẩu 🏷️ Xưởng Xẻ Sấy Gỗ Tràm 🏷️ Xưởng Gỗ Ghép 🏷️ Xả Kho Gỗ Ghép Giá Rẻ 🏷️ Nhật Ký Chuyên Đề 🏷️ Thương Hiệu Cá Nhân 🏷️ Điện Thoại Thông Minh Chính Hãng 🏷️ Tư Vấn Xe Đạp 🏷️ Đồ Dùng Nhỏ - Lợi Ích To 🏷️ Mẹ Và Bé 🏷️ Gia Bảo TikTok Shop

Đầu tiên xin giới thiệu kiểu quảng cáo lên mobile cực đỉnh đẹp mắt ( ads 300x200 & 300x600 dạng cố định dạng trượt ).

Bước 1 anh em tìm đoạn code :

"<b:section class='main' id='main'"
Nếu thấy showaddelement='no'>
Thì chỉnh lại thành
<b:section class='main' id='main' showaddelement='yes'>

Kế đến chèn 2 widget sau vào phía dưới :

<b:section class='main' id='main' showaddelement='yes'> :
<b:widget cond='data:blog.isMobileRequest and data:view.isPost' id='HTML9' locked='false' title='Quảng cáo bài viết 300 x 600' type='HTML' version='1'>
    <b:widget-settings>
      <b:widget-setting name='content'>

<img alt="Ads" src="https://www.5banners.com/store/img/cms/00108.gif" style="margin-top: 5px;box-shadow: 0px 0px 12px rgba(50, 50, 50, 0.2);width: 100%;margin-bottom: 10px;border: 1px dotted #ccc;"/></b:widget-setting>
    </b:widget-settings>
    <b:includable id='main'>

<b:attr name='class' value='banner-body hidden'/>

<b:attr name='data-version' value=''/>

<b:attr name='id' value=''/>

<div class='banner-content'>

    <div class='banner-position'>

      <div class='banner-display'><div class='banner-iframe'><data:content/></div></div>

    </div>

</div>

</b:includable>

</b:widget>
<b:widget cond='data:blog.isMobileRequest and data:view.isPost' id='HTML10' locked='false' title='Quảng cáo bài viết 300x200' type='HTML' version='1'>
    <b:widget-settings>
      <b:widget-setting name='content'><![CDATA[<img src="https://mediads.in/wp-content/uploads/2020/08/banner-ads.jpg" alt="Ads"/>]]></b:widget-setting>
    </b:widget-settings>
    <b:includable id='main'>

<b:attr name='class' value='banner-post hidden'/>

<b:attr name='data-version' value=''/>

<b:attr name='id' value=''/>

<div class='banner-300'><data:content/></div>

</b:includable>
</b:widget>

Bước kế tiếp chèn Css sau trên thẻ code </head> :

<style>
banner-post.hidden, .banner-body.hidden {

    display: none;

}

.banner-post {

   background: #f8f9fa;

   margin: 20px -15px;

}

.banner-post:before {

    content: "Quảng cáo";

    display: block;

    text-align: center;

    font-size: 12px;

    color: #ccc;

    text-transform: uppercase;

    letter-spacing: 1px;

    margin: -5px 0 5px 0;

}

.banner-post>.widget-content {

    width: 300px;

    margin: 0 auto;

}

.banner-post a {

    display: -ms-flexbox;

    display: -webkit-flex;

    display: flex;

    align-items: center;

    justify-content: center;

}

.banner-post img {

    width: 100%;

    height: auto;

}

.banner-body {

    position: relative;

    top: 20px;

}

.banner-body:after {

    content: "Kéo xuống để xem tiếp sau quảng cáo";

    font-size: 12px;

    color: #ccc;

    text-transform: uppercase;

    text-align: center;

    position: absolute;

    top: -35px;

    left: 0;

    right: 0;

}

.banner-content {

    width: 100%;

    margin:20px 0;

}

.banner-position {

    position: absolute;

    width: 100%;

}

.banner-display {

    display: inline-block;

    position: fixed;

    top: 0;

    left: 0;

    -webkit-backface-visibility: hidden;

    -webkit-transform: translate3d(0,0,0);

}

.banner-iframe {

    display: block;

    position: relative;

}

@media (min-width:481px) {

    .banner-body,.banner-post {

        display: none!important;

    }

}
</style>

Sau đó chèn tiếp đoạn Script sau trên thẻ </body> :

<script>//<![CDATA[

window.addEventListener('load',function(){

    var a=15, // QC hiển thị sau mỗi 15 thẻ <br>

      b=$('.banner-post'),

      c='<div class="banner-post">'+b.html()+'</div>',

      d=$('.banner-body'),

      br=$('.post-body br'),

      e=Math.ceil(br.length/2)

    if(br.length!=''){

      if(b.length!=''){

        if(br.length>a)for(var i=a;i<br.length;i+=a)$(c).insertAfter(br[i])

        $(b).remove()

      }

      if(d.length!=''){

        $(d).insertAfter(br[e]).removeClass('hidden')

        var _w=$(window).width()+'px',_h=$(window).height()+'px'

        $('.banner-content').css({'height':_h})

        $('.banner-position').css({'height':_h,'clip':'rect(0 '+_w+' '+_h+' -20px)'})

        $('.banner-display').css({'width':_w,'height':_h})

        $('.banner-iframe').css({'height':_h})

      }

    }

})

//]]></script>

Cuối cùng lưu lại và thưởng thức thành quả : Anh em có thể tham khảo mẫu quảng cáo theo link sau :

https://www.digitalnomad.vn/2021/02/danh-sach-tieu-de-bai-viet-tuyen-chon-sap-xep-theo-tung-chuyen-mucM5w1.html

Loại quảng cáo thứ 2 giới thiệu với anh em là mẫu quảng cáo ẩn hiện vào cuối trang (Sticky Ads Botom)

Code quảng cáo đơn giản gọn nhẹ a / e chỉ cần copy code dưới đây dán vào trên thẻ </body> là ok con dê :

<style>
.sticky_bottom{position:fixed;bottom:0;width:100%;max-width:2024px;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}
</style>
<div class='sticky_bottom'>
<a class='button_sticky_bottom' href='javascript:;'><i class='fa fa-angle-down'/> </a>
<div class='ads_sticky_bottom' style='display: block;'>
<font color='red' size='3'>
𝕕𝕚𝕘𝕚𝕥𝕒𝕝𝕟𝕠𝕞𝕒𝕕.𝕧𝕟
</font>
</div>
</div>
<script type='text/javascript'>
    $('.button_sticky_bottom').click(function(){
        $(".ads_sticky_bottom").slideToggle();
    })
</script>

Loại quảng cáo thứ 3 giới thiệu với anh em là mẫu quảng cáo dạng Float hiển thị cố định góc trái, góc phải - ở giữa khu vực bên trái & bên phải

Dạng quảng cáo Float cũng rất đơn giản gọn nhẹ tương tự như quảng cáo sticky bottom ads a / e chỉ cần copy code dưới đây dán vào trên thẻ </body> :

Dạng quảng cáo Float đầu & cuối blog bên trái - bên phải loại quảng cáo này phù hợp sử dụng quảng cáo dạng Text không chiếm nhiều diện tích làm che lấp nội dung trên Web-blog :

<style>
.float-contact-right {
position: fixed;
bottom: 40px;
right: 20px;
z-index: 99999;
}
</style>
<style>
.float-contact-left {
position: fixed;
bottom: 20px;
left: 20px;
z-index: 99999;
}
.chat-zalo {
background: #8eb22b;
border-radius: 20px;
padding: 0 18px;
color: white;
display: block;
margin-bottom: 6px;
}
.chat-face {
background: #125c9e;
border-radius: 20px;
padding: 0 18px;
color: white;
display: block;
margin-bottom: 6px;
}
.float-contact .hotline {
background: #d11a59!important;
border-radius: 20px;
padding: 0 18px;
color: white;
display: block;
margin-bottom: 6px;
}
.chat-zalo a, .chat-face a, .hotline a {
font-size: 18px;
color: white;
font-weight: 400;
text-transform: none;
line-height: 0;
}
}

</style>

Nếu không muốn hiển thị trên điện thoại thì chèn thêm code Css vào dưới </style> :

@media (max-width: 549px){
.float-contact{
display:none
}

<div class='float-contact-right'>

<script type='text/javascript'>
quotes2 = new Array()
quotes2[0] = "<a href='https://shorten.asia/rBWaAyk6'><button class='chat-zalo'>Sắm tết</button></a>"
quotes2[1] = "<a href='https://shorten.asia/HJepG516'><button class='hotline'>Ngày Tết trang trí nhà cửa</button></a>"
quotes2[2] = "<a href='https://shorten.asia/Q6hHHg8K'><button class='chat-face'>Ngày tết làm mới đồ dùng phòng ăn phòng bếp </button></a>"
quotes2[3] = "<a href='https://shorten.asia/V5a9rcHW'><button class='hotline'>Siêu Sale mùa Tết</button></a>"
randomquote2 = Math.random() * (quotes2.length)
randomquote2 = Math.floor(randomquote2)
document.write(quotes2[randomquote2])
</script>

</div>

<div class='float-contact-left'>

<script type='text/javascript'>
quotes = new Array()
quotes[0] = "<a href='https://shorten.asia/rBWaAyk6'><button class='chat-zalo'>Sắm tết</button></a>"
quotes[1] = "<a href='https://shorten.asia/HJepG516'><button class='hotline'>Ngày Tết trang trí nhà cửa</button></a>"
quotes[2] = "<a href='https://shorten.asia/Q6hHHg8K'><button class='chat-face'>Ngày tết làm mới đồ dùng phòng ăn phòng bếp </button></a>"
quotes[3] = "<a href='https://shorten.asia/V5a9rcHW'><button class='hotline'>Siêu Sale mùa Tết</button></a>"
randomquote = Math.random() * (quotes.length)
randomquote = Math.floor(randomquote)
document.write(quotes[randomquote])
</script>

</div>

Sau đây là các kiểu quảng cáo tổng hợp

Chèn hình ảnh quảng cáo ngẫu nhiên lên đầu bài viết :

Các bạn tìm đoạn code sau : <data:post.body/>
Chèn phía trên nó đoạn code :

Đoạn code ngẫu nhiên ( Ha1 ) :

<script type='text/javascript'>
quotes2head = new Array()
quotes2head[0] = "<a href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBGW-EGCxhIfwzc0Vn228ZVJ0MNYgP_D-z8jV-FioLGZ2C0mN-x8FGjzljW7TTGl8ClhfupkR7dc_qBzhOzRctm0qM7qFgLd3OjkrjQMzSqpmEnvZat9UMaGr0D3yq8kwfmZdh4fB-MIQ/s1600/Mat-ban-ghe-hoc-sinh-ban-ghe-cafe-ban-ghe-lam-viecOsE858.png'><img alt='Bàn ghế học sinh,bàn ghế cafe' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBGW-EGCxhIfwzc0Vn228ZVJ0MNYgP_D-z8jV-FioLGZ2C0mN-x8FGjzljW7TTGl8ClhfupkR7dc_qBzhOzRctm0qM7qFgLd3OjkrjQMzSqpmEnvZat9UMaGr0D3yq8kwfmZdh4fB-MIQ/s1600/Mat-ban-ghe-hoc-sinh-ban-ghe-cafe-ban-ghe-lam-viecOsE858.png' style='margin-top: 5px;box-shadow: 0px 0px 12px rgba(50, 50, 50, 0.2);width: 100%;margin-bottom: 10px;border: 1px dotted #ccc;'/></a>"
quotes2head[1] = "<a href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYcamAFSlWHQXt1cFaMCqpE276VGWq9ztK0P9wNhcD-iKeozSZ_uU2OCs7biHmri50HEmvyGJmoZGrtkztVKfM8aZji4hd3m7itgmGtPjs6Xscp0S9WoEC8nwmwf8IRoztkoAweog9HdM/s16000/Marketing-banghe-thotgo-remcua.png'><img alt='Bàn ghế, thớt gỗ, rèm cửa marketing online' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYcamAFSlWHQXt1cFaMCqpE276VGWq9ztK0P9wNhcD-iKeozSZ_uU2OCs7biHmri50HEmvyGJmoZGrtkztVKfM8aZji4hd3m7itgmGtPjs6Xscp0S9WoEC8nwmwf8IRoztkoAweog9HdM/s16000/Marketing-banghe-thotgo-remcua.png' style='margin-top: 5px;box-shadow: 0px 0px 12px rgba(50, 50, 50, 0.2);width: 100%;margin-bottom: 10px;border: 1px dotted #ccc;'/></a>"
randomquote2head = Math.random() * (quotes2head.length)
randomquote2head = Math.floor(randomquote2head)
document.write(quotes2head[randomquote2head])
</script>

Chèn hình ảnh quảng cáo ngẫu nhiên lên cuối bài viết :

Tương tự các chèn quảng cáo ngẫu nhiên đầu bài viết các bạn tìm đoạn code sau : <data:post.body/>
Chèn đoạn code ( Ha1 ) phía dưới nó.

Đang tiếp tục cập nhật...