WordPressにアドセンスの広告付きカスタム検索ボックスを設置する方法

サイバーマンデー
Amazonプライム会員限定の大セール「サイバーマンデー」開催中!プライム会員限定の大セール

このサイトは、これまでWordpressデフォルトの検索機能を使っていました。

Wordpressデフォルトの検索

ただ、Search Meter(検索キーワード記録)プラグインなどで見ていると、最近検索数も多くなってきて、負荷も高くなってきているのではないかと思います。なので、検索機能は、Googleにアウトソーシングでまかせてしまうことにしました。

ついでに、アドセンスから、検索ボックスを作成することで、広告つきのものを作成してみたいと思います。

今回作成するのは、こんなやつ。

Googleカスタム検索

検索結果は以下のようになります。

カスタム検索結果画面

ということで、今回は、アドセンスのカスタム検索を設置する方法の紹介です。

photo by Jon Russell

スポンサーリンク
レクタングル(大)広告

主な手順

アドセンスのカスタム検索を設置するには、主に以下の手順を行います。

  1. Google AdSenseに登録&ログイン
  2. Google AdSenseから「カスタム検索エンジン」の設定
  3. カスタム検索エンジンのコードをサイトに貼り付ける
  4. CSSでスタイルを整える

アドセンスに登録&ログイン

まずは、アドセンスのカスタム検索を作成するには、AdSenseに登録してある必要があります。

以下では、アドセンスには登録してあるいうことで説明していきます。

まずは、AdSenseからログインして管理画面に入ってください。

アドセンスにログイン

検索広告の設定

管理画面のメニューバーから「広告の設定」をクリックしてください。

アドセンス管理画面のメニューバー

すると以下のような画面が表示されると思うので、サイドメニューから「検索」を選択します。

広告の設定- Google AdSense

以下のように表示されるので、「新しいカスタム検索エンジン」ボタンをクリックします。

広告の設定- カスタム検索エンジン

ボタンを押すと、以下のような設定画面にページ遷移します。

カスタム検索エンジン作成設定

以下で、1つ1つ詳しく説明していきます。

基本設定

まずは、基本となる情報を入力します。

2015-04-12_12h42_43

通常サイトの場合、以下のように入力するとお勧めです。

名前

名前の設定・カスタム検索

後で簡単に見つけて設定を編集できるよう、検索ボックスに覚えやすくわかりやすい名前をつけます。この名前はアーカイブに表示されないため、自分で管理しやすいように設定します。

アドセンス上で設定を識別するための名前を入力してください(なんでもOK)

カスタム検索の名前の設定例

検索の対象

検索の対象・カスタム検索

この検索ボックスでユーザーが検索可能なウェブサイトを選択します。WEB上のすべてのサイトを検索できるように設定するか、特定のウェブサイトだけを検索できるように設定することができます。

今回は、サイト内検索なので、以下のように「選択するサイトのみ」を選択後、URLを指定して特定のウェブサイトだけを検索します。

検索対象の設定例

入力ボックスに複数のURLを指定することで、複数サイトを横断検索できる検索ボックスを作ることもできます。

キーワード

キーワード・カスタム検索

キーワードは、検索エンジンの検索結果に最も関連性の高い広告とページ表示する目的で使用されます。良いキーワードとは、検索エンジンのトピックや宣伝するページのコンテンツを説明する単語や短いフレーズです。

通常サイトの場合は、特にキーワードを設定する必要はないと思います。

キーワードの設定例

詳しくは以下を参照してください。

参考 検索向け AdSense 用のキーワードを追加する – AdSense ヘルプ

セーフサーチ

セーフサーチ・カスタム検索

Googleのセーフサーチでは、アダルトサイトや性的なコンテンツを含むサイト説明し、検索結果に表示されないようにします。フィルターが100%確実であることを保証することはできませんが、GoogleのフィルタではGoogle独自の高度な技術を使用してキーワードやフレーズ、URL、Open Directoryのカテゴリを確認しています。

アダルトサイト運営でない限りは、「セーフサーチを使用する」をオンしておいた方が良いかと思います。

セーフサーチの設定例

国または地域

国または地域・カスタム検索

検索ボックスで検索する際に、どの国のGoogle検索を使用するか指定します。例えば、google.com、google.co.jp、google.frなどから検索結果を表示することができます。

サイトの対象者が日本人向けなら、「日本」にします。

国または地域の設定例

サイトの言語

サイトの言語・カスタム検索

サイトの仕様言語です。

主に日本語で書かれたサイトなら、日本語に設定します。

サイトの言語設定例

文字変換

文字変換・カスタム検索

検索エンジンで音訳を有効にした場合、サイトの訪問ユーザーが別の言語のクエリを英語の発音で表現して入力すると、そのクエリが意図した言語に変換して表示されます。

音訳を有効にした場合の設定です。特に不要なので、何も選択しません。

文字変換の設定例

詳しくは以下を参照してください。

参考 文字変換 – カスタム検索 ヘルプ

人気クエリ

