SWELLで検索窓を設置する方法と見やすいカスタマイズ

※本記事はアフィリエイト広告を含む記事へのリンクを含みます。

記事が増えてくると、読者が「あの記事どこだっけ」と探しにくくなってきます。メニューやカテゴリーだけでは、目的の記事にたどり着けないこともありますよね。検索窓をわかりやすい場所に置けば、読者が自分で記事を見つけられます。

この記事では、SWELLで検索窓を設置・カスタマイズする方法を手順付きで解説します。私が実際に試して効果があった置き場所や、つまずいたポイントもお伝えしますね。プラグインなしで、今日から設置できますよ。

※まだSWELLを導入していない方へ:SWELLは買い切り型のWordPressテーマなので、一度購入すれば追加費用なしでずっと使えます。この記事で紹介している設定も、ブロックエディタ上でクリックするだけで再現できますよ。

➡️【公式】SWELLの購入ページはこちら

デザインに悩む時間を減らして、記事を書くことに集中できる環境が手に入ります。

ニャフィ

ブログに検索窓を置きたいけど、どこがいいのかにゃ?

たいがブログ

記事が増えると必要になりますよね。SWELLなら簡単ですよ。

ニャフィ

見た目も変えられるのか気になるにゃ。

たいがブログ

置き場所と見た目の整え方を、順番にご紹介しますね。

▼あわせて読みたい:記事が増えても快適に検索・表示できるかは、サーバーの性能にも左右されます。ブログの土台になるサーバー選びはこちらで解説しています。

あわせて読みたい
エックスサーバーの評判は本当?初心者ブログで実際に使ってみた正直レビュー 本記事はアフィリエイト広告を含みます。 「エックスサーバーって評判いいって聞くけど、初心者の自分でも本当に使いこなせるのかな」と不安になっていませんか。 サー...
目次

SWELLの検索窓とは?設置前に知っておきたい基本

検索窓は、読者がキーワードを入力してブログ内の記事を探せる入力欄です。記事数が多いブログほど、読者が迷わず目的の記事にたどり着くために役立ちます。

SWELLでは、サイドバー・ヘッダー・記事内など、いくつかの場所に検索窓を置けます。どこに置くかで、使われやすさが大きく変わります。

検索窓を設置するメリット

検索窓があると、読者は読みたい記事を自分のペースで探せるようになります。私もサイドバーに検索窓を置いてから、「ブログ内で何が調べられているか」が見えるようになりました。読者の関心を知るヒントにもなるのは、うれしい発見でした。

スマホではサイドバーが下に回ることに注意

スマホ表示では、サイドバーは記事の一番下に回り込むのが一般的です。私はこれを知らず、サイドバーだけに検索窓を置いていて、スマホの読者にほとんど使われていませんでした。スマホ向けにはヘッダーの検索ボタンも用意しておくと安心です。

SWELLで検索窓を設置する方法

ここからは、もっとも基本的なサイドバーに検索窓を設置する手順を見ていきましょう。WordPress標準の「検索」ブロックを使います。

以前使っていた別のテーマでは、検索窓のデザインが浮いて見えて、追加CSSで整える必要がありました。SWELLは標準の検索ブロックでも自然になじむので、置くだけで見た目が整います。

検索ブロックはボタンの見た目を変えられる

検索ブロックは、ツールバーからラベルの表示やボタンの位置、アイコン表示などを切り替えられます。ボタンを虫眼鏡アイコンにすると、すっきり見えますよ。

入力欄の案内文で検索を促す

入力欄には、「キーワードを入力」などの案内文を表示できます。「例:サーバー 比較」のように具体例を書くと、読者が検索しやすくなります。

STEP
ウィジェット画面を開く

管理画面の「外観」→「ウィジェット」をクリックして、ウィジェットの編集画面を開きます。

STEP
サイドバーのエリアを開く

一覧から共通サイドバーなどのエリアを開き、検索窓を置きたい位置を決めます。

STEP
検索ブロックを追加する

「+」ボタンから「検索」ブロックを選んで追加します。サイドバーの一番上に置くと目に入りやすいですよ。

STEP
ボタンと案内文を整えて更新する

ツールバーでボタンの見た目や案内文を整え、「更新」をクリックして保存します。

STEP
実際に検索して動作を確認する

