Notice: Function _load_textdomain_just_in_time was called incorrectly. Translation loading for the crayon-syntax-highlighter domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. Please see Debugging in WordPress for more information. (This message was added in version 6.7.0.) in /home/xs340029/favorite-fashion.com/public_html/wp-includes/functions.php on line 6131

Notice: 関数 _load_textdomain_just_in_time が誤って呼び出されました。simplicity2 ドメインの翻訳の読み込みが早すぎました。これは通常、プラグインまたはテーマの一部のコードが早すぎるタイミングで実行されていることを示しています。翻訳は init アクション以降で読み込む必要があります。 詳しくは WordPress のデバッグをご覧ください。 (このメッセージはバージョン 6.7.0 で追加されました) in /home/xs340029/favorite-fashion.com/public_html/wp-includes/functions.php on line 6131
グーグルAdSense ”インフィード広告”をワードプレスに5分で簡単設置 | 好きなことだけ通信

グーグルAdSense ”インフィード広告”をワードプレスに5分で簡単設置

シェアする

  • このエントリーをはてなブックマークに追加
  • Line BtnLine Btn Mini
  • Feedly Follow Rectangle Flat Medium 2x 0
1x1.trans

WordPress(ワードプレス)で、ブログサイトのトップページ、タイムラインの間、フィード内に自然に溶け込むように表示される、Google Adsense(グーグルアドセンス)の広告ユニット「インフィード広告」の設置がわからない初心者の為に、簡単に設置する方法を備忘録を兼ねて解説したいと思います。

目次

Google Adsenseインフィード広告

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A Top

インフィード広告とは、フィード内に広告を掲載してサイトの収益化とユーザー エクスペリエンスの向上を促進するという、新しいフォーマットの広告であり、スクロール可能なコンテンツの中に自然に溶け込むように表示される為、クリック率が高いと言われています。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 1

当ブログのトップページ。記事(コンテンツ)と記事(コンテンツ)の間、スクロール可能な一連のコンテンツのことをフィードといい、間に挿入されているのが、インフィード広告です。

つまりインフィード広告はトップページのみに適用する広告ユニットで、記事内コンテンツには設置してはいけません。(※設置した場合はAdSenseポリシー違反に該当する可能性があり自動ペナルティを受ける原因となる場合があるので気を付けて下さい。)

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 1 2

ブログスタイルであれば、編集コンテンツは記事やニュースの一覧や、リスティングは商品やサービスなどの情報一覧ページ(トップページ)への設置となるでしょう。

またモバイルとPC(パソコン)で別々のサイズや設定でフィードを表示するようサイトを構成する事も出来ます。

それでは今回は、WordPress(ワードプレス)で、Google Adsense(グーグルアドセンス)の“インフィード広告”の設置がわからない初心者の為に、備忘録を兼ねて解説したいと思います。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 3

まずこちらが、インフィード広告の設置する為の広告ユニット作成ページ。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 4

①サイトのURLを入力

②デスクトップ用かモバイル用かを選択

③ページをスキャンを押す。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 5

するとサイトのページをスキャンしてフィードを探します。1分しないくらいで終わります。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 6

するとスキャンしたフィード(トップページ)が表示されます。

コンテンツの一部。要はトップページ内の記事をどれでもいいのもで選択しましょう。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 7

タイムラインの中の記事を一つ選択してみました。

そして「次へ」を押しましょう。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 8

そのレイアウトとスタイルに基づいて作成された広告がこちらです。

広告ユニット名を必ず設定しておきましょう。

例)インフィード広告PC、インフィード広告モバイル

そして、ここからさらに細かくカスタマイズが出来ます。

カスタマイズ

グローバル オプション

広告全体にスタイルを適用するには、次の設定を使用します。

設定説明
選択したディスプレイ広告を許可するこれをオンにすると、インフィード広告ユニットに選択したディスプレイ広告も表示されるようになります。詳細
フォント広告のすべてのテキストのフォントを設定します。豊富なGoogle フォントから選択できます。
テキストの折り返し画像の周りでテキストを折り返す場合、このオプションをオンにします。
背景色広告の背景色を設定します。
枠線枠線のスタイルを設定します。
  • 枠線のサイズをピクセル単位で設定します。
  • 広告の枠線の色を設定します。
パディング広告の上部、下部、側面のパディングをピクセル単位で設定します。

イメージ

