Wordpressテーマの販売やHTMLテンプレートの無料配布

Content Aware Sidebarsでページごとに違ったバナー広告を表示させよう

2015.12.06

自分のサイトに広告バナーを掲載している人は、「このページは違う広告バナーを表示させたいな」
「このカテゴリーに属した記事には内容にあったバナー広告を置いておきたい」
といった感じに思ったことはありませんか?

通常、サイドバーなどに置いたウィジェットなどは全部のページで同じものが表示されます。
それを切り替えてページごとに違ったものを表示させたいと思った時に役に立つプラグインがあります。
紹介するプラグインはバナー広告画像だけでなく、
他のウィジェットなどの表示切替も行えるので大変便利です。

ページごとにウィジェットの表示切替ができるプラグイン

そのプラグインというのが「Content Aware Sidebars」という無料プラグインです。

Sidebars_01

このプラグインを管理画面の「プラグイン」→「新規追加」で検索し、
インストールと有効化を行ってください。

Sidebars_02

有効化を行うと管理画面のメニューに「サイドバー」という項目が出現します。
「サイドバー」おクリックすると上記のような画面になりますので、「新規追加」をクリックします。

Sidebars_03

すると上記のような画面にに移ります。
ここでバナー画像を入れ替えるためのサイドバーを作ります。

「新規サイドバー追加」のページの上部にあるテキストフィールドに
新しく作るサイドバーの名前を入力します。
ここは自分でわかりやすい名前を入力しておきます。

次に「Add New Group」をクリックしして、
どのページのウィジェットエリアを切り替えるかの設定をします。

ここからは私が運営しているサイトを例にして説明します

参考例   http://vivivi-campaign.com/

このサイトにはサイドバーにもウィジェットエリアがありますが、
モバイル(スマホ・タブレット)で見た時に画面下部に広告が出るように、
画面下部専用のウィジェットエリアを設けています。

Sidebars_04 Sidebars_05

サイト内の広告は基本的にサイドバーも画面下部もアドセンス広告を貼ってあります。
ですが、ページによって違う広告を出したかったので、
「Content Aware Sidebars」プラグインで切り替えを行っています。

このサイトの中に「二重まぶたの作り方」というカテゴリーがあります。
このカテゴリーの記事の内容は、Youtubeにアップされている二重まぶたにする方法の動画を紹介し、
その動画の内容について記事を書いています。
あと「投稿」で作った記事にも二重まぶたに関する内容のページがあります。

この「二重まぶたの作り方」というカテゴリーと二重まぶたに関する投稿記事には、
「二重記念美」という二重まぶた用商品の広告を載せたかったので、
それ専用のウィジェットエリアを作りました。

設定は以下のようになっています。

Sidebars_06

「Add New Group」で切り替えを行いたいカテゴリーやページを追加します。
設定画面の右の枠にある「オプション」で表示設定を行います。

【表示】
「単一」「単一&アーカイブ」「アーカイブ」から選ぶことが出来ます。
「Add New Group」でカテゴリーを選択している場合、
「単一」はそのカテゴリーに属している個別ページの中のウィジェットエリアを切り替え。
「アーカイブ」はそのカテゴリー一覧ページのウィジェットエリアだけを切り替え。
「単一&アーカイブ」はそのカテゴリーに属した記事の中と
カテゴリー一覧ページのウィジェットエリアを切り替え。

【処理】
ここでどのように処理するかを選択できます。ここは「置換」のままでOKです。
その下のプルダウンメニューはそのウィジェットエリアを置き換えるかを選択できます。

例にしているサイトのテーマ「Movist」では通常のサイドメニューの上下に、
広告用に「サイドメニュー(上部)」というウィジェットエリアを作っていますので、
そこを切り替えています。

サイドバー作成&設定が終わったら

設定が終わったら内容を保存し、管理画面の「外観」→「ウィジェット」のページへ。

Sidebars_07

管理画面のウィジェットページに行くと、先ほど作ったウィジェットエリアが追加されています。
水色の帯がついているウィジェットエリアが、
「Content Aware Sidebars」プラグインで作成したウィジェットエリアです。
(※ 例にしているサイトは他にもウィジェットエリアを作ってあるので、
複数の作成したウィジェットエリアがあります。)

作成したウィジェットエリアに、ウィジェットを追加して広告バナー画像を設定しています。

設定を完了させると、下記のような表示になります。

Sidebars_09 Sidebars_08

Sidebars_10

このような感じで、「二重まぶた」カテゴリーに属した記事と「二重まぶた」カテゴリー一覧のページ、
自分で指定した二重まぶたに関する記事の中の広告バナーの置き換えをすることができます。

モバイル用の画面下部広告の切り替えもしたかったので、
上記でおこなったような設定をして置き換え用のウィジェットエリアを作り、
モバイル用画面下部広告の置き換えもしています。

Sidebars_05 yaji Sidebars_11

 

「二重まぶた」カテゴリーの他は、「コスプレメイク」というカテゴリーなどもあるので、
そこではサイドバーはコスプレ用ヘアウィッグの広告、
モバイル表示時の画面下部ではをカラーコンタクトの広告を表示させたりなどもしています。

「Content Aware Sidebars」プラグインは広告画像だけでなく、
いろいろなウィジェットの置き換えができますので、
「このページは違ったウィジェットを設置したい」と思った時は、
このプラグインを使うと良いと思います。

ぜひ使ってみてください。

当サイトに掲載された記事・写真の無断転載を禁じます
Copyright 2015 HTM-WEB All Rights Reserved.