ワードプレス

Googleアドセンス「インフィード広告」の作り方を1から解説【広告コードの取得方法/おすすめは自動】

Googleアドセンス「インフィード広告」の作り方 アイキャッチ



あずきです🐥

Googleアドセンスにおける…

「インフィード広告」の作り方(広告コードの取得方法)

について、ブログ初心者さん向けに1から解説していきます

具体的には、3つのポイントにわけられます

  • 【本題】インフィード広告のコード取得方法
  • 【補足①】作成済みのインフィード広告コードを、あとから再表示する方法
  • 【補足②】作成済みのインフィード広告を、あとから再編集する方法
 
簡単だよ!

さっそく見ていきましょー🐥

 

はじめに

大前提として、「Googleアドセンス審査」に合格している必要があります

Googleアドセンスのお申し込み手順はこちら ↓

アド申請の方法 アイキャッチ
【テストコードの貼り方まで】Googleアドセンスの審査に新規申請する手順【WordPressブログ】

続きを見る

 

Googleアドセンスの審査についてはこちら ↓

「Googleアドセンス」審査合格のコツ アイキャッチ
【本音/本質】Googleアドセンス審査合格のコツを、当時の自分に寄り添うつもりで書いてみた【WordPressブログ】

続きを見る

 

関連

コードを作成・取得したあとの、インフィード広告の「記事一覧エリアへの挿入方法」についてはこちら ↓

AFFINGER5_アドセンスのインフィード広告を記事一覧に挿入_アイキャッチ
AFFINGER5で、アドセンスの「インフィード広告」を記事一覧に挿入する手順【ブログ】

続きを見る

※このブログでも使用中のテーマ「WING AFFINGER5」における手順です

 

今回の記事はこちらの章に属しています

WordPressブログガイド 第8章「広告」編 

あずきのWordPressブログガイド 総合TOP 

本気でブログ収益化するなら /

WING AFFINGER5 バナー 02

-「実績」と「信頼」。 検証と改善を重ねた唯一無二のテーマ -

WING AFFINGER5

  • ターゲットに合わせた圧倒的な最適化!
  • SEO対策と広告収入UPの機能が標準装備!
  • 面倒なカスタマイズも「クリック1つ」で簡単・時短!

今なら超時短ツール「タグ管理プラグイン」配布キャンペーン中!

公式:「稼ぐ」に特化したWordPressテーマ『WING AFFINGER5』

関連:「AFFINGER5」の購入・導入方法を1から解説
関連:「AFFINGER5」導入後にまず行うべきステップまとめ

著者

azuki_01

- 専業ブロガー・フリーランス -

あずき

独立3年目 / 元アパレル → 歴10年

20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます

普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^

Twitter

Googleアドセンスにおける「インフィード広告」の作り方【広告コードの取得方法/3ステップ】

本題:インフィード広告のコード取得方法【広告スタイルの作成方法は「自動」がおすすめ】

ブログガイド_見出し_01

まずは、「Googleアドセンス」にアクセスします

ちなみにアクセスした際に、ログイン後のTOP画面ではなく…

Googleアドセンス「インフィード広告」の作り方 1-01

↑ こちらの画面が表示されてしまう場合は、ログイン状態が保持されていない状態です

その場合、右上の「ログイン」から(Googleアカウントに)ログインすればOK

 

注意

Googleアカウントを複数持ってる場合は、「アドセンス審査のときに使ったアカウント」でログインします

 

ログイン後のTOP画面に入れたら、左側のメニュー一覧から…

Googleアドセンス「インフィード広告」の作り方 1-02

↑「広告」という項目をクリックし、つづいて上部の…

Googleアドセンス「インフィード広告」の作り方 1-03

↑「広告ユニットごと」というタブをクリックします

すると、「新しい広告ユニットの作成」という画面が表示され…

Googleアドセンス「インフィード広告」の作り方 1-04

↑ このように3種類の広告タイプ…

  • ディスプレイ広告
  • インフィード広告
  • 記事内広告

の選択肢が現れるので、今回は「インフィード広告」を選びましょう

つづいて、作成スタイルの選択画面になります

具体的には…

Googleアドセンス「インフィード広告」の作り方 1-05