広告の画像のスタイルを設定するには、次の設定を使用します。

設定説明
左揃え画像を広告の左側に揃える場合、このオプションを選択します。
右揃え画像を広告の右側に揃える場合、このオプションを選択します。
サイズ画像のサイズを設定するには:
  • 画像のアスペクト比には、1.91:1 か 1:1 をご使用ください。フィード内の画像のアスペクト比に最も近いオプションを選択することをおすすめします。
  • 画像の幅を設定します。幅をパーセントかピクセルで指定できます。

詳しくは、フィード内の画像のサイズを確認する方法についての記事をご覧ください。

パディング画像の上部、下部、両側のパディングをピクセル単位で設定します。

見出し

広告の見出しテキストのスタイルを設定するには、次の設定を使用します。

設定説明
短い広告に短い見出しを付ける場合、このオプションを選択します。
長い広告に長い見出しを付ける場合、このオプションを選択します。
スタイル見出しのスタイルを設定します。
  • 見出しのフォントサイズをピクセル単位で設定します。
  • 見出しの文字揃え(左揃え、中央揃え、右揃え)を選択します。
  • 見出しを太字にするかどうかを選択します。
  • 見出しのフォントの色を選択します。
パディング見出しの上部、下部、両側のパディングをピクセル単位で設定します。

説明

広告の説明テキストのスタイルを設定するには、次の設定を使用します。

設定説明
説明を表示広告の説明を表示する場合、このオプションをオンにします。
スタイル説明のスタイルを設定します。
  • 説明のフォントサイズをピクセル単位で設定します。
  • 説明の文字揃え(左揃え、中央揃え、右揃え)を選択します。
  • 説明を太字にするかどうかを選択します。
  • 説明のフォントの色を選択します。
パディング説明の上部、下部、両側のパディングをピクセル単位で設定します。

URL

広告の表示 URL のスタイルを設定するには、次の設定を使用します。

設定説明
スタイルURL のスタイルを設定します。
  • URL のフォントサイズをピクセル単位で設定します。
  • URL の文字揃え(左揃え、中央揃え、右揃え)を選択します。
  • URL を太字にするかどうかを選択します。
  • URL のフォントの色を選択します。
パディング表示 URL の上部、下部、側面のパディングをピクセル単位で設定します。

ボタン

広告のボタンのスタイルを設定するには、次の設定を使用します。

設定説明
フォントの色ボタンのフォントの色を選択します。
枠線の色ボタンの枠線の色を設定します。

だいだいデフォルトで問題ありません。中級者以上の方は色々調整してみて下さい。

「保存してコードを取得」でコードを生成しましょう。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 9

そして、コード スニペットをコピーして事前準備が完了です。

そして設置する箇所ですが、このブログのテーマは、Simplicity2(シンプリシティ)です。シンプリシティでの設置は非常に簡単で、ウィジェットに設置するだけで完了します。

インフィード広告を設置出来るのは、コンテンツの「先頭」か、「中」「末尾」です。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 10

まさにコンテンツの「先頭」か、「中」「末尾」へ、コンテンツを設置出来るのが、下記ウィジェット。

インデックスリストトップ(先頭)

インデックスリストミドル(中)

インデックスリストボトム(末尾)

となり、このウィジェットへ広告コードを貼り付ける為にテキスト欄を追加します。例えば。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 11

インデックスリストミドルへ、PC専用のテキストを追加する場合。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 12

インデックスリストボトムへ、モバイル専用のテキストを追加する場合。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 13

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 14

と、このように当「好きなこと通信」では、インデックスリストミドル(中)と、インデックスリストボトム(末尾)へ「インフィード広告」を設置しています。

そして実際設置された画面がこちら。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 1

コンテンツ(中)に設置されています。

%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A3%E3%83%BC%E3%83%89%E5%BA%83%E5%91%8A 2

コンテンツ(末尾)です。このように自然に溶け込んでいるとはとても言い難くあからさまな感じはしますが(笑)、ちゃんと設置されてますね!

一人でも多くの方のお役に立てれば幸いです。もちろん今回はあくまで設置の方法を解説しただけですので、インフィード広告を入れたからといって収益が増す保障はありません。それは皆さまが各々検証して継続するか、もしくは外すかは決めて下さい。

以上

グーグルAdSense ”インフィード広告”をワードプレスに5分で簡単設置

でした。