Font Awesome
WordPress

ワードプレスサイト内にGoogleカスタム検索窓を表示する方法

WordPress
この記事は約3分で読めます。
記事を書いた人
プロフィールナナ
ねこ好きの40代専業主婦
【保有資格】FP2級、簿記2級、宅建、登録販売者
簿記1級勉強中!

ワードプレスサイト内に、「サイト内検索」を表示すると、ブログの記事を検索できて便利ですよね。

でも他の人のブログを見てみると、表示が「Googleの検索窓」になっていて、

どうすればGoogleの検索窓になるの?

・・・と疑問に思ったことはありませんか?

今回は、ワードプレスサイト内に、Googleのカスタム検索窓を表示する方法を紹介します。

こんな人におすすめの記事
  • サイドバーにGoogleカスタム検索窓を表示したい人
  • 検索窓は表示できるけど、Googleの検索窓が表示できない人

Googleカスタム検索を表示する方法

Googleカスタム検索を表示するためにすることは、以下の3つです。

  1. サイトの登録
  2. 検索窓の作成
  3. ワードプレスの設定
ナナ
ナナ

色々設定が多いですが、紹介している順番通りに設定すれば、大丈夫ですよ。

検索窓を表示するサイトを登録する

Sign in - Google Accounts

Programmable Searchから、Googleのサイトにいきます。

「検索エンジンの編集」の下側にある、「追加」をクリックします。

表示されたページに、以下の内容を入力します。

  1. 検索するサイトに、自分のブログのアドレスを入力
  2. 言語は、日本語を選ぶ
  3. 検索エンジンの名前は、自分のブログ名など、好きな名前を入力、何でもOK

全て入力したら、「作成」をクリックします。

これでサイトの登録ができました。

次は、検索窓を作ります。

検索窓の作成

アドセンスの収益化を有効にする

検索窓の作成の前に、Googleアドセンスを利用している人は、アドセンスの収益化を有効にするために、広告の設定を行います。

左側のメニューの「検索エンジンの編集」をクリックします。

ブログ名が表示されていない場合は、一覧から、検索窓を表示するブログ名を選びます。

左側のメニューの「設定」→上側のメニューの「広告」をクリックします。

検索エンジンの収益化」をオンにします

広告の設定は、これだけです。

検索窓のレイアウトを設定する

次は検索窓のレイアウトを設定します。

左側のメニューから、「デザイン」→表示された画面にある、「Googleがホスト」を選びます。

「保存してコードを取得」をクリックして、表示されたコードをコピーします。

Googleの設定は、これで全て終わりました。

ナナ
ナナ

お疲れ様でした。あとはワードプレスの設定だけです。もう少しで表示できますよ。

ワードプレスの設定

次は、ワードプレスの設定です。

ダッシュボードの左側のメニューから、サイドバーの「外観」→「ウィジェット」をクリックします。

利用できるウィジェットの一覧の中から、「カスタムHTML」をクリックします。

一覧から、サイト内検索を表示したい場所を選びます。

ナナ
ナナ

サイドバーを選んだ場合を説明しますね。

「サイドバー」→「ウィジェットを追加」をクリックします。

カスタム HTMLに以下の内容を入力します。

  • タイトルに、「サイト内検索」と入力
  • 内容に、先ほどGoogleの設定時に「入手したコード(コピーの場合は、貼り付け)」を入力

設定を保存すれば完了です。

これでサイドバーに、Googleカスタム検索が表示されるようになりました。

まとめ

今回は、ワードプレスサイト内にGoogleのカスタム検索を表示する方法を紹介しました。

紹介した手順通りにすれば、簡単に表示できるので試してみてください。

この記事を書いた人
ナナ

このサイトを運営しているナナです。

ねこ・株式投資・節約・資格取得・音楽鑑賞・断捨離が好きです。
何でもやりたいことはやってみる!
というチャレンジ精神でブログを始めました。

1度きりの人生楽しまなきゃ損!がモットーです。

お問い合わせやご意見はこちらからお願いします。

ナナをフォローする
ナナをフォローする
ねこのライセンス
error:Content is protected !!
タイトルとURLをコピーしました