Display Ads with AJAX

When implementing ads in an AJAX-powered Thesis theme, you need to properly handle ad initialization after page transitions. Here’s how to set up Google AdSense, though similar principles apply to other ad networks.

Add AdSense Script

First, add the Google AdSense script to your site’s head section:

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-XXXXXXX"></script>

Place Ad Units

Next, place the ad unit code where you want the advertisement to appear. This will require customizing your theme templates:

<ins class="adsbygoogle"
  style="display:block"
  data-ad-client="ca-pub-XXXXXXX"
  data-ad-slot="XXXXXXXXXX"
  data-ad-format="auto"></ins> 

Initialize Ads

Finally, add this JavaScript code to handle ad initialization after AJAX navigation:

<script>
  window.ivent.on(document, 'ready pvs.navigation.content-rendered', () => {
    if ( document.querySelector('ins:empty') ) {
      (window.adsbygoogle = window.adsbygoogle || []).push({});
    }
  });
</script>