インフィード広告(Google Adsense)を使ってみた ~Luxeritasにおける設定付

この記事は約5分で読めます。

IT雑記, Luxeritas

Google Adsenseに、いつの間にか「インフィード広告」と「記事内広告」という広告ユニットが追加されていました。
そこで実際にインフィード広告を設置してみました。

インフィード広告とは?

AdSense ヘルプページから引用してみます。

インフィード広告は、フィード内に広告を掲載してサイトの収益化とユーザー エクスペリエンスの向上を促進する、新しいフォーマットの広告です。たとえば、フィードには記事のフィード(例: ニュース記事の一覧)やリスティング(例: 商品やサービスの情報一覧)などがあります。

何のこっちゃという感じですが、「たとえば」以降を見るとイメージが掴めるのではないでしょうか。
ブログの場合で簡単に言い換えてみます。

記事一覧の中に違和感のない形で設置できる広告

具体的には、次項の設置例を見ていただくのが早いです。

実際にインフィード広告を設置してみた例

本サイトのカテゴリ記事一覧に設置してみた例です。

違和感のない形で広告が溶け込んでいるのがおわかりでしょうか?

なおタイル型のインフィード広告もあります。

インフィード広告のメリット

上記ページから引用します。

ユーザー エクスペリエンスの向上: インフィード広告は、サイト訪問者のエクスペリエンスを高めます。ユーザーのフローの一部として、サイトのデザインやスタイルに調和した広告が表示されます。
新しい広告スペースの収益化: インフィード広告は、これまで掲載先として使われたことがないフィード内に表示されるため、ページの収益機会をさらに広げることができます。
モバイルに最適: インフィード広告は、モバイル端末の小さな画面で収益を上げるのに有効な、モバイルに最適な広告です。

新しい広告スペースについては、WordPressだとアドセンスを一覧に挟み込んで表示する方法はありましたから、特筆すべき点ではありません(はてななどでもできたかは知らない)。
「サイトのデザインやスタイルに調和した」というのがポイントなのかなと。
溶け込んでいる分、訪問者も自然と読んでしまうでしょうし。

モバイルはタイル型に限ります。
カード型ですとかえって鬱陶しいです(後述)。

あと収益が上がるかどうかですが……残念ながら、本サイトみたいに零細(月間3万PV程度)では全然です。
そもそもカテゴリ一覧の閲覧自体がかなり少ないです。
それでもアドセンスを設置しておけばたまに収益があがります。
しないよりはした方がいいですし、既にしている人はインフィードタイプに切り替えるべきでしょう。

私の設置場所

PCは、インフィード広告を一番上、真ん中。通常のアドセンスのダブルレクタングルを一番下。
モバイルは一番上をSEOの関係で設置せず、真ん中を通常のアドセンスに差し替えています。

モバイルで通常のアドセンスに差し替えているのは、PCとデザインを変えないとおかしくなるため。

こんな感じで間延びしてしまいます。
タイル型にするにしても出し分けは必須となります。

インフィード広告の設置方法(Luxeritasの場合)

Luxeritasの場合は一覧途中にもウィジェットスペースが予め用意されているので、非常に楽に設置できます。
以下では、設置方法を説明します。
私と同じ環境(一覧カードタイプ、アイキャッチ300を利用)の場合だと、そのまま導入できるかと。

1.新しい広告からインフィード広告を選択する

2.設定する

適当にタイトルをつけて設定します。
URLとボタンはデフォルトのままにしてます。
パディングは画像の数値に合わせて各自微調整してください。

グローバルオプション

一番上のチェックを忘れずに。

イメージ

幅の単位をpx(ピクセル)に変更し、お使いのサムネイルサイズに合わせます。

見だし

記事タイトルが長めな人は「長い」、そうでない人は「短い」がしっくりくると思います。
通常はSEOを考慮して長めのタイトルにしてるはずなので「長い」の方がいいでしょう。

フォントサイズはカードのタイトルのフォントの大きさに合わせて。

説明

「説明を表示」はON、そうでないとインフィード広告の意味がありません。
(記事の抜粋を読むのと同じ流れで説明を読ませることで、説得広告としての効果が上がる)

フォントサイズは抜粋のフォントサイズに合わせて。

3.(出し分けする場合)PHPファイルを作成する

ウィジェットでPHPコードを動かす方法はこちらの記事を御参照ください。

モバイルではアドセンスを表示しない場合

<?php if(!wp_is_mobile()): ?>
<div Align="center"><span style="font-size:80%">スポンサーリンク</span></div>
【インフィード広告のコード】
<?php endif; ?>

スポンサーリンクは念のためつけてあります。

モバイルとPCでインフィード広告と通常広告を出し分ける場合

<?php if(!wp_is_mobile()): ?>
<div Align="center"><span style="font-size:80%">スポンサーリンク</span></div>
【インフィード広告のコード】
<?php else : ?>
<div Align="center"><span style="font-size:80%">スポンサーリンク</span></div>
【通常アドセンスのコード】
<?php endif; ?>

4.ウィジェットスペースにショートコード・アドセンスコードを記載する

ここになります。

一覧中央は、何も設定しないとテーマ側で自動計算して配置します。
「○番目に表示したい」という場合は「カスタマイズ→グリッドレイアウト」に設定項目があります。

まとめ

解答者の写真
インフィード広告は最初にデザインを調整するのが正直面倒。
でも、やってしまえば通常のアドセンスよりもすっきりして見えるわ。
挑戦してみて!