shriekdj / nextjs13_google_adsense

Google Adsense package for working into the nextjs 13 and above.

nextjs13_google_adsense

This Package Helps reload ad on Every Page change in the nextjs 13 application and above.

Before using this package add this code in head of your root layout file.

<Script
  async
  src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456"
  crossOrigin="anonymous"
  strategy="lazyOnload"
/>

From Google You May Get this type code for ad unit which should be changed.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>
<!-- Homepage Leaderboard -->
<ins class="adsbygoogle" style="display:inline-block;width:728px;height:90px" data-ad-client="ca-pub-1234567890123456" data-ad-slot="1234567890"></ins>
<script>
(window.adsbygoogle = window.adsbygoogle || []).push({});
</script>

It should be changed to like this in your page

import GoogleAdUnit from 'nextjs13_google_adsense'

export default function MyPage() {
  return <>
  <div>Test Title</div>
  <GoogleAdUnit>
    <ins
          className="adsbygoogle"
          style={{ display: 'block', width: '100%' }}
          data-ad-client="ca-pub-1234567890"
          data-ad-slot="123456"
          data-ad-format="auto"
          data-full-width-responsive="true"
        ></ins>
  </GoogleAdUnit>
  <div>Test Content</div>
  <>;
}

If any errors occured then errors will be displayed on client or your browser's console.

nextjs13_google_adsense's Issues

Does this code work for next 14

Ads shows only on first page load

Thank you for your google adsense package. I am suing the package in Next js 14 and everything works fine except it only works on first page load. I have it installed on the home page (/app/page.js). However, when I navigate away from the home page and come page, the Ads do no show anymore.