[Support request] Adsense responsive width outside main content

[Ruben]

Hi

I am trying the adsense responsive ads. The problem is the adverts fill more than the main content width. It creates a horizontal scrolling in my page.

I guess I would need to add a site css limiting the width? But I am not sure how to add it.

I attach an image

Image: https://imgur.com/CPAqZgG

[David]

Hi there,

how are the ads being added to your content ?
Can you share a link to the site so i can see the issue ?

[Ruben]

I used wpquads plugin. Just place the ads between paragraphs.

https://www.dinerowin.com/ganar-dinero-pinterest/

Although, if you visit the page probably will not see the ads as I said because adsense shows different ad sizes depending each time. But, for example, after paragraph 9 I have a responsive ad and sometimes adsense introduces a huge size that goes outide the content on the right side.

First and paragraph ads are responsive, sometimes show a small (728x), sometimes a big one (+1000x and shown outside main content)

Thanks

[David]

The theme cannot control what size google serves up for an advert.
It should serve one that fits the container the advert is displayed in.

Maybe try setting a max-width to the container it sits within using this CSS:

.quads-location {
    max-width: 925px;
}

[Ruben]

Hi

Thank you.

Although, it did not seem to work. I loaded the site and still the responsive ads sometimes too big and going outside of main container.

I tried also this suggested by adsense but did not work either:

<style>
.example_responsive_1 { width: 320px; height: 100px; }
@media(min-width: 500px) { .example_responsive_1 { width: 468px; height: 60px; } }
@media(min-width: 800px) { .example_responsive_1 { width: 728px; height: 90px; } }
</style>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- example_responsive_1 -->
<ins class="adsbygoogle example_responsive_1"
     style="display:inline-block"
     data-ad-client="ca-pub-XXXXXXX11XXX9"
     data-ad-slot="8XXXXX1"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

[Tom]

The theme itself isn’t in control of this, unfortunately, as the ads are being serviced via an iframe.

Google does have responsive ads that automatically detect the width they need to be – perhaps the plugin you’re using to add them is conflicting? What happens if you add a responsive ad into an HTML block (without using the plugin)?

[Ruben]

Hi

I tried with another similar plugin, advancedads and did not work either.

Also tried with a hook using elements as you suggested. After some time and several pageviews, it seems it does not work either. Still the random advert goes beyond the main content on the right side.

Very strange.

I will probably use a bigger layout for main content for now.

Thanks

[Tom]

Make sure you’re using the responsive ad unit – its entire purpose is to fit inside the container it’s added to.

[Author]

Posts