Cách chèn quảng cáo AdSense vào Blogspot hiển thị tại các phần khác nhau


Các loại quảng cáo trong AdSense các đơn vị quảng cáo có 3 loại quảng cáo

Quảng cáo văn bản và quảng cáo hiển thị hình ảnh
Quảng cáo trong nguồn cấp dữ liệu
Quảng cáo trong bài viết

Với 3 loại quảng cáo ta có thể bố trí tại các trang như sau:

Quảng cáo văn bản và quảng cáo hiển thị hình ảnh

Đầu trang chèn trong widget ngay dưới menu lấy kích thước 970x90 sau khi lấy mã sửa 970px thành 100%
Sidebar chèn trong widget loại hiển thị biểu ngữ dọc, đáp ứng và kích thước tùy chỉnh

Quảng cáo trong nguồn cấp dữ liệu

Chèn vào giữa các bài viết tại trang chủ tùy vào thiết kế mà lấy loại hiển thị phù hợp

Quảng cáo trong bài viết

Chèn trong bài viết dưới tiêu đề, dưới dấu ngắt nháy, vào một vị trí bất kỳ có thể canh giữa bài, dưới chân bài viết, tùy vào thiết kế mà lấy loại hiển thị phù hợp

Hướng dẫn chèn mã quảng cáo

Hướng dẫn chèn mã quảng vào giữa các bài viết tại trang chủ

Ngoài trang chủ các bạn có thể chèn mã quảng vào các trang khác thuộc nhóm trang index, phương pháp này sẽ đặt điều kiện trong vòng lặp các bài viết

Các bạn vào chỉnh sửa mẫu Template chọn chuyển đến tiện ích Blog1 chọn mở rộng cặp thẻ tag <b:includable id='main'> các bạn thêm index='item' vào trong thẻ lặp <b:loop values='data:posts' var='post'> thành <b:loop index='item' values='data:posts' var='post'>

Tiếp theo ngay dưới thẻ lặp b:loop này các bạn thêm đoạn code sau :

<b:if cond='data:view.isMultipleItems'>
  <b:if cond='data:item==3'>
    <div class='post'>
      <!-- Mã quảng cáo AdSense -->
    </div>
  </b:if>
  <b:if cond='data:item==6'>
    <div class='post'>
      <!-- Mã quảng cáo AdSense -->
    </div>
  </b:if>
</b:if>

Trong đó các số 36 là vị trí hiện thị quảng cáo sau bài viết thứ 3 và bài viết thứ 6, nếu trang chủ có nhiều bài chẳng hạn 20 thì các bạn thay đổi vị trí cho hù hợp chẳng hạn sau các bài 5, 10, 15

<b:if cond='data:view.isMultipleItems'>
  <b:if cond='data:item==5'>
    <div class='post'>
      <!-- Mã quảng cáo AdSense -->
    </div>
  </b:if>
  <b:if cond='data:item==10'>
    <div class='post'>
      <!-- Mã quảng cáo AdSense -->
    </div>
  </b:if>
  <b:if cond='data:item==15'>
    <div class='post'>
      <!-- Mã quảng cáo AdSense -->
    </div>
  </b:if>
</b:if>


Hướng dẫn chèn mã quảng cáo vào bài viết

Các bạn có thể chèn mã quảng cáo dưới tiêu đề (không khuyến khích), dưới dấu ngắt nháy, vào một vị trí bất kỳ có thể canh giữa bài, dưới chân bài viết

- Chèn dưới tiêu đề: Các bạn tìm thẻ tiêu đề <h1> nó thường nằm trong cặp thẻ <b:includable id='post' var='post'> chèn mã quảng cáo ngay dưới nó


Chèn dưới ngắt trang (ngắt nhảy)

Phần này ít bạn để ý chèn dấu ngắt nháy hoặc có bài chèn có bài quên không chèn nhưng không sao bạn vẫn có thể chèn mã quảng cáo bên dưới nếu bài mà bạn thêm dấu ngắt thì quảng cáo hiển thị ngay dưới còn bài không chèn thì không hiển thị quảng cáo.

Các bạn chèn đoạn mã sau ngay dưới thẻ <data:post.body/>

<div class='adsense1'>
  <div id='ads_Code'>
    <!-- Mã quảng cáo AdSense -->
  </div>
</div>

Tiếp tục chèn đoạn script sau trước </body>

<script>//<![CDATA[
$(function() {
  var more = $('a[name="more"]')
  if (more) {
    $('#ads_Code').appendTo(more)
  } else {
    $('.adsense1').empty()
  }
})
//]]></script>

Chèn Quảng Cáo dưới chân bài viết

Các bạn chèn mã quảng cáo ngay trước <div class='post-footer'></div> hoặc ngay dưới thẻ <data:post.body/> đều như nhau vì thẻ này luôn nằm trên post-footer

Chèn vào một vị trí bất kỳ

Cách này các bạn chèn id vào vị trí muốn hiển thị quảng cáo có thể giữa bài như sau:

Chèn đoạn code sau ngay dưới thẻ <data:post.body/>

<div class='adsense2'>
  <div id='ads_Body'>
    <!-- Mã quảng cáo AdSense -->
  </div>
</div>

Tiếp tục chèn đoạn script sau trước </body>

<script>//<![CDATA[
$(function() {
  var ads = document.getElementById('AdSense')
  if (ads) {
    $('#ads_Body').appendTo(ads)
  } else {
    $('.adsense2').empty()
  }
})
//]]></script>

Khi viết bài mới hoặc sửa lại bài cũ các bạn cần thêm đoạn code <div id="AdSense"></div> vào vị trí muốn hiển thị bên khung soạn thảo HTML của bài viết

Yêu cầu trong template cần có thư viện jquery cái này đa số Blog đều có các bạn kiểm tra nếu không thấy thì chèn trước </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>

Ngoài ra các bạn cũng nên sử dụng điều kiện cho mobile như sau:

- Điều kiện chỉ tải mã trên mobile (?m=1)

<b:if cond='data:blog.isMobileRequest'>
  <!-- Mã quảng cáo AdSense -->
</b:if>


- Điều kiện không tải trên mobile (?m=1)

<b:if cond='!data:blog.isMobileRequest'>
  <!-- Mã quảng cáo AdSense -->
</b:if>

Chúc Bạn Thành Công!




Đánh giá bài viết

Cảm ơn bạn đã đọc bài viết!

  • Mọi thắc mắc, gợi ý hoặc Báo link hỏng xin chia sẻ bên dưới hoặc Gửi Tin Nhắn
  • Không chèn liên kết quảng cáo, spam khi đăng nhận xét.
  • Không sử dụng những từ ngữ thô tục, vi phạm thuần phong mỹ tục.

Bình luận bài viết này!