ワードプレスサイト内に、「サイト内検索」を表示すると、ブログの記事を検索できて便利ですよね。
でも他の人のブログを見てみると、表示が「Googleの検索窓」になっていて、
どうすればGoogleの検索窓になるの?
・・・と疑問に思ったことはありませんか?
今回は、ワードプレスサイト内に、Googleのカスタム検索窓を表示する方法を紹介します。
Googleカスタム検索を表示する方法
Googleカスタム検索を表示するためにすることは、以下の3つです。
- サイトの登録
- 検索窓の作成
- ワードプレスの設定
色々設定が多いですが、紹介している順番通りに設定すれば、大丈夫ですよ。
検索窓を表示するサイトを登録する
Programmable Searchから、Googleのサイトにいきます。
「検索エンジンの編集」の下側にある、「追加」をクリックします。
表示されたページに、以下の内容を入力します。
- 検索するサイトに、自分のブログのアドレスを入力
- 言語は、日本語を選ぶ
- 検索エンジンの名前は、自分のブログ名など、好きな名前を入力、何でもOK
全て入力したら、「作成」をクリックします。
これでサイトの登録ができました。
次は、検索窓を作ります。
検索窓の作成
アドセンスの収益化を有効にする
検索窓の作成の前に、Googleアドセンスを利用している人は、アドセンスの収益化を有効にするために、広告の設定を行います。
左側のメニューの「検索エンジンの編集」をクリックします。
ブログ名が表示されていない場合は、一覧から、検索窓を表示するブログ名を選びます。
左側のメニューの「設定」→上側のメニューの「広告」をクリックします。
「検索エンジンの収益化」をオンにします。
広告の設定は、これだけです。
検索窓のレイアウトを設定する
次は検索窓のレイアウトを設定します。
左側のメニューから、「デザイン」→表示された画面にある、「Googleがホスト」を選びます。
「保存してコードを取得」をクリックして、表示されたコードをコピーします。
Googleの設定は、これで全て終わりました。
お疲れ様でした。あとはワードプレスの設定だけです。もう少しで表示できますよ。
ワードプレスの設定
次は、ワードプレスの設定です。
ダッシュボードの左側のメニューから、サイドバーの「外観」→「ウィジェット」をクリックします。
利用できるウィジェットの一覧の中から、「カスタムHTML」をクリックします。
一覧から、サイト内検索を表示したい場所を選びます。
サイドバーを選んだ場合を説明しますね。
「サイドバー」→「ウィジェットを追加」をクリックします。
カスタム HTMLに以下の内容を入力します。
- タイトルに、「サイト内検索」と入力
- 内容に、先ほどGoogleの設定時に「入手したコード(コピーの場合は、貼り付け)」を入力
設定を保存すれば完了です。
これでサイドバーに、Googleカスタム検索が表示されるようになりました。
まとめ
今回は、ワードプレスサイト内にGoogleのカスタム検索を表示する方法を紹介しました。
紹介した手順通りにすれば、簡単に表示できるので試してみてください。