Google AdSense and other ads services like AdSense don't work well on a full ajax mode site. So, from 4.4.0 and up, we make a new setting that allows you turn off full ajax mode. Please turn off full ajax mode if this tutorial doesn't work on your site.
This tutorial will work for any type of ad with javascript
As an Admin you can create HTML based ads direct from your AdminCP by creating a new block, choosing HTML as the block type. This is what we will use for our Google ads.
When making your ad at Google, please be sure your code is async.
Original ads code from Google which you can use on your block, with ajax mode disabled, in v4.4 and above:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- myad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="mypub"
data-ad-slot="myadslot"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
In order for the ad to display properly in versions below v4.4, we need to add the $Behavior function as shown below in the last <script> tag.
New code:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- myad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="mypub"
data-ad-slot="myadslot"
data-ad-format="auto"></ins>
<script>
$Behavior.googleads = function(){
(adsbygoogle = window.adsbygoogle || []).push({});
};
</script>
Place the HTML code in the code input area for the new block and set the location (where on the page you want it) and controller (which page should it show on). For our screenshot below of a Google ad, we chose Sitewide as the controller as we want it all over the site.
- Submit the ad and clear cache.
Note for versions below v4.4: If you create more than 1 ads unit, please change "googleads" (in $Behavior.googleads), because this is unique text.