WordPress

サイドバーにアドセンスの関連コンテンツユニットを表示させる方法

アドセンスの関連コンテンツユニットといえば記事下に表示させるのが一般的ですが、サイドバーに表示させることもできます。

この「サイドバーでのアドセンスの関連コンテンツユニット表示」をしているサイト・ブログは少ないので、勝手に難しいのではないかと思ってしまいそうですが、実際にはやってみたところメチャクチャ簡単に表示できました。

そこでここではサイドバーにアドセンスの関連コンテンツユニットを表示させた方法をシェアします。

ただこの設定は私が自分のWordPressブログで行ったので、すべての条件・WordPressテーマで同じように設定できるかは不明です。

ちなみに私がこの設定をしたWordPressテーマは「simplicity2」です。

 

サイドバーにアドセンスの関連コンテンツユニットを表示させる方法

サイドバーに掲載する関連コンテンツユニットを作成

アドセンスで、

左メニュー:広告 > サマリー・広告ユニットごと > 関連コンテンツ

を選択。サマリーは「広告」を押したら勝手に開きます。

 

広告 > 広告ユニットごと > 関連コンテンツ

 

さらに、

右メニュー:サイズ > カスタム

を選択します。

そしてそのカスタムには「幅」と「高さ」がありますが、「幅」はそのままで、「高さ」だけ操作します。(ただしこちらのサイズ調整はテーマにもよるかもしれませんので、テーマのサイドバーの大きさに合わせて下さい)

 

サイズ > カスタム > 高さ設定

 

私の場合は、高さを「1000」にしました。

すると、デフォルトの「300×300」でこうなってたのが、

 

これが

 

 

「ビヨーーーン」という感じで伸びて、こうなります。

 

こうなる

 

モザイクがかかってないのが広告、モザイクありが記事です。

今作成した関連コンテンツユニットだと広告は2つですが、その広告数は別に決定されてるわけではないと思います。

そして広告と記事の表示スペースは、デフォルトの「300×300」では3個、「300×1000」だと12個になりました。

 

長さはまだ伸ばせるのかもしれませんが、欲張って長く表示させすぎると表示されないという声もあったので、そこは適度にやった上で自サイトの表示を確認してください。

 

というわけでこの広告を使用することにします。

 

広告ユニット名を記入し、「保存してコードを取得」をクリック。

この時、「保存してコードを取得」をクリックしたらもうその時点で新しい広告が作成されてしまいます。

アドセンスでは新しいのを作るのは簡単ですが、既に作った広告は、非表示はできても削除はできないようです。余計なものを作るとちょっとウザイので、よく確認してから「保存してコードを取得」を押しましょう。

 

広告ユニット名・記入 > 保存してコードを取得

 

 

そして次のページでコードをコピーしたら、「完了」を押します。
「完了」は押さなくても同じかもしれませんが、いちおう押しといた方が安心かと思います。

 

コードをコピー > 完了

 

AMPは私のサイトはしてないので分かりませんが、たぶん対応している人はそちらでもいいんでしょう。

作った関連コンテンツユニットは、広告・サマリー > 「広告ユニットごと」の「既存の広告ユニット」の箇所でいつでもコードコピーや編集ができるようになります。

 

サイドバーウィジェットに表示させる

次にサイドバーで表示できるようにします。

 

サイト編集で、 外観 > ウィジェット を選択。

私はsimplicity2のブログで、「クラシックテキスト」を用いて表示させました。

ドラッグしてサイドバーに移動させ、先ほどコピーしたコードを「内容」欄に貼り付けます。

 

サイドバーにクラシックテキストで貼り付け

 

これで表示されるはずです。

 

表示の確認

サイトにアクセスしてチェックします。

無事にサイドバーに表示された

 

ちゃんと表示されてました。

というわけでこれで完了です。

 

サイドバーに関連コンテンツユニットを貼ると表示スピードが落ちる

注意点が一つあります。

それは、サイドバーに関連コンテンツユニットを貼ると、少しサイトの表示スピードが落ちるかもしれない、ということです。

ちょっとテストして比べてみました。スピードテストには、有名な「PageSpeed Insights」と「GTmetrix」の両方を用いました。

PageSpeed Insights 

GTmetrix

 

広告表示の変更は、具体的に言うと、今まで表示していた300×250の広告を、300×1000の関連コンテンツユニットに変更しました。

 

また御存知の方もおられるでしょうが、スピードテストは用いるツールなどにもよるので、数字が落ちたからといってただちに大問題なのかどうかは断定できません。

それでも、数字が落ちて逆に早くなるというのはおそらくないので、数字の変化を無視することはできないでしょう。

 

「PageSpeed Insights」でのスピードテスト

「GTmetrix」は複数回やっても結果はほとんど変わらないのですが、「PageSpeed Insights」は違います。

そのため「PageSpeed Insights」の結果は5回分を載せます。
ほとんど時間を置かずに続けてやったものです。

before(関連コンテンツユニット表示前)を青マーカーafter(関連コンテンツユニット表示後)を赤マーカーで表示しています。

モバイル before(関連コンテンツユニット無):57、51、57、58、53
モバイル after   (関連コンテンツユニット有) :45、43、47、38、39

パソコン before(関連コンテンツユニット無):98、98、98、98、96
パソコン after   (関連コンテンツユニット有) :97、98、97、97、98

パソコンの数字がほぼ変わりませんが、モバイルの数値が10~15ほど落ちてるのが分かります。

「GTmetrix」でのスピードテスト

次に「GTmetrix」です。「GTmetrix」は複数回やっても数字が変わるのは誤差の範囲内です。

アルファベットがAに近いほど速く、%の数字は大きいほど速いです。

結果はこうでした。

 

「GTmetrix」PageSpeedスコア before A(90%)
「GTmetrix」YSlowスコア    before C(74%)

「GTmetrix」PageSpeedスコア after  D(65%)
「GTmetrix」YSlowスコア    after  D(62%)

 

「PageSpeed Insights」よりもだいぶ数字が下がっています。

 

最後に

サイドバーの関連コンテンツユニットは、見栄えがいい割にあまり見かけない気がします。

そのせいで勝手に設定が難しいのだろうと思い込んで敬遠している方もいるかもしれません。

でも実際してみると、こんなに簡単にできるのかと拍子抜けしてしまいます。

ただスピードテストで分かるように、やはり若干表示スピードは落ちるようです。

 

だから実際に掲載する場合は、見栄えもさることながら、自サイトの表示スピードの変化などとの兼ね合いを見て貼った方がいいと思います。

この記事は以上になります。