> For the complete documentation index, see [llms.txt](https://nghiaxchis.gitbook.io/ncmaz-nextjs-headless-cms-wordpres-blog-magazine/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://nghiaxchis.gitbook.io/ncmaz-nextjs-headless-cms-wordpres-blog-magazine/ncmaz-faust/integrate-google-adsense-in-nextjs.md). # Integrate Google AdSense in NextJS ### 1 - Sign up for a Google AdSense account Before starting, make sure you have a Google AdSense account. If not, sign up at . ### 2 - Create an AdSense component Create a React component to hold the AdSense ad code. Create a new **`tsx`** file inside the **/components** folder and name it **AdSense.tsx** ***`src/components/AdSense.tsx`*** ```tsx import React, { useEffect } from 'react'; interface AdSenseProps { client: string; slot: string; style?: React.CSSProperties; } const AdSense: React.FC = ({ client, slot, style }) => { useEffect(() => { try { (window.adsbygoogle = window.adsbygoogle || []).push({}); } catch (err) { console.error(err); } }, []); return ( ); }; export default AdSense; ``` ### 3 - Add AdSense script to *`_document.tsx`* Add the AdSense script to inside the *``* tag of the *`src/pages/_document.tsx`* file to ensure it's loaded on every page. **Note:** Replace `ca-pub-XXXXXXXXXXXXXXXX` with your actual AdSense publisher ID. ```tsx // ... other code ... // ... other code ...