「人気クエリを使用」にチェックを入れると、アドセンス検索向け広告ユニットで検索された結果に応じて、よく利用されるキーワードリンクのタグがデフォルトで10個表示されます。(表示数は変更することができます。)

人気クエリの設定例

後からでも追加することができるので、最初は検索実績がたまるまで、オフにしておいても良いかと思います。(設定を変更した場合は、後から新たなコードを貼り付ける必要はあります。)

カスタムチャンネル

カスタムチャンネル・カスタム検索

カスタムチャネルを使用すると、希望の分類(サイズやページでの掲載時など)で広告ユニットを組み合わせてまとめることができます。これによりカスタムチャンネルごとにパフォーマンスをトラッキングできるほか、カスタムチャンネルの設定で、広告主が広告のターゲットとして指定出来る広告プレースメントにすることもできます。

簡単に説明すると、カスタムチャンネルを設定することで、広告ごとのパフォーマンスを計測できます。後からでも再設定できるので、作成時に必ず設定する必要はありません。

カスタムチャンネルの設定例

詳しい方法は以下を参照してください。

参考 カスタム チャネルで広告のパフォーマンスをトラッキングする – AdSense ヘルプ

検索ボックスのスタイル

検索ボックスの際は、サイトのデザインに合わせて変更してください。

検索ボックスのスタイル・カスタム検索

通常の白地のページの場合は、デフォルトの設定でOKかと思います。

以下でも、デフォルトの設定にしてあることとして、スタイルの設定を行います。

広告スタイル

広告のデザインを選択します。

広告スタイル・カスタム検索

特にこだわりがない場合は、デフォルトのものを選択するのをお勧めします。

詳しくは以下を参照してください。

参考 テキスト広告スタイルの作成、編集、適用 – AdSense ヘルプ

カスタム検索

検索結果の表示方法を選択します。新しいタブに検索結果を表示する場合は「新しいウィンドウのGoogleページに表示」を選択します。

検索結果・カスタム検索

あとは、個別ロゴに関する設定です。検索結果ページのデザインにも、こだわりたい場合は、ロゴなどを設定します。

設定の確定

最後に「保存してコードを取得」ボタンを押せば、設定が保存され、コードが表示されます。

保存してコードを取得ボタン・カスタム検索

コードをサイトに貼り付ける

「保存してコードを取得」ボタンを押すと以下のようなダイアログが表示されます。「検索ボックスのコード」を選択してコピーします。

検索ボックスのコードが生成される

このコードは、アドセンスの設定画面からいつでも取得することができます。

カスタム検索一覧

WordPressでサイドバーに貼り付けるには

例えば、Wordpressでサイドバーなどに貼り付けるには、Wordpress管理画面から「外観→ウィジェット」を選択します。

テキストウィジェットを表示したい箇所にドロップします。

テキストウィジェット

あとは、先程コピーしたコードを貼り付けて保存するだけです。

Wordpressにアドセンスカスタム検索を設定

スタイルシートの設定

最後に、設定したコードの表示を確認します。

例えば、Wordpressにデフォルトで入っているTwenty Fifteenで確認すると以下のように表示されます。

スタイルシートを修正する前

これだと、入力ボックスと、検索ボタンが上下段違いになっています。例えば、これを1列に表示したければ、以下のようにスタイルシートをstyle.cssなどに記入します。

すると、スタイルが適用されて以下のように表示されます。

スタイルシート修正後

テーマによっては、表示は変わってくるかもしれませんが、上記のCSSセレクターなどを参考に、好みのスタイルに変更してください。

動作確認

当サイトの場合は、以下のような検索ボックスになりました。

寝ログの検索ボックス

検索をすると、以下のように広告込みの検索結果が新しいタブに表示されます。

WindowsiGoogle Custom Search

思い通りの動作になりました。

まとめ

今回の設定を行うことで、自サイトに手軽に広告つきのGoogleカスタム検索を設置することができます。

WordPressのデフォルト検索でも良いのですが、検索速度は格段にこちらの方が早いです。加えて、検索結果画面もGoogleライクでなじみがあるので、訪問者にも見やすいのではないかと思います。(広告は邪魔かもしれませんが)

アドセンスのカスタム検索は1ページに2つまで設定することができます。通常のアドセンスユニットよりも、表示回数はかなり少ないとは思いますが、多少の広告報酬アップも計れるのではないかと思います。

『WordPressにアドセンスの広告付きカスタム検索ボックスを設置する方法』へのコメント

  1. 名前:N 投稿日:2015/04/20(月) 00:20:23 ID:412aa8ddb

    窓の杜のように表示順の選択肢を付ける方法はありますか?

  2. わいひら 名前:わいひら 投稿日:2015/04/20(月) 13:15:51 ID:a354a5ba1

    設定を調べてみたら、以下のように行うとできるようです。

    個別の広告の設定画面で、「保存して行動取得」する前に「その他の検索オプション機能」をクリックします。

    「検索機能→詳細設定→検索結果の並べ替え」をオンにすると並べ替えができるようになるようです。

  3. 名前:N 投稿日:2015/04/20(月) 20:24:24 ID:412aa8ddb

    出来るんですね。
    回答ありがとうございました。