Web制作2026.05.31
Google AdSense審査前に準備すること｜ads.txt・広告枠・CMP対応
Google AdSense審査前に準備すること｜ads.txt・広告枠・CMP対応
個人サイト制作シリーズ この記事は「Next.jsで個人ブログ兼Webツールサイトを1から作る」連載の一部です。
初めての人でも順番に進められるよう、前提知識をできるだけ省き、つまずきやすいポイントもあわせて整理しています。
個人サイトを作ったら、次に考えたいのが広告収益化です。Google AdSenseは代表的な選択肢ですが、広告コードを貼ればすぐに完了、というわけではありません。
AdSenseコードを設置する
Next.jsでは外部スクリプトに next/script を使うことがあります。ただし、AdSenseでは次のような警告が出る場合があります。
AdSense head tag doesn't support data-nscript attribute.
その場合は、app/layout.tsx の <head> に通常の <script> として設置します。
<head>
<script
async
src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-XXXXXXXXXXXX"
crossOrigin="anonymous"
/>
</head>
広告枠コンポーネントを作る
"use client";
import { useEffect } from "react";
declare global {
interface Window {
adsbygoogle?: unknown[];
}
}
const enableAds = process.env.NEXT_PUBLIC_ENABLE_ADS === "true";
export function AdBanner() {
useEffect(() => {
if (!enableAds) return;
try {
window.adsbygoogle = window.adsbygoogle || [];
window.adsbygoogle.push({});
} catch {}
}, []);
if (!enableAds) {
return <div className="min-h-[250px]">AD SPACE</div>;
}
return (
<ins
className="adsbygoogle"
style={{ display: "block", minHeight: "250px" }}
data-ad-client="ca-pub-XXXXXXXXXXXX"
data-ad-slot="広告ユニットID"
data-ad-format="auto"
data-full-width-responsive="true"
/>
);
}
.env.localで広告表示を切り替える
NEXT_PUBLIC_ENABLE_ADS=true
静的出力では、この値はビルド時に固定されます。
.env.localを変更
↓
npm run build
↓
本番へアップロード
ads.txtを設置する
public/ads.txt を作ります。
google.com, pub-XXXXXXXXXXXX, DIRECT, f08c47fec0942fa0
本番では以下で表示される必要があります。
https://example.com/ads.txt
ads.txtステータスが不明の場合
AdSense管理画面で ads.txt が「不明」と表示されることがあります。まず確認することです。
・https://example.com/ads.txt が表示できる
・pub-IDが正しい
・中身が空ではない
・HTMLタグが混ざっていない
・robots.txtでブロックしていない
表示できているなら、反映待ちの可能性があります。
CMP同意メッセージ
おすすめは3択です。
同意する
同意しない
オプションを管理する
外部CMPを導入しなくても、まずはGoogleのCMPで十分です。
DevTools警告の切り分け
自分のサイト側で直すものです。
A form field element should have an id or name attribute
これはフォームに id と name を付ければOKです。
一方で、以下はGoogle広告iframe側の警告であることがあります。
Quirks Mode
googleads.g.doubleclick.net
まとめ
AdSense審査前に整えることです。
・AdSenseコードを設置する
・広告枠を作る
・ads.txtを公開する
・プライバシーポリシーを整える
・お問い合わせと免責事項を用意する
・CMP同意メッセージを設定する
・DevTools警告を切り分ける
次の記事では、公開前チェックと、制作中に詰まりやすいポイントをまとめます。