CODEWITHSUNDEEP
javascriptjquerycookiesadsensecookieconsent
Michael Joseph
Michael Joseph

Reputation: 135

How To Make Adsense Load When Cookie Consent Given?

The website is set up to opt in for cookie consent but when a first time visitor clicks the accept cookies button the adsense code does not load unless the whole page is refreshed.

Is there a way to achieve loading ads once the cookie acceptance button is clicked instead of having to refresh the whole page?

Using this cookie consent jquery plug: IHaveCookies

This is part of the code I am using that allows adsense to load:

    $(document).ready(function() {
    $('body').ihavecookies(options);

if ($.fn.ihavecookies.preference('ads') === true) {
    var src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
    var newScript = document.createElement("script");
    newScript.type = "text/javascript";
    newScript.setAttribute("async", "true");
    newScript.setAttribute("src", src);
    document.body.appendChild(newScript);
}

The above code does work but it does not allow ads to appear until after page refresh. Is it possible to add a "refresh" attribute to the above code to make the ads load on "ihavecookies.preference('ads') === true)" without page refresh?

The website where I've implemented this can be viewed Here

fyi.... currently no ads are loading for EU or Californian visitors (but this is a separate issue not to be addressed with this topic)

Upvotes: 3

Views: 4295

Answers (3)

human
human

Reputation: 471

This is amazing thanks a lot! It you then host adsbygoogle.js localy no illegal connection to the USA will be made before the user accepted it.

 <script async src="adsbygoogle.js"></script>
 <script>(adsbygoogle=window.adsbygoogle||[]).pauseAdRequests=1;</script>

In Germany even loading google fonts from the US without the users permission seems to be illegal now: https://www.itmagazine.ch/artikel/76437/Deutsches_Gericht_erklaert_Einbindung_von_Google_Fonts_als_rechtswidrig.html

Here is a way to load Analytics only if allowed: https://stackoverflow.com/a/45838784/12668719

Update: I have tested it, unfortunately it still connects to the USA Unfortunately it still connects to the USA

Any other idea? Loading Google Adsense, Analytics and Youtube only when consent is given

Update: Dynamicly loading Google Adsense after consent OK: setTimeout("adsenseladen()", 1);

 <script type="text/javascript">
 function adsenseladen() {
 var script = document.createElement('script');
 script.type = 'text/javascript';
 script.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
 document.body.appendChild(script);
 }
 </script>


 <ins class="adsbygoogle"
 style="display:block"
 data-ad-client="ca-pub-##########"
 data-ad-slot="##########"
 data-ad-format="auto"
 data-full-width-responsive="true"></ins>

 <script>
 (adsbygoogle = window.adsbygoogle || []).push({});
 </script>

Upvotes: 1

yenren
yenren

Reputation: 522

Not directly related to the plugin you're using, but my answer will hopefully lead you in the right direction. Firstly, there are two AdSense Help pages that you may find helpful:

Ads personalization settings in Google’s publisher ad tags: https://support.google.com/adsense/answer/7670312

Ad code examples for ads personalization settings: https://support.google.com/adsense/answer/9042142

I'm using my custom cookie consent solution with AdSense (I use Auto Ads with non-personalized option) and here is what I am doing:

1. I put the following code between <head> tags, on pages where Ads will be displayed:

EDIT: Add the following to your page only if/after consent is given. (Thanks to @Avatar)

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>(adsbygoogle=window.adsbygoogle||[]).pauseAdRequests=1;</script>

This loads the AdSense JS file, but pauses ad loading, hence does not place any cookies.

2. In my JS file where I control displaying/hiding consent banner, I put the following code to these actions: a) user gives consent by clicking OK, b) new page load if consent was given previously:

(adsbygoogle=window.adsbygoogle||[]).requestNonPersonalizedAds=1;
(adsbygoogle=window.adsbygoogle||[]).pauseAdRequests=0;
(adsbygoogle=window.adsbygoogle||[]).push({google_ad_client:'ca-pub-YOUR-ADSENSE-ID',enable_page_level_ads:true});

If you are using personalized ads, you can remove first line.

Ads are not loaded in other cases (e.g., user does nothing, user clicks REJECT, new page load where user has rejected before). I do place a cookie to keep track of rejection, so that the consent banner is not displayed at each page load.

Upvotes: 9

Avatar
Avatar

Reputation: 15194

One of the easiest ways:

  1. Change all adsense script tags to type="text/plain"
  2. After the visitor accepts the cookies, change the type to type="text/javascript"
  3. Execute the code

You also want to store the cookie accept so the next time the adsense can be triggered right away.


See also:

Upvotes: 4

Related Questions