[Sentry]Sentryに広告を設置する(PC、スマホに最適化した広告の掲載例)

Sentry ad

最強の無料WordPressテーマ(※自称)「Sentry」の解説記事第5弾(?)で、今回は広告を設置してみましょう。
広告は好きな位置に貼ることができ、これが絶対の正解という置き方はありませんが、一応Sentryでの広告設置の推奨例ということで参考にしてみてください。

なお、広告は基本的にGoogle Adsenseのバナー広告を設置する想定で紹介します。
アドセンス以外の広告も基本的にはアドセンスに準拠したサイズの広告を配信していることが多いと思うので、アドセンス以外のバナーを貼りたいと思っている人も是非参考にしてみてください。

スマホ向けの広告設定

まずはスマホ版から。
スマホに設置する広告は「バナー広告」「ページ単位広告」「関連記事のインフィード広告」の3種類を想定しています。

バナー広告(スマホ版)の設置方法

スマホ版のバナー広告(Google Adsenseのバナー広告)は3箇所を想定しています。
すべて300×250の「レクタングル(中)」のサイズで、各記事のタイトル下、記事下、サイドバーの3箇所に設置します。
タイトル下と記事下は記事コンテンツのみに表示されますが、サイドバー広告はトップページやカテゴリー一覧ページなどすべてのページで表示されます。
Sentry ad smp adsense
▲左:記事タイトル下、中:記事下、右:サイドバー

設置の方法はすべてウィジェットから行います。

記事タイトル下の広告の設定方法

ウィジェットエリア「記事タイトル下コンテンツ」に広告を設定します。

Sentry専用の「[S]テキスト(モバイルのみ)」のウィジェットをドラッグ&ドロップし、内容に広告のコードをコピペします。
なお、記事タイトル下コンテンツは広告専用で設計したウィジェットではないため、タイトルの設定を忘れないようにしましょう。
(設定するタイトルは「スポンサードリンク」が無難でしょう。なお、広告専用に作っているウィジェットエリアはタイトルの入力は不要です。)
Sentry ad smp title

ちなみに、この記事タイトル下コンテンツと次に設定する記事下の広告はクリック率・単価ともに高くなる傾向があり、サイトの稼ぎ頭になる広告エリアです!

記事下広告エリア

ウィジェットエリア「記事下広告エリア」に広告を設定します。
こちらも、「[S]テキスト(モバイルのみ)」のウィジェットを使い、発行した広告のコードをコピペします。
Sentry ad smp article

この領域は広告専用領域のため、タイトルは設定しなくても自動的に「スポンサードリンク」という文字も出力されます。
(タイトルの内容はどこにも表示されないので、管理画面でわかりやすいように好きな名前をつけておいても大丈夫です!)

サイドバー広告エリア

サイドバーの広告も記事下と同様に、ウィジェットエリア「サイドバー広告エリア」に、ウィジェット「[S]テキスト(モバイルのみ)」を使って設定します。

なお、スマホ版のサイドバー広告は記事のかなり下の方にあるため、なかなか単価が上がらない広告エリアですので、設定を省略しても大きく収益には影響しないと思います。

以上で、スマホ版のバナー広告の設置はかんりょうです。

ページ単位広告の設定方法

Sentry ad page

昨年あたりからGoogleが推奨しているページ単位広告を設置します。
ページ単位の広告はスマホ用で、アンカー広告(ページの一番下に固定で表示されるバナー)と、モバイル全面広告(ページを遷移する際に全画面に表示される広告)の2種類で、1つのコードで配信をコントロールすることができます。
収益はそれなりに上がりますが、なかなか”ウザい広告”でもあるので、設定するかはしっかり判断して決めてください。

広告の設定は、テーマのカスタマイザーから行います。
wordpressの管理画面から「外観」→「カスタマイズ」→「[Sentry]カスタマイズ」をクリック。
headタグに出力するコードのテキストエリアに、アドセンスが発行した広告のコードをコピペします。
Sentry ad page setting

ページ単位広告の設定はこれで完了です。

関連記事のインフィード広告

モバイル版は関連記事へのインフィード広告を設定することができます。
最近はGoogleの関連コンテンツ広告を利用している人もいるかもしれませんが、特に雑記ブログでは関連記事の精度がやや低くも感じます。
Sentryでは推奨の関連記事プラグインである「Yet Another Related Posts Plugin(YARPP)」と併用して、関連記事の中に広告を混ぜ込むことができます。

利用するのは「nend」の広告です。nend未登録の方はこちらから登録をどうぞ↓


