次回から『ぶろなび』と検索ください。

SWELLでタイトル下に広告を表示する方法【カスタマイズ】

悩んでいる人

SWELLを導入したんですが、タイトル下に広告を表示する方法が分かりません。
アドセンス広告を表示したいので設定の仕方を詳しく教えてください。

そんな疑問にお答えします。

この記事の内容
  • 記事下に表示するおすすめのアドセンス広告とは
  • SWELLでタイトル下にアドセンス広告を表示する方法

本記事ではSWELLのカスタマイズ方法の1つ『タイトル下に広告を表示する方法』を紹介します。
タイトル下広告は当ブログの中でも一番クリック率がいいところです。

SWELLを導入している方はすぐにでも導入できるので、本記事を参考にして広告を挿入してみてください。
とても簡単で効果も抜群なので非常におすすめです!

それではさっそく確認していきましょう。

目次

タイトル下に表示するのはアドセンス広告一択

タイトル下の広告はアドセンス広告一択

タイトル下という場所は、一番最初に表示され必ず目に付く場所です。
その場所に目立つ広告が表示されていれば非常に目立ち非常に効果的です。

しかし、次の場合には非常にマイナス印象になるので注意しましょう。

  • 広告が大きすぎる
  • サイズがコンテンツ幅にあっておらず不自然
  • 多すぎる広告

また、アドセンスのようなクリック型広告は表示が多すぎるとWebサイトが重くなるので多くても3つが限界と思います。
Googleアドセンスのおすすめ表示場所は下記記事で詳しく解説しているのでぜひご覧ください。

>>【鉄板】SWELLのGoogleアドセンスおすすめ貼り付け箇所を解説!

ではさっそく次の項目からタイトル下に広告を表示する方法を解説していきます。

SWELLでタイトル下に広告を表示する方法

SWELLでタイトル下に広告を表示する方法

~やることリスト~
①:Webサイトのコンテンツ幅確認
②:Googleアドセンスでディスプレイ広告を作成
③:テーマエディタを編集

Webサイトのコンテンツ幅確認

まず、いい感じの広告を表示するためにWebサイトのサイト幅を確認しましょう。

サイト幅の確認方法
『外観』⇒『カスタマイズ』⇒『サイト全体設定』⇒『基本デザイン』⇒『コンテンツ幅の設定』

コンテンツ幅の設定

サイト幅というのはWebサイト全体の幅のことで、コンテンツ幅とは実際の記事が表示される幅のことです。
ここで必要なのはコンテンツ幅なので、ここの数字をメモリましょう。

画面一杯がサイト幅、記事が表示されるのがコンテンツ幅

Googleアドセンスでディスプレイ広告を作成

次にGoogleアドセンスにアクセスします。

ディスプレイ広告を選択
『サマリー』⇒『広告ユニットごと』⇒『ディスプレイ広告』を選択

広告はディスプレイ広告を選択

ディスプレイ広告の設定内容
①名前を入力
②広告サイズ⇒ 幅880(先ほど確認したコンテンツ幅) 高さ100

下画像のように設定し、作成ボタンを押します。

下画像では幅を880にしていますが、先ほど確認したご自身のコンテンツ幅に合わせて調整してください

広告サイズ設定

作成ボタンを押すと、下画像のようにアドセンス広告が表示されます。

アドセンス広告

このコードを後程使うのでコピーしておきます。

テーマエディタを編集

これからテーマエディタを編集していきますが、テーマエディタは変なところを変えてしまうと、サイトのレイアウトが崩れたり、最悪Webサイトが表示されなくなってしまいます。
編集する前に必ずバックアップと子テーマでの編集になっていることを確認してください。

今回テーマエディタを編集するコードはSWELL公式サイトを参考にさせていただきました。

コードの準備

まずは下記のようにテーマエディタに張り付けるコードを準備していきます。

アドセンス広告コードの挿入場所
【ここに広告コードをペースト】の個所に先ほどコピーしたアドセンスコードに張り替えてしてください。

/* 
  ~ functions.phpにすでにあるコード ~
*/

//以下のコードを追加
add_action('swell_before_post_thumb', function( $post_id ) {
?>
<div class="widget widget_swell_ad_widget">
   【 ここに広告コードをペースト 】
</div>
<?php
}); 

アドセンスコードを張り付けて準備ができたら次はテーマエディタを編集していきます。

テーマエディタの編集

テーマエディタの編集場所
『外観』⇒『テーマエディター』⇒『テーマのための関数』

下画像のように記載されている一番下に先ほど用意したコードを張り付けます。
この時に右上の『編集するテーマを選択』が『SWELL CHILD』になっていることを確認してください。

編集したコードを張り付け

貼り付け終わったら左下にある『ファイルを更新』ボタンを押して完了です。

ファイルを更新

更新した後、最短1時間は広告表示されないので気長に待ちましょう!
そして、下画像のように広告が表示されたら完了です。

お疲れさまでした。

目次下広告

まとめ:いい感じに表示させるためにはサイズの確認が一番大切

いい感じに表示させるためにはサイズの確認が一番大切

最後にお伝えしたいことは次の2つです。

  1. サイトのコンテンツ幅に合わせて広告を作成しよう
  2. 大きすぎない横長の広告にしよう

タイトル下というのは記事を開いて一番最初に表示されるところです。
そこに大きな広告が表示されていると、ユーザーはすぐに出て行ってしまいます。

それを防ぐためにも広告のインパクトを減らし、横に細長い広告が最適です。
色々検証した結果、このタイプの広告が一番クリック率が良かったです。

興味があれば皆さんも本記事を参考にして、広告を挿入してみてください。

もし、まだSWELLを導入していない方は下記記事をご覧ください。

今回は以上です。
おわり。

SWELLカスタマイズの関連記事

よかったらシェアしてね!

コメント

コメントする

CAPTCHA


目次
閉じる