↑ このように、2タイプの作成方法…

  • 自動で広告スタイルを作成する
  • 手動で広告スタイルを作成する

が現れます

ここは基本的に、作成がスムーズな「自動で広告スタイルを作成する」を選べばOK

Googleも「自動」を推奨してるよ!

つづいて、この「自動で広告スタイルを作成する」側の入力フォームに…

Googleアドセンス「インフィード広告」の作り方 1-06

↑ インフィード広告を設置する予定のブログページURLを入力します

今回は一例として、インフィード広告の設置エリアとして代表的な…

トップページ内の「新着記事」一覧エリア

に設置する想定で、ブログのトップページにあたるURLを入力してみました

ちなみに!

トップページURLではなく「個別記事」のURLを入れてもOKですが、記事内に貼るアドセンス広告は今回の「インフィード広告」よりも…

  • ディスプレイ広告
  • 記事内広告

の方がわりと一般的です

次に、同じ画面内にある…

Googleアドセンス「インフィード広告」の作り方 1-07

↑「モバイル」という項目について

こちらは…

  • 「PC表示」を前提にした広告スタイルで作成する
  • 「スマホ表示」を前提にした広告スタイルで作成する

という2択になります

本来は…

「PC表示」用と「スマホ表示」用それぞれで、広告コードを発行する

という形がベストなんですが、ただ実際には…

「PC用」「スマホ用」で、インフィード広告を ”別々” に設定する機能がない

というケースが多いと思います

このブログで愛用しているWordPressテーマ「WING(AFFINGER5)」でも、インフィード広告の自動挿入に設定できるコードは ”1枠のみ” です

で、結論このような場合には…

Googleアドセンス「インフィード広告」の作り方 1-07

↑「モバイル」という方を選べばOK

実際このブログでも、「モバイル」側を選んで広告コードを発行したところ、PC・スマホどちらでも問題なく表示されました

使用テーマによって変わる可能性はあるから、実際に広告を貼ったらプレビューで確認してみよう

ということで…

「モバイル」を選択したら、右端の…

Googleアドセンス「インフィード広告」の作り方 1-08

↑「ページをスキャン」ボタンをクリックします

Googleアドセンス「インフィード広告」の作り方 1-09

↑ 入力したブログページのスキャンが始まるので、ちょっと待ちましょう

スキャンが無事おわると…

Googleアドセンス「インフィード広告」の作り方 1-10

↑ こんな画面になります

こちらの画面では、広告スタイルの「大まかな設計」を、実際のブログデザインをサンプルに自動で作成することができます

今回の例では、トップページの「新着記事」一覧用のインフィード広告になるので、その記事一覧のなかから「ベースとなる記事」を適当に1つ選択していきます

Googleアドセンス「インフィード広告」の作り方 1-11

↑ 今回は試しに、上から3番目の記事カードをサンプルデザインに指定してみました

該当の記事カードをクリックすると、赤い点線が表示され…

Googleアドセンス「インフィード広告」の作り方 1-12

↑ 右側のプレビューには、その記事カードデザインをもとにした広告サンプルが表示されます(便宜上、モザイクをかけてます)

つまり、「サムネ画像」や「記事タイトル」の大きさや配置、フォントとかのこと!

ということで、これで問題なければ右下の「次へ」ボタンをクリックしましょう

今度は…

Googleアドセンス「インフィード広告」の作り方 1-13

↑ より細かい編集に入っていきます

まずは、右上の…

Googleアドセンス「インフィード広告」の作り方 1-14

↑「広告ユニット名」という入力フォームに、今回作るインフィード広告の「タイトル」を入力しましょう

ちなみにここの「タイトル」は読者から直接見られるものではないので、自分が管理しやすいと思う任意の名前でOKです

今回は例として…

Googleアドセンス「インフィード広告」の作り方 1-15

↑ こんな名前にしてみました

つづいて、右端の…

Googleアドセンス「インフィード広告」の作り方 1-16

↑ こちらの縦にずらっと並んだ設定項目で、インフィード広告の細かいデザインを指定していきます

ただし!

基本的にここの各種項目は、なにもいじらなくてOKです

なぜなら、さきほど指定した記事カードのサンプルを元に、自動でおすすめの設定を作ってくれるからですね

なのでここでは設定を変えないまま、まずは…

