4

I'm in the middle of a project building a website for a family takeaway, I've managed to get the core design right for what I want. I now have a problem displaying adsense within my website.

I receive a message in console

Uncaught Error: adsbygoogle.push(): All ins elements in the DOM with class=adsbygoogle already have ads in them.

please take a look at the website http://tastygrillbristol.uk

          </style> 
      <core-drawer-panel transition id="core_drawer_panel" touch-action>
        <section id="section" drawer>
          <core-header-panel mode="standard" id="core_header_panel">
            <core-toolbar id="core_toolbar">
              <div id="div">Menu</div>
            </core-toolbar>
            <section id="section2">
              <core-menu selected="0" id="core_menu">
                  <core-item id="core_item7" icon="home" label="Home" horizontal center layout><a href="../index.html"></a></core-item>
                  <core-submenu id="core_submenu" icon="list" label="Online Menu">
                    <core-item id="core_item" label="Special Offers" horizontal center layout><a href="../menu.html"></a></core-item>
                    <core-item id="core_item" label="Everything" horizontal center layout><a href="../menu.html"></a></core-item>
                  <core-item id="core_item" label="Burgers" horizontal center layout><a href="../menuburgers.html"></a></core-item>
                  <core-item id="core_item1" label="Kebabs" horizontal center layout><a href="../menu.html"></a></core-item>
                  <core-item id="core_item2" label="Doners" horizontal center layout><a href="../menu.html"></a></core-item>
                  <core-item id="core_item3" label="Pizzas" horizontal center layout><a href="../menu.html"></a></core-item>
                </core-submenu>
                <core-item id="core_item4" icon="shopping-cart" label="Deliver to you" horizontal center layout><a href="../delivery.html"></a></core-item>
                <core-item id="core_item5" icon="perm-phone-msg" label="Call us" horizontal center layout><a href="../callus.html"></a></core-item>
                <core-item id="core_item6" icon="file-map" label="Find us" horizontal center layout><a href="../findus.html"></a></core-item>
                                  <core-item id="core_item6" icon="favorite" label="Follow us" horizontal center layout ><a href="../followus.html"></a></core-item>
              </core-menu>
            </section>
          </core-header-panel>
        </section>
        <section id="section1" main>
          <core-scroll-header-panel condenses id="core_scroll_header_panel" headerHeight="256" condensedHeaderHeight="64">

            <core-toolbar class="tall" id="core_toolbar1">
              <paper-icon-button core-drawer-toggle id="navicon" icon="menu"></paper-icon-button>
              <div flex></div>
        <div horizontal center-justified layout class="bottom indent title" > <p><b><font color=#FF1744>Tasty Grill</font></b></p> </div> 

            </core-toolbar>

              <div class="content" horizontal layout center>    

        <post-card1> 

            <div align="center"><h2 align="center">WELCOME TO OUR WEBSITE, BARE IN MIND WE'RE STILL UNDER CONSTRUCTION</h2><p align="center">Take a look at our online Menu by pressing the Burger <core-icon icon="menu"></core-icon> Button above, or if you know exactly what you want call us now on <p><b><a href="tel:01179522233">(0117)9522233</a></b></p></p></div>


      </post-card1></div>

        <section class="section1" horizontal center-justified layout>

<h1>ADSENSE CODE GOES HERE</h1>

</core-header-panel>
          </core-scroll-header-panel>
        </section>
      </core-drawer-panel>
            </template>        
Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
  • 1
    Can you please add some source code? I don't know about AdSense. Do you need to add a specific tag to make the AdSense script work? Did you add this tag inside a Polymer element or somewhere in the entry page (`index.html`)? – Günter Zöchbauer Jan 21 '15 at 17:31
  • Hello Günter, I've added some Code the best way I Could - Let me know if that doesn't help... Yes I need to add specific Code that Google provided to the HTML, I've added into the entry page rather than a Polymer Element. Do you think I should have added it into the Polymer Element instead? – Ali Hussan Ahmed Jan 22 '15 at 14:25
  • In the source of the linked page it looks like you added the Adsense scripts inside ``. I assume that the Adsense code is not compatible with shadow DOM and therefore fails with an error. Try adding it outside of the Polymer element (directly to the entry page). – Günter Zöchbauer Jan 22 '15 at 16:02
  • Hi Günter, sorry for the massive delay - I haven't had a huge amount of time to look at this lately.. If I put the Adsense code out outside of the Polymer Elements it will display, there is something within polymer stopping this from working. – Ali Hussan Ahmed Jan 27 '15 at 13:03
  • Polymer elements introduced shadow DOM. The HTML inside the elements `` is hidden from the outside. Special syntax is necessary for JavaScript/Dart and CSS to get access to elements hidden in shadow DOM. This causes problems with many legacy libraries/frameworks (but is the right direction nonetheless to ensure encapsulation). You can investigate in Chrome devtools (you might need to enable shadow DOM in devtools settings first). – Günter Zöchbauer Jan 27 '15 at 13:05
  • Hey @AliHussanAhmed, I just looked at your website and it seems to work for your site (at least I see adsense elements). Obviously you use the polymer element google-adsense. I tried that too, but got no success. May you shortly update your question with your way to solve the problem? – Jokus Apr 02 '15 at 13:08
  • Hi @Jokus, can you show me your code - I'll have a look or tell me what errors you get in console.. – Ali Hussan Ahmed Apr 04 '15 at 09:52
  • My Google-Adsense element always throws the error "Uncaught Error: adsbygoogle.push(): All ins elements in the DOM with class=adsbygoogle already have ads in them." I just made a Issue Report to the element (https://github.com/kessiler/google-adsense/issues/1). I think it happens because this element generates the adsense-element in the shadowDOM and can't be found by the script... – Jokus Apr 04 '15 at 11:34
  • Obviously the library is not compatible with shadow DOM. Please create a bug report in the libraries issue tracker and please post the link to the issue here after you created it as reference for others. – Günter Zöchbauer Jan 27 '15 at 13:08

1 Answers1

-3

Just tested today (2017-05-05) the Ads is working fine within element (Polymer 1), no warnings, following is the sample code:

<paper-card>
    <div class="card-content">
    <p>my content here</p>
    <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    <!-- AutoSize -->
    <ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-000000000"
     data-ad-slot="000000000"
     data-ad-format="auto"></ins>
    <script>
    (adsbygoogle = window.adsbygoogle || []).push({});
    </script>
    </div>
</paper-card>
user7180
  • 3,756
  • 2
  • 22
  • 26