Search code examples
bloggeradsense

Adsense responsive ad unit bug in Blogger

I have problem in Blogger with the responsive ad of adsense
I followed the instructions of AdSense Help
I used this code to show an advertisement on desktop view only:

<style>
@media(min-width: 961px) { .ad-test1 { width: 100%; height: 90px; } }
‎</style>‎
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ad-test1 -->
<ins class="adsbygoogle ad-test1"
     style="display:inline-block"
     data-ad-client="ca-pub-ZZZZZ"
     data-ad-slot="XXXXX"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
<‎/script>

And this is the original code from Adsense's help:

<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="//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>

https://support.google.com/adsense/answer/6307124?hl=iw
The problem is that For some reason when I embed the code, after I save and re-check the code it multiplies the extension of the end of my code
It double the end of </script> to ‎</script>‎‎</script>‎ after I saved and re-check.
for example, this is how its show the code after I saved and recheck:

<style>
@media(min-width: 961px) { .ad-test1 { width: 100%; height: 90px; } }
‎</style>‎
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ad-test1 -->
<ins class="adsbygoogle ad-test1"
     style="display:inline-block"
     data-ad-client="ca-pub-ZZZZZ"
     data-ad-slot="XXXXX"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
<‎/script><‎/script>

Why is this happening?

Solution

  • The problem is with a hidden Unicode character &lrm; present in the closing script tag at the end of the example code of Hebrew language version of the AdSense help page. This causes the Blogger's HTML parser to assume that the script tag was not closed and it adds a closing script tag from its own end.

    invisible unicode character

    To resolve this issue, use the following code -

    <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="//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>

    Or get the example code from the English language version of the AdSense help page - https://support.google.com/adsense/answer/6307124?hl=en