---
title: "Google Adsense"
description: "Show Google Adsense ads in your Nuxt app."
canonical_url: "https://scripts.nuxt.com/scripts/google-adsense"
last_updated: "2026-05-03T02:50:04.292Z"
---

[Google AdSense](https://www.google.com/adsense/start/) allows you to monetize your website by displaying relevant ads from Google.

Nuxt Scripts provides:

- [`useScriptGoogleAdsense()`](/scripts/google-adsense): A composable to manage Google AdSense dynamically.
- `<ScriptGoogleAdsense>`: A headless component to embed ads directly in your Nuxt app.

<script-stats>



</script-stats>

<script-docs>



</script-docs>

## Where to Find `<your-id>` (Publisher ID)

Find your **Google AdSense Publisher ID** (also known as `ca-pub-XXXXXXX`) in your **Google AdSense Account**:

1. Log in to your **Google AdSense** account.
2. Navigate to **Account > Settings** (click on your profile icon > "Account information").
3. Locate the **Publisher ID** under **Account Information**.
4. Replace `<your-id>` in the config above with your actual ID.

<callout icon="i-heroicons-light-bulb" target="_blank" to="https://adsense.google.com/start/">

You can also manage **Auto Ads settings** from your **Google AdSense Dashboard** to control *ad types, placements, and revenue optimization*.

</callout>

## Site Ownership Verification

### Automatic Meta Tag Insertion

If you provide a `client`, Nuxt automatically inserts a **meta tag** on the page for Google to verify your site ownership.

<tabs>
<div icon="i-heroicons-code-bracket-square" label="Example">

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  scripts: {
    registry: {
      googleAdsense: {
        client: 'ca-pub-<your-id>', // AdSense Publisher ID
      },
    },
  },
})
```

</div>

<div icon="i-heroicons-magnifying-glass-circle" label="Output">

```html
<meta name="google-adsense-account" content="ca-pub-<your-id>" />
```

</div>
</tabs>

### Using `ads.txt` for Verification

Google recommends adding an `ads.txt` file for **ad revenue eligibility**.

#### Steps:

1. Create a new file: `public/ads.txt`
2. Add the following content:
```plaintext
google.com, pub-<your-id>, DIRECT, f08c47fec0942fa0
```
3. Replace `<your-id>` with your **AdSense Publisher ID**.

<callout icon="i-heroicons-light-bulb">

**Why use ads.txt?** It helps **prevent ad fraud** and ensures that **only your site** can display your ads.

</callout>

## Enabling Auto Ads

Auto Ads allow Google to **automatically** place ads for **better optimization**.

<tabs>
<div icon="i-heroicons-code-bracket-square" label="Example">

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  scripts: {
    registry: {
      googleAdsense: {
        client: 'ca-pub-<your-id>', // AdSense Publisher ID
        autoAds: true, // Enable Auto Ads
      },
    },
  },
})
```

</div>

<div icon="i-heroicons-magnifying-glass-circle" label="Output">

```html
<script>
(adsbygoogle = window.adsbygoogle || []).push({
  google_ad_client: "ca-pub-<your-id>",
  enable_page_level_ads: true,
});
</script>
```

</div>
</tabs>

## Using [`<ScriptGoogleAdsense>`](/scripts/google-adsense) Component

It provides a simple way to **embed ads** in your Nuxt app.

```vue
<template>
  <ScriptGoogleAdsense
    data-ad-client="ca-pub-<your-id>"
    data-ad-slot="1234567890"
    data-ad-format="auto"
  />
</template>
```

### Component Props

<table>
<thead>
  <tr>
    <th>
      Prop
    </th>
    
    <th>
      Description
    </th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>
      <code>
        data-ad-client
      </code>
    </td>
    
    <td>
      Your <strong>
        Google Adsense Publisher ID
      </strong>
      
      (<code>
        ca-pub-XXXXXXXXXX
      </code>
      
      ).
    </td>
  </tr>
  
  <tr>
    <td>
      <code>
        data-ad-slot
      </code>
    </td>
    
    <td>
      Your <strong>
        Ad Slot ID
      </strong>
      
       (available in AdSense dashboard).
    </td>
  </tr>
  
  <tr>
    <td>
      <code>
        data-ad-format
      </code>
    </td>
    
    <td>
      Ad format type (<code>
        auto
      </code>
      
      , <code>
        rectangle
      </code>
      
      , <code>
        horizontal
      </code>
      
      , <code>
        vertical
      </code>
      
      , <code>
        fluid
      </code>
      
      , <code>
        autorelaxed
      </code>
      
      ).
    </td>
  </tr>
  
  <tr>
    <td>
      <code>
        data-ad-layout
      </code>
    </td>
    
    <td>
      Layout (<code>
        in-article
      </code>
      
      , <code>
        in-feed
      </code>
      
      , <code>
        fixed
      </code>
      
      ).
    </td>
  </tr>
  
  <tr>
    <td>
      <code>
        data-full-width-responsive
      </code>
    </td>
    
    <td>
      <strong>
        Set to <code>
          true
        </code>
      </strong>
      
       to make the ad responsive.
    </td>
  </tr>
</tbody>
</table>

#### Example Usage with `data-ad-layout`

To specify a layout for your ads (such as "in-article"), you can use the `data-ad-layout` attribute:

```vue
<template>
  <ScriptGoogleAdsense
    data-ad-client="ca-pub-<your-id>"
    data-ad-slot="1234567890"
    data-ad-format="fluid"
    data-ad-layout="in-article"
  />
</template>
```

## How to Handle Ad-Blockers?

If a user has an **ad-blocker enabled**, you can show **fallback content**.

```vue
<template>
  <ScriptGoogleAdsense data-ad-client="ca-pub-..." data-ad-slot="...">
    <template #error>
      <!-- Fallback content -->
      <p>Please support us by disabling your ad blocker.</p>
    </template>
  </ScriptGoogleAdsense>
</template>
```

## Using [`useScriptGoogleAdsense()`](/scripts/google-adsense) Composable

The [`useScriptGoogleAdsense()`](/scripts/google-adsense) composable allows **fine-grain control** over the AdSense script.

```ts
export function useScriptGoogleAdsense<T extends GoogleAdsenseApi>(
  _options?: GoogleAdsenseInput
) {}
```

See the [Registry Scripts Guide](/docs/guides/registry-scripts) for advanced usage.

<callout icon="i-heroicons-light-bulb" target="_blank" to="https://support.google.com/adsense">

Need more help? Check out the official **Google AdSense Guide**

</callout>

<script-types>



</script-types>