AdSenseのコードをWordPressのHEAD内に設置する方法

WordPress で作成したブログで AdSense の広告を掲載する場合、ブログの審査のために AdSense が発行したコードを <head> と </head> の間に設置する必要があります。コードを設置するには直接 header.php ファイルに記述したりプラグインを使用してコードを設置する方法があります。この記事では AdSense のコードを WordPress の HEAD 内に設置する方法について分かりやすく解説します。

(2021 年 05 月 29 日公開 / 2021 年 05 月 29 日更新)

header.phpにコードを記述する

1 つ目の方法は header.php ファイルに直接コードを記述する方法です。このファイルに記述しておけば、 WordPress で表示されるすべてのページの HEAD 内にコードが設置されます。

header.php は WordPress のテーマ毎に別々に用意されているファイルです。現在使用しているテーマから別のテーマに変更した場合、あらためて記述しなおす必要があることを覚えておかれてください。

先に「AdSenseを新しいサイトで利用できるように追加申請する」を参考に AdSense の管理画面から新しいサイトの追加を行い、審査用のコードを取得しておいてください。

WordPress の管理画面を表示してください。

header.phpにコードを記述する(1)

画面左側の「外観」メニューをクリックし、さらに「テーマエディター」をクリックしてください。

header.phpにコードを記述する(2)

「テーマを編集」画面が表示されます。

header.phpにコードを記述する(3)

画面右側に編集するファイルを選択する画面が表示されています。この中の「テーマヘッダー(header.php)」をクリックしてください。

header.phpにコードを記述する(4)

header.php ファイルの編集画面が表示されます。

header.phpにコードを記述する(5)

下記の赤線部分に <head> から </head> に関する部分があります。

header.phpにコードを記述する(6)

header.phpにコードを記述する(7)

</head> の直前あたりに AdSense のコードをコピーしたものを貼り付けてください。

header.phpにコードを記述する(8)

編集が終わりましたら画面下部の「ファイルを更新」をクリックしてください。

header.phpにコードを記述する(9)

AdSense のコードを WordPress の <head> と </head> の間に設置することができました。

header.phpにコードを記述する(10)

Insert Headers and Footersプラグインを使用する

続いて WordPress のプラグインを使用して <head> と </head> の間にコードを設置する方法です。 Insert Headers and Footers プラグインを使用します。

先に「AdSenseを新しいサイトで利用できるように追加申請する」を参考に AdSense の管理画面から新しいサイトの追加を行い、審査用のコードを取得しておいてください。

Insert Headers and Footersプラグインをインストールする

WordPress の管理画面を表示してください。

Insert Headers and Footersプラグインを使用する(1)

画面左側の「プラグイン」メニューをクリックし、さらに「新規追加」をクリックしてください。

Insert Headers and Footersプラグインを使用する(2)

「プラグインを追加」画面が表示されます。

Insert Headers and Footersプラグインを使用する(3)

画面右上の検索ボックスで「Insert Headers and Footers」と検索してください。 Insert Headers and Footers by WPBeginner プラグインが見つかります。

Insert Headers and Footersプラグインを使用する(4)

Insert Headers and Footersプラグインを使用する(5)

Insert Headers and Footers by WPBeginner に表示されている「今すぐインストール」をクリックしてください。プラグインのダウンロードおよびインストールが開始されます。

Insert Headers and Footersプラグインを使用する(6)

インストールが完了すると「有効化」と表示されます。「有効化」をクリックしてください。

Insert Headers and Footersプラグインを使用する(7)

Insert Headers and Footers プラグインのインストールおよび有効化が完了しました。

Insert Headers and Footersプラグインを使用する(8)

HEAD内にコードを設置する

それでは Insert Headers and Footers プラグインを使って <head> と </head> の間にコードを設置します。画面左側の「設定」メニューをクリックし、さらに「Insert Headers and Footers」をクリックしてください。

Insert Headers and Footersプラグインを使用する(9)

Insert Headers and Footers プラグインの設定画面が表示されます。

Insert Headers and Footersプラグインを使用する(10)

<head> と </head> の間にコードを設置する場合は、 Scripts in Header の下のテキストエリアに AdSense のコードをコピーしたものを貼り付けてください。

Insert Headers and Footersプラグインを使用する(11)

設定が終わりましたら画面下部にある「Save」をクリックしてください。

Insert Headers and Footersプラグインを使用する(12)

AdSense のコードを WordPress の <head> と </head> の間に設置することができました。

Insert Headers and Footersプラグインを使用する(13)

Site Kitプラグインを使用する

今度は Google 社が提供している Site Kit プラグインを使用してサイトの認証を行う方法です。このプラグインは AdSense のサイト追加に使用できるだけでなく、 Search Console や Analytics などの Google サービスの設定にも使用できます。

Site Kit プラグインを使用する場合はコードの取得や WordPress への設定は自動で行われるため、事前に AdSense の管理画面でサイトの追加の手続きを行っておく必要はありません。