Googleアドセンス「インフィード広告」の作り方 1-17

↑ 右下の「保存してコードを取得」ボタンで、コードの取得を一旦済ませてしまいましょう

ちなみに1度コードを取得しても、さきほどの編集画面にはあとからいつでも戻れます(このあとの【補足②】をどうぞ)

つまり、ここの設定はあとからでも再編集できる!

ということで、「保存してコードを取得」ボタンをクリックすると…

Googleアドセンス「インフィード広告」の作り方 1-18

↑ このように広告コードが表示されるので、左下の「コードをコピー」をクリックで、コードを丸々コピーします

ちなみにこのコードが表示された画面も、あとからいつでも再表示できます(このあとの【補足①】をどうぞ)

ということで…

インフィード広告の取得はこれで完了です🐥

あとは取得したこの広告コードをブログ側に貼りつければ、広告は表示されます

 

関連

コードを作成・取得したあとの、インフィード広告の「記事一覧エリアへの挿入方法」についてはこちら ↓

AFFINGER5_アドセンスのインフィード広告を記事一覧に挿入_アイキャッチ
AFFINGER5で、アドセンスの「インフィード広告」を記事一覧に挿入する手順【ブログ】

続きを見る

※このブログでも使用中のテーマ「WING AFFINGER5」における手順です

 

注意

WordPressにおける各種設定は、反映までに時間がかかる場合があります

すぐに反映させたいときは、次の方法を試してみてください

 
  • WordPressキャッシュのクリア
  • パーマリンク設定の更新
 

具体的な手順はこちら ↓

WordPress_各種設定が反映されないときの対処方法_アイキャッチ
WordPressで、設定内容が反映されないときにまず試したい2つの対処方法【キャッシュの削除/パーマリンク設定の再保存】

続きを見る

 

補足①:作成済みのインフィード広告コードを、あとから再表示する方法【既存の広告ユニット >「コードを取得」アイコンから】

ブログガイド_見出し_02

ここからは補足です

1つ目は…

作成済みインフィード広告コードを、あとから再表示する方法

について

まず作成した広告コードというのは、最初に 広告 > 広告ユニットごと をクリックで表示された…

Googleアドセンス「インフィード広告」の作り方 1-19

↑ こちらの画面上で、「既存の広告ユニット」という項目に一覧で表示されます

で!

作成した広告コードをあとからまたコピーしたい場合は、この一覧から…

Googleアドセンス「インフィード広告」の作り方 1-20

↑ こちらの「コードを取得」ボタンをクリックすると、いつでもコードを再表示させることができます

 

補足②:作成済みのインフィード広告を、あとから再編集する方法【既存の広告ユニット >「編集」アイコンから】

ブログガイド_見出し_03

2つ目の補足は…

作成済みのインフィード広告を、あとから再編集する方法

について

まずは1つ目の補足と同じく、 広告 > 広告ユニットごと をクリックで表示される「既存の広告ユニット」の一覧から…

Googleアドセンス「インフィード広告」の作り方 1-21

↑ こちらの「編集」ボタンをクリックすると、作成済みのディスプレイ広告をいつでも再編集できます

 

おしまい♪

あずき(Twitter:@azuki_rinrin

今回の記事はこちらの章に属しています

WordPressブログガイド 第8章「広告」編 

あずきのWordPressブログガイド 総合TOP 

 

本気でブログ収益化するなら /

WING AFFINGER5 バナー 02

-「実績」と「信頼」。 検証と改善を重ねた唯一無二のテーマ -

WING AFFINGER5

  • ターゲットに合わせた圧倒的な最適化!
  • SEO対策と広告収入UPの機能が標準装備!
  • 面倒なカスタマイズも「クリック1つ」で簡単・時短!

今なら超時短ツール「タグ管理プラグイン」配布キャンペーン中!

公式:「稼ぐ」に特化したWordPressテーマ『WING AFFINGER5』

関連:「AFFINGER5」の購入・導入方法を1から解説
関連:「AFFINGER5」導入後にまず行うべきステップまとめ

著者

azuki_01

- 専業ブロガー・フリーランス -

あずき

独立3年目 / 元アパレル → 歴10年

20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます

普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^

Twitter

-ワードプレス

© 2020 あずきのぶろぐ。