X-T9 のサイトでサイト内検索した結果の画面が使いやすいようにカスタマイズしてみました。
検索結果画面のカスタマイズ内容は以下の通りです。
- 検索に使ったキーワードを確認できるように表示しました。
- 該当ありの場合、該当件数を表示しました。
- 該当なしの場合、そのことがわかりやすいようにしました。
- キーワードを追加・変更して再検索しやすいように検索ボックスを表示しました。
- サイドバーに置いたときの見た目も考えて、検索ボックスをコンパクトなスタイルに調整してあります。
カスタマイズした検索結果画面
該当ありの場合の検索結果画面
該当なしの場合の検索結果画面
検索ボックスのスタイルの CSS を書いた以外はノーコードで作ることができました。さすが、ブロックテーマですね！
↑訂正です。「条件に合うページが 0 件あります。」も CSS で消してました😓
この ↓ 検索ボックスを使って実際の検索結果画面をご覧いただけます。
投稿者プロフィール
- 魚沼情報サービス・ベクトル公式テクニカルパートナー
-
【日本全国対応】WordPress のサイト制作、設定、カスタマイズ、トラブルでお悩み、お困りの方、ベクトル公式テクニカルパートナーがお手伝いいたします。
Lightning / VK Blocks / VK Filter Search のサポート、カスタマイズを得意としています。
遠方からのご依頼の場合、打ち合わせ・サポートを Zoom や電子メール・電話などを併用して行わせていただきます。
オンラインレッスン形式でのホームページ制作サポートも行っています。お客様ご自身でホームページを制作・運用する上でうまくいかない部分をサポートいたします。設定やカスタマイズを手伝ってもらいたい、同時に便利な使い方や設定方法、カスタマイズのやり方も知ることができたら…という方にご好評いただいています。
デザイナー様、制作業者様のサイト制作のお手伝いも数多く行っています。難しい部分のコーディング ( PHP / CSS / jQuery ) をやってほしい、いま人手が足りない等、お仕事の依頼をお待ちしています。
ご要望をうかがった上で費用見積り（無料）を提示させていただきますので、お気軽にお問い合わせください。
≫メールでのお問い合わせはこちら
最新の投稿
WordPress2026年5月31日重要なお知らせを先頭に表示して新着記事一覧から除外したカスタマイズ
WordPress2026年5月29日レスポンシブ対応の段組みをブロックエディターで実装する方法
WordPress2026年5月24日Swiper の coverflow 効果の新着記事カルーセルをクエリーループで実装した例
WordPress2026年5月15日クエリーループに表示するカテゴリーに背景色を設定しました
