Chèn quảng cáo vào blogspot ở các vị trí
POSTED ON
c
c
hèn quảng cáo vào blogspot (blogger) mới nhất 2017 ở các vị trí từ đơn giản đến phức tạp như đầu trang, cuối trang, bên phải, giữa bài viết. Bài viết này mình sẽ hướng dẫn tổng thể các bạn ở mọi vị trí.
Hướng dẫn chèn quảng cáo vào blogspot này sẽ giải quyết 2 vấn đề khó nhất : là ở giữa và float banner. Đây là những cách chèn quảng cáo nhiều bạn tìm kiếm nhất hiện nay.
1.Chèn quảng cáo bên sidebar.
Đây là việc đơn giản nhất trong chèn quảng cáo. Bạn lấy mã quảng cáo. Vào template blogger. Sau đó thêm 1 widget sidebar html rồi paste vào. Lưu ý, code ở html này giữ nguyên, không convert.
b1: Thêm Gadget.
b2: Chọn kiểu HTML/JavaScript rồi paste code, sau đó save lại.
Nếu bạn muốn chèn 1 cái ảnh vào thì chỉ đơn giản dùng code sau:
<a href=”link bạn muốn đến cho ảnh”><img src=”link ảnh” /></a>
2.Chèn quảng cáo vào blogspot trong bài viết
Chú ý: Code quảng cáo paste trong template của blogspot các bạn nhớ covert Google Adsense code để dùng trong XML template của Blogger.
a. Dưới tiêu đề.
Bạn dùng adsense thì nhớ dùng công cụ này để chuyển đổi:
Cách chuyển đổi rất đơn giản. Bạn vào lấy mã Adsense do Google cung cấp. Sau đó, bạn paste vào ô chứa mã adsense, tiếp tục ấn convert như hình dưới:
Sau đó tìm đoạn code sau:
<div class=’post-header-line-1’/>
– Chèn ngay vào dưới nó đoạn mã sau:
<b:if cond=’data:blog.pageType == “item”‘>
<p class=’ads’>Thêm mã adsense đã convert</p>
</b:if>
Lưu ý rằng đoạn <div class=’post-header-line-1’/> thường lặp lại vài lần ở các template hiện nay. Các bạn nhanh nhất là thử.
b. Giữa bài viết.
Đây là phần khó nhất. Bạn tìm <data:post.body/> rồi thay thế bằng đoạn sau:
<b:if cond=’data:blog.pageType == "item"’>
<div id=’adsense-content’ style=’display:block;text-align: left; padding-top:1px; padding-bottom:10px’>
Thêm mã adsense đã convert
</div></b:if>
<div id=’adsense-target’><data:post.body/>
</div>
<b:if cond=’data:blog.pageType == "item"’>
<script type=’text/javascript’>
function insertAfter(addition,target) {var parent = target.parentNode;if (parent.lastChild == target) {parent.appendChild(addition);} else {parent.insertBefore(addition,target.nextSibling);}}
var adscont = document.getElementById("adsense-content");
var target = document.getElementById("adsense-target");
var linebreak = target.getElementsByTagName("br");
if (linebreak.length > 0){
insertAfter(adscont,linebreak[5]);}
</script></b:if>
</b:if>
Lưu ý: Mã adsense chuyển đổi như trên. 5 là số thứ tự đoạn mã quảng cáo xuất hiện. (5 đoạn văn khác thuộc tính).
c. Chèn dưới mỗi bài đăng.
Rất đơn giản, bạn tìm đúng <data:post.body/> vài lần rồi chèn dưới đoạn kiểu thế này:
<div class=’post-body entry-content’>
<p><data:post.body/></p>
<div style=’clear: both;’/>
</div>
Chèn như sau:
<b:if cond=’data:blog.pageType == “item”‘>
Thêm mã adsense đã convert </b:if>
d.Float banner – banner quảng cáo chạy dọc sidebar:
Các bạn thêm 1 widget ở sidebar, tốt nhất là widget cuối cùng. Sau đó vào html ẩn đi trên di động. Còn nếu các bạn gặp sự cố trên màn hình nhỏ hơn 1024 thì ẩn đi trên @media max-with 1024, tùy template các bạn dùng.Sau đó các bạn chỉ cần dùng đoạn code sau là chèn được quảng cáo, mày đỏ là các phần thay đổi được
<script>
var $stickyHeight = 460; //– đây là chiều cao
var $padding = 5; //
var $topOffset = 1020; //-độ cao từ top xuống- bắt đầu trượt banner- các bạn cứ thử theo là được
var $footerHeight = 200; //– khoảng cách tới kịch chân trang
/* <![CDATA[ */
function scrollSticky(){
if($(window).height() >= $stickyHeight) {
var aOffset = $(‘#sticky’).offset();
if($(document).height() – $footerHeight – $padding < $(window).scrollTop() + $stickyHeight) {
var $top = $(document).height() – $stickyHeight – $footerHeight – $padding – 185;
$(‘#sticky’).attr(‘style’, ‘position:absolute; top:’+$top+’px;’);
}else if($(window).scrollTop() + $padding > $topOffset) {
$(‘#sticky’).attr(‘style’, ‘position:fixed; top:’+$padding+’px;’);
}else{
$(‘#sticky’).attr(‘style’, ‘position:relative;’);
}
}
}
$(window).scroll(function(){
scrollSticky();
});
/* ]]> */
</script>
<div id=”sticky”>
…….(code here)
</div>
3. Kết luận chèn quảng cáo vào blogspot:
Việc chèn quảng cáo vào blogspot ở các vị trí thực ra như mình hồi đầu newbie đơn giản nhất là thử nhiều, sai thì Crl +Z lại. Nhớ làm bình tĩnh và cẩn thận là được.
Nhận xét