サイトを開いてキーワードを入力し、検索結果のページに記事が表示されるか確認したら完了です。

検索窓をもっと使ってもらうカスタマイズのコツ

サイドバーに検索窓を置けたら、次はスマホの読者にも使ってもらえる配置を整えていきましょう。置き場所を少し増やすだけで、検索の使われ方は大きく変わります。

大切なのは、読者が「探したい」と思った瞬間に検索窓が目に入ることです。読者の動きに合わせた配置を意識しましょう。

ヘッダーに検索ボタンを表示する

SWELLでは、カスタマイザーの「ヘッダー」の設定から検索ボタンを表示できます。ヘッダーにあれば、スマホでもページの一番上からすぐに検索できますよ。私もヘッダーに検索ボタンを置いてから、スマホからの検索利用がはっきり増えました。

カテゴリーページや記事内にも置いてみる

検索ブロックは、記事の中やカテゴリーページの案内にも置けます。私は記事数の多いカテゴリーに検索窓を添えたところ、読者が目的の記事を見つけやすくなりました。別のテーマでは配置ごとに見た目がばらついていましたが、SWELLはどこに置いてもデザインがそろうのが助かります。

▼あわせて読みたい:読者がどんな言葉で記事を探すかを知れば、検索されやすい記事づくりにも活かせます。無料から使えるキーワード調査ツールの実力はこちらで正直にレビューしています。

あわせて読みたい
ラッコキーワードレビュー|無料から使えるキーワード調査ツールはブログ運営に本当に使えるか正直に話... 本記事はアフィリエイト広告を含みます。 「ラッコキーワード、無料で使えると聞くけど、有料プランまで必要なのか正直知りたい」という人はいませんか。記事のネタを探...

SWELLの検索窓設置でよくある質問

検索結果に固定ページも表示されます。

WordPressの標準の検索では、投稿だけでなく固定ページも検索対象になります。プロフィールなどが出てきても、仕組み上の動きなので心配いりません。

読者が何を検索しているか知る方法はありますか?

Googleアナリティクス(GA4)のサイト内検索の計測を使えば確認できます。よく検索される言葉は、次に書く記事のヒントになりますよ。

検索窓を追加したのに表示されません。

ウィジェット画面で「更新」を押したか確認しましょう。保存済みなら、キャッシュを削除してブラウザを再読み込みすると反映されることが多いですよ。

記事が少なくても検索窓は必要ですか?

記事が少ないうちは、カテゴリーやメニューで十分探せることもあります。30記事を超えてきたあたりで設置しておくと、ちょうどよいタイミングです。

【当サイト限定特典】:今月中に下記の公式特設ページから申し込むと、最大30%OFF(月額693円〜)の圧倒的コスパで国内シェアNo.1の超高速環境が手に入ります。

➡️【公式】エックスサーバーの限定特設ページはこちら

設定さえ終われば、今日からすぐにブログを書き始められます。この機会にぜひ一歩踏み出してみてください。

まとめ:検索窓で読者が記事を探しやすいブログにしよう

SWELLでは、ウィジェットに「検索」ブロックを追加するだけで検索窓を設置できます。スマホ向けにはヘッダーの検索ボタンも用意し、カテゴリーページなどにも置くのが使ってもらうコツでした。

検索窓は、記事が増えるほど読者の頼れる道具になります。まずはサイドバーとヘッダーの2か所に、検索窓を用意してみてください。

ニャフィ

検索窓から読みたい記事がすぐ見つかるにゃ!

たいがブログ

お疲れさまでした!これで読者も迷わず記事を探せますね。

ニャフィ

見つけてもらう記事の文章も、きれいにしたいにゃ。

たいがブログ

手頃な料金で使える校正ツールのレビューもぜひどうぞ。

▼あわせて読みたい:検索で見つけてもらった記事こそ、読みやすい文章で迎えたいもの。お手頃価格で始められる日本語校正ツール「Shodo」を実際に使ってみた感想をまとめています。

あわせて読みたい
Shodo(ショドー)レビュー|日本語校正ツールはブログ運営に本当に使えるか正直に話します 本記事はアフィリエイト広告を含みます。 「Shodo、無料で使えると聞くけど、有料プランまで必要なのか正直知りたい」という人はいませんか。記事を公開したあとに誤字...

おすすめ記事

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

コメント

コメントする

目次