nendに登録したら、「広告枠の管理」タブから「新規サイト/アプリの作成」ボタンをクリック。
サイト/アプリのタイプを「Webサイト」としたら、サイト名などの必要な情報を入力し、「作成」を行います。
Sentry ad infeed

必要な情報を入力したら、レイアウトの作成を行います。
HTMLが得意な人はコードから適切な広告枠を作ることもできますが、HTMLがわからなくても画面で「ここに広告を出したい」と設定しレイアウトを作ることができます。

関連記事をクリックして、自動的に関連記事に合うようなデザインが生成されたら、「広告コードを作成する」をクリックして広告コードを発行しましょう。
Sentry infeed layout

コードが発行されたら、ウィジェットエリア「関連記事内広告エリア」「[S]テキスト(モバイルのみ)」のウィジェットを使って設置しましょう。
スクリーンショット 2017 06 22 1 41 35

また、広告読み込み用コードの設定も必要です。
管理画面の「外観」→「テーマの編集」を選択。テーマのための関数 (functions.php)を選択し、以下のコードを入力します。

コードの設置が問題なく終わると、スマホ版の関連記事内に広告コンテンツが表示されるようになります。
IMG 4474

これで、スマホ版の広告設定は完了です。

PC向けの広告設定

PC版の広告は「記事下」と「サイドバー」の2箇所にバナー広告を設置します。
記事下にはレクタングルを2つ設置するという、かなりオーソドックスなレイアウトですね。

記事下広告エリア

Sentry ad pc article

スマホ版と同様に、ウィジェットエリア「記事下広告エリア」に広告を設定します。
採用する広告は336×280の「レクタングル(大)」バナーです。

今回は「[S]テキスト(PCのみ)」のウィジェットを使い、発行した広告のコードをコピペします。
広告は2つ設置するので、「[S]テキスト(PCのみ)」ウィジェットを2つ設定します。
貼り付ける広告のコードは、同じものでも、別に発行しても構いません。
(2つの広告に同じ画像が出る場合がありますが、これは同一のコードを使っても、別々のコードを使ってもタイミングによっては発生してしまうようです。)

スクリーンショット 2017 06 22 1 59 20

サイドバー広告エリア

Sentry ad pc

サイドバーも同様にウィジェットエリア「サイドバー広告エリア」に、ウィジェット「[S]テキスト(PCのみ)」を使って設定します。
広告のサイズは300×600の「ハーフページ」がオススメです。

これでPC版の広告設定は完了です。

AMPページの広告を設定する

Sentryは「AMP」プラグインをインストールするだけでデザインが最適化されたAMPページが作られますが、AMPページにも広告を設定することができます。
Sentry ad amp

広告の表示エリアは「記事タイトル下」「記事下」の2箇所です。
どちらも「レスポンシブ」の広告が推奨です。

広告の設定は、テーマのカスタマイザーから行います。
wordpressの管理画面から「外観」→「カスタマイズ」→「AMPページ設定」をクリック。

AMPの広告のみ、広告をAMPに表示できる形式で出力する必要があるため、コードのコピペではなく、「data-ad-clients」「data-ad-slot」の値を入力します。
どちらも広告用のコードの中に含まれる値で、「data-ad-clients」はca-pub-xxxxxxxxxxxxxxxx、「cata-ad-slot」は10桁の数字が入ります。
スクリーンショット 2017 06 22 2 10 36

これでAMPページ用広告の設定が完了です。

ショートコードで呼び出す記事内の広告表示エリア

記事中に広告を表示することができます。
ウィジェットエリアは「記事中広告エリア」で、記事本文内にショートコード

と記述すると広告が表示されます。
設定するウィジェットは記事下広告エリアと同様に、スマホ向けにレクタングル(中)、PC向けにレクタングル(大)を2つ設定するのがおすすめです。

ultimate-ez.comではこのエリアは利用していませんが、Sentryを利用しているサイトで実際にウィジェットを利用している例はこちらです。
発売日から毎日欠かさずAppleWatchを使っている私が選ぶ”本当に使えるApple Watchアプリ”11選!(2017年1月1日更新) | Apple Watch Journal
※Power2というアプリと1Passwordというアプリのセクションの間に広告が表示されています。これが

で呼び出している広告エリアです。


以上、Sentryの広告設定の手順でした。
全部一気に設定するのは結構大変だと思いますが、収益が上がればサイト更新のモチベーションも上がるはず!
しっかりと設定して、じゃぶじゃぶと稼いじゃってください!