Adsenseの関連コンテンツをstingerに設置してみた

先日、気づいたらAdsenesの関連コンテンツが利用できるようになっていたことを記事にしました。

気づいたら許可されていたAdsenseの関連コンテンツ機能レビュー

簡単に言うとソースコードをペタッと貼り付けるだけで、サイト内の関連記事を自動で表示してくれるというもの。

一度サイトに導入してみたのですが、しっくり来なかったので外してました。でも、思う所があってもう一度導入してみたのでその経緯とか設置方法を改めて紹介します。

Adsenseの関連コンテンツとは？

Adsenseの公式ページでは以下の説明がされています。

関連コンテンツは、サイトを閲覧しているユーザーに向けてサイト内の関連コンテンツを簡単に宣伝できる無料サービスです。ユーザーが関心を持つコンテンツが見つけやすくなることで、サイトのページビュー数や滞在時間、ユーザーのリピート率、広告表示回数が向上し、広告収益の増加が見込めます。

この内容だと少し分かりづらいのですが、簡単に言うとGoogleがサイト内のコンテンツを自動で判断しておすすめ記事を表示してくれる機能です。

ウェブマスターはこれを導入することによって、ユーザーに2記事目のコンテンツを紹介してサイトの回遊やpv数、滞在時間を増加させることができます。

それに加えて、関連記事の中に広告を表示してくれるので広告の収益も見込めるというものです。

設置するかどうか迷っていた

気づいたらAdsenseの管理画面に『Adsense関連コンテンツ使えますよ！』っていうお知らせが届いていたのですが、正直これって導入する意味あるのかな？って思っていました。

と思う理由は以下の3点です。

①そもそも関連記事の表示機能はテーマに組み込まれている(ロジックは同じカテゴリ記事をランダムに)

②一度導入したが、記事とタイトルが一致しないものがあった

③関連記事とは言えない記事が表示されることがある

特に③に関してが微妙な所でした。例えば当サイトだと複数のカテゴリがあるのですが、(ライフハック/漫画/ITなど)アプリの操作記事に漫画のコンテンツが関連記事として表示されたりするんですよね・・・

これはβ版なので仕方ないと言えばそうかもしれませんし、サイトの読み込みがまだ完了していなく関連記事の表示が不安定なのかもしれないし・・・正直なとろこよく分かりません。

そういったこともあって、導入しようかどうか迷っていたのですが2,3日設置して様子を見たからといってその機能の良さは分からないですよね。

ましてや新しくスタートした機能なので、サイトにメリットがあるのかデメリットがあるのかやってみないことには分からないわけです。

ただこの機能の提供者はGoogle大先生です。Adsenseの管理画面でおすすめされているので断る理由はありません。

なので2,3ヶ月ほど導入して様子を見ようかなと改めて思うようになりました。

Adsenseの関連記事の機能を設置してからの変化というのも後日報告したいなと思います。

Adsenseの関連コンテンツをstingerに設置する方法

さっそくAdsenseの関連コンテンツをstingerに設置するわけですが方法はいたって簡単です。

関連記事を表示させたいところにソースコードをペタっと貼り付けるだけです。

ただ、すでにstingerのテーマ内に関連記事は表示されているので作業としては

①既存の関連記事の表示を削除する

②その場所にソースコードをぶち込む

といった作業になります。とは言っても簡単なのでサクッと説明を。

①既存の関連記事の表示を削除する

テーマのソースコードをいじりますので、作業前に必ずバックアップを。

ローカルでいじって確認してから更新でも良いですが、簡単な作業なので自分はオンラインでそのまましました。

まず管理画面から外観＞テーマの編集＞single.phpに遷移します。

single.phpとは記事ページになります。まさに今ご覧いただいている記事を動的に生成するソースコードがある場所です。

ここから『関連記事』の記載があるところを探します。検索で『関連記事』と探すとすぐに見つかると思います。

そうすると<?php get_template_part(‘kanren’);?>というコードが出てくると思います。

これはテーマ内にある別ファイル、kanren.phpを呼び出しているわけですね。kanren.phpはサイト内の関連記事を表示するコードが書かれているファイルです。(stingerでは)

simplictyだとget_template_part(‘related-entries‘);とあったので、wordpressテーマによってファイル名が異なるのでご注意ください。

今回は自分が使っているstingerで話しをすすめていきますね。

で、この<?php get_template_part(‘kanren’);?>の部分をごそっと削除します。いつか戻す日がくるかもしれないのでいつでも戻せるようにメモ帳か何かに保存しておいてください。

②その場所にソースコードをぶち込む

ここでサイトをいったん確認すると関連記事のところには何も表示されなくなっていると思います。

関連記事を表示するコードを削除したからですね。

次にこの場所にAdsenseのコードを貼り付けます。

おそらくAdsenseの広告生成は慣れていると思うので詳しい手順は割愛しますが、サイズは個人的には『レスポンシブ』がおすすめです。

特にこのサイトはパソコンよりもスマホからのアクセスが多いので、サイズをレスポンシブにしました。

あとは取得したコードを<?php get_template_part(‘kanren’);?>があった場所にペタっと貼り付けるだけです。お疲れさまでした。

設置後、広告が表示されるまでラグがあります。自分は5分後位には表示されるようになりました。

まとめ

今回、Adsenseの関連コンテンツをstingerに設置する方法を紹介しました。

しばらくはこれで様子を見ようかと思います。実際に自分でやってみないことには何も分かりませんからね。

後日、関連コンテンツを設置した後の変化も紹介したいと思います。