Với những ai đã đăng ký Google Adsense thành công rồi thì cũng đều mong muốn là được kiếm thật nhiều tiền, vì vậy việc triển khai mã code quảng cáo Google Adsense vào Blogspot cũng mong đem lại cho các bạn một khoản thu nhập khá.
{tocify} $title={Nội dung bài viết}
Hiện tại bên cạnh loại quảng cáo tự động trong các đơn vị quảng cáo có 3 loại quảng cáo (tài khoản mới)
- 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
Căn cứ vào 3 loại quảng cáo 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 cách lấy mã quảng cáo Google Adsense
Chèn vào các vị trí như đầu trang, hay chân trang, sidebar các bạn chỉ cần lấy mã rồi tại một Widget HTML sau đó dán mã là xong.
Lưu ý: Trước khi thực hiện bạn cần sao lưu mẫu lại, để đề phòng khi có lỗi xảy ra bạn có thể Backup mẫu lại như ban đầu để tránh tình trạng mất mẫu của bạn.{alertError}
Chèn mã quảng vào giữa các bài viết tại trang chủ
Các bạn vào chỉnh sửa mẫu 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>{codeBox}
Trong đó các số 3 và 6 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>{codeBox}
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ái này đơn giản các bạn chỉ cầ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 dấu 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>{codeBox}
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>{codeBox}
Chèn dưới chân bài viết
Cũng đơn giản các bạn chỉ cầ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>{codeBox}
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>{codeBox}
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 mẫu 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>{codeBox}
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>{codeBox}
- Đ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>{codeBox}
-> Bạn cũng có thể tham khảo Tổng hợp các thẻ điều kiện Blogspot mới nhất để có thể tối ưu hiển thị mã quảng cáo một cách tốt nhất.