Site Kitプラグインをインストールする

WordPress の管理画面を表示してください。

Site Kitプラグインを使用する(1)

画面左側の「プラグイン」メニューをクリックし、さらに「新規追加」をクリックしてください。

Site Kitプラグインを使用する(2)

「プラグインを追加」画面が表示されます。

Site Kitプラグインを使用する(3)

画面右上の検索ボックスで「Site Kit」と検索してください。 Site Kit by Google プラグインが見つかります。

Site Kitプラグインを使用する(4)

Site Kitプラグインを使用する(5)

Site Kit by Google に表示されている「今すぐインストール」をクリックしてください。プラグインのダウンロードおよびインストールが開始されます。

Site Kitプラグインを使用する(6)

インストールが完了すると「有効化」と表示されます。「有効化」をクリックしてください。

Site Kitプラグインを使用する(7)

Site Kit プラグインのインストールおよび有効化が完了しました。

Site Kitプラグインを使用する(8)

Site Kitプラグインの初期設定

Site Kit プラグインの利用および設定を行うには、 WordPress の管理画面左側に表示されている「Site Kit」メニューをクリックしてください。

Site Kitプラグインを使用する(9)

Site Kit の初期設定として Search Console にブログを追加します。「GOOGLEアカウントでログイン」をクリックしてください。

Site Kitプラグインを使用する(10)

次の画面で「Google でログイン」をクリックしてください。

Site Kitプラグインを使用する(11)

Google アカウントのログイン画面が表示されます。 Search Console で使用する Google アカウントでログインしてください。今回は AdSense で使用している Google アカウントでログインしました。

Site Kitプラグインを使用する(12)

Site Kit への権限の付与を行います。最初に「確認済みサイトの Search Console データの表示と管理」について「許可」をクリックしてください。

Site Kitプラグインを使用する(13)

次に「管理しているサイトとドメインのリストの管理」について「許可」をクリックしてください。

Site Kitプラグインを使用する(14)

先ほど許可をクリックした権限にチェックが入っています。これでよろしければ「許可」をクリックしてください

Site Kitプラグインを使用する(15)

Site Kitプラグインを使用する(16)

サイトの所有者であることを確認します。「続行」をクリックしてください。

Site Kitプラグインを使用する(17)

ブログに Google アカウントのデータへのアクセスを許可します。「許可」をクリックしてください。

Site Kitプラグインを使用する(18)

Search Console にブログを追加します。「サイトを追加」をクリックしてください。

Site Kitプラグインを使用する(19)

Search Console にブログが追加されました。「ダッシュボードに移動」をクリックしてください。

Site Kitプラグインを使用する(20)

「ダッシュボード」が表示されます。

Site Kitプラグインを使用する(21)

AdSenseへブログを追加する

AdSense にブログを追加します。ダッシュボードに表示されている AdSense のブロックの「サービスを連携」をクリックしてください。

Site Kitプラグインを使用する(22)

AdSense で使用している Google アカウントの選択画面が表示されます。今回は先にログインした Google アカウントを使用するので表示されている Google アカウントをクリックしました。(異なる Google アカウントを使用している場合は別のアカウントを使用をクリックしてログインしてください)。

Site Kitプラグインを使用する(23)

Site Kit へ 「AdSense データを表示」について「許可」をクリックしてください。

Site Kitプラグインを使用する(24)

先ほど許可をクリックした権限にチェックが入っています。これでよろしければ「許可」をクリックしてください

Site Kitプラグインを使用する(25)

Site Kitプラグインを使用する(26)

AdSense にサイトを追加する処理を行います。「Site Kit でサイトに AdSense コードを配置してサイトの承認を得る」がオンになっていることを確認し、「次へ」をクリックしてください。

Site Kitプラグインを使用する(27)

「サイトを ADSENSE に追加する」をクリックしてください。

Site Kitプラグインを使用する(28)

別のウィンドウに AdSense の管理画面が開き、「新しいサイトを追加」画面が表示されます。サイトの URL が自動で入力されているので「保存して次へ」をクリックしてください。

Site Kitプラグインを使用する(29)

Site Kitプラグインを使用する(30)

「審査をリクエスト」をクリックしてください。

Site Kitプラグインを使用する(31)

サイトの審査が開始されます。 Site Kit を使用した場合は審査に必要となるコードは自動でブログで挿入されるので、 WordPress 側でコードを追加する必要はありません。

Site Kitプラグインを使用する(32)

審査はコードを手動で追加した場合と同じように行われます。サイトの追加が承認されたかどうかは AdSense の管理画面で「サイト」画面を表示して確認されてください。

-- --

AdSense のコードを WordPress の HEAD 内に設置する方法について分かりやすく解説しました。

<< 2021年5月のアーカイブ >>

( Written by Tatsuo Ikura )

Profile
profile_img

著者 / TATSUO IKURA

初心者~中級者の方を対象としたプログラミング方法や開発環境の構築の解説を行うサイトの運営を行っています。