Tự điều chỉnh kích thước quảng cáo đáp ứng Google Adsense

Lấy ví dụ cho bạn dễ hình dung nhé. Bạn đặt quảng cáo Google Adsense trên website, blog của bạn với kích thước lớn 728×90 thì khi truy cập bằng máy tính bảng, iPad kích thước quảng cáo adsense sẽ tự động thay đổi thành 468×60 cho phù hợp. 

Truy cập bằng di động thì kích thước có thể thay đổi 320×250 hoặc nhỏ hơn sẽ tùy vào độ phân giải thiết bị di động của bạn..

Do vậy mình sẽ chia sẻ đoạn code Google adsense có kết hợp các điều kiện để tự resize kích thước quảng cáo để thực hiện mục đích này này

<div id=”google-ads-1″></div>
<script type=”text/javascript”>
/* Calculate the width of available ad space */
ad = document.getElementById(‘google-ads-1’);
if (ad.getBoundingClientRect().width) {
adWidth = ad.getBoundingClientRect().width; // for modern browsers
} else {
adWidth = ad.offsetWidth; // for old IE
}
/* Thay ca-pub-XXX thành AdSense Publisher ID của bạn nhé*/
google_ad_client = “ca-pub-XXX“;
/* Thay dãy số 1234567890 thành AdSense Ad Slot ID của quảng cáo bạn nhé */
google_ad_slot = “1234567890“;
/* Do not change anything after this line */
if ( adWidth >= 728 )
google_ad_size = [“728”, “90”]; /* Leaderboard 728×90 */
else if ( adWidth >= 468 )
google_ad_size = [“468”, “60”]; /* Banner (468 x 60) */
else if ( adWidth >= 336 )
google_ad_size = [“336”, “280”]; /* Large Rectangle (336 x 280) */
else if ( adWidth >= 300 )
google_ad_size = [“300”, “250”]; /* Medium Rectangle (300 x 250) */
else if ( adWidth >= 250 )
google_ad_size = [“250”, “250”]; /* Square (250 x 250) */
else if ( adWidth >= 200 )
google_ad_size = [“200”, “200”]; /* Small Square (200 x 200) */
else if ( adWidth >= 180 )
google_ad_size = [“180”, “150”]; /* Small Rectangle (180 x 150) */
else
google_ad_size = [“125”, “125”]; /* Button (125 x 125) */
document.write (
‘<ins class=”adsbygoogle” style=”display:inline-block;width:’
+ google_ad_size[0] + ‘px;height:’
+ google_ad_size[1] + ‘px” data-ad-client=”‘
+ google_ad_client + ‘” data-ad-slot=”‘
+ google_ad_slot + ‘”></ins>’
);
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<script async src=”http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”>
</script>

Việc cần làm của bạn là chèn đoạn code vào website của mình, nhớ thay đổi dòng chữ mà mình đã đánh dấu màu đỏ thành ID đơn vị quảng cáo và nhà xuất bản của bạn nhé!!

Lưu ý: Nếu bạn đang dùng Blogger mà chèn trực tiếp vào HTML luôn thì cần mã hóa code quảng cáo Google Adsense để không bị lỗi.