How do you use multiple adsense units on one page?

Marwelln picture Marwelln · Aug 2, 2014 · Viewed 25.1k times · Source

How do you have multiple adsense units on one website? The only code Google gives are per unit.

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-123456"
     data-ad-slot="123456"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

What if I want to use multiple adsense units on one website? I only use <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> and (adsbygoogle = window.adsbygoogle || []).push({}); once, and then place the <ins ...></ins> code where I want it to be.

The problem is that only the first adsense unit is parsed and shown. What do you need to do to be able to display more than one adsense unit?

This is how I use it (only first ins is shown):

<!doctype html>
<html>
    <body>
        <ins class="adsbygoogle"
         style="display:inline-block;width:300px;height:250px"
         data-ad-client="ca-pub-123456"
         data-ad-slot="first"></ins>

         <ins class="adsbygoogle"
         style="display:inline-block;width:300px;height:250px"
         data-ad-client="ca-pub-123456"
         data-ad-slot="second"></ins>

         <ins class="adsbygoogle"
         style="display:inline-block;width:300px;height:250px"
         data-ad-client="ca-pub-123456"
         data-ad-slot="third"></ins>

        <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
        <script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
    </body>
</html>

Answer

Marwelln picture Marwelln · Aug 2, 2014

To have more then one adsense unit on one page you must add more rows of (adsbygoogle = window.adsbygoogle || []).push({});.

So if you have 3 ad units, you want to use it 3 times.

(adsbygoogle = window.adsbygoogle || []).push({});
(adsbygoogle = window.adsbygoogle || []).push({});
(adsbygoogle = window.adsbygoogle || []).push({});

If you want to do it dynamically, use this:

[].forEach.call(document.querySelectorAll('.adsbygoogle'), function(){
    (adsbygoogle = window.adsbygoogle || []).push({});
});