評価の高い絞り込み検索を設置しました。通常の検索はページ上部のキーワード検索を使ってもらい、より詳しく検索をしたいという人向けに固定ページに絞り込み検索を設置。※固定ページで表示カタログ的なサイトを作ったりする場合にはとてもユーザービリティが高く、重宝する機能だと思います。雑記の当サイトでの有効度は不明ですが、せっかくある機能なのでひっそりと設置しました。検索が2種類あります。複数条件検索(default)とキーワード検索です。この記事であつかう絞り込み検索とは複数条件検索のことです。当サイトでは固定ページで絞り込み検索用のページを作り設置しました。固定ページにした理由は、キーワード検索に比べ絞り込み検索は読み込みに負担が掛かかるのでページ上部の共通部分で読み込ませるのは得策ではないと判断しました。詳しく検索したいと思う人は検索ページを利用してくれるだろうし、それ以外の場合は、常時表示されているキーワード検索で対応できるかと思います。複数条件検索はキーワード/カテゴリー/タグの項目が表示されます。タグはどうしても大量になってしまうので、見やすくなるよう見た目をカスタマイズしました。具体的には、タグの均等配置と検索ボタンの常駐化です。詰めが甘い仕上がりですが、デフォルトの状態よりは使いやすいかと思います。固定ページにウィジェットを挿入するプラグインをインストールページ上部以外に検索機能を設置するにはウィジェットを使います。ウィジェットだけではページを作ることができないので、ページにウイジェットを配置するプラグインを使用します。SiteOriginというプラグイン。固定ページでサイトトップなどを作るのにも便利そうなプラグインです。SiteOrigin」で検索インストールできます。インストールしたら有効化。設定はせずそのまま使用しました。Contentというプラグインが記事内にウィジェットを自由に配置できて便利そうでした。こちらは広告の配置に良さそうです。固定ページを作成プラグインを有効化したら新規固定ページを作成。エディタ右上のタブに「ページビルダー」という項目が追加されています。固定ページは以上で完成です。これで記事冒頭にある状態↓までできました。次からは見やすくカスタマイズします。追加CSSで絞り込み検索ページをカスタマイズ見た目を追加CSSで修正します。タグの並びがガタガタなので修正しつつ見やすいように簡単な背景色をつけます。検索のボタンが押しやすいようにスマホのみ画面右下に固定表示しています。追加CSS追加するCSSは以下のとおり。}}※カスタマイズは自己責任でお願いします。※表示にずれなどがある場合はご連絡いただけると助かります。あとは固定ページの入り口をどこかに表示すればOK実際のページはこちらで確認できます。class="fit_search_refine_class"][/siteorigin_widget][...]基本的な絞り込み検索の設定方法(参考)こちらはページ上部の共通部分にサーチパネルを設置する通常の設定方法です。固定ページ作る必要なく設置だけしたいという人はこちらをご参考ください。以上の設定でページ上部右側に虫眼鏡が表示され、クリックすると設定した検索方法での検索窓が表示されます。】の色を変更しました。[...]あとがき簡単にできると思って始めたら、予想外に時間がかかりました。標準では読み込み時間が・・・とか言ってる割にプラグインを使ってしまうあたりはご愛敬です。THORの絞り込み検索は良い機能だと思うので設置しましたが、当サイトで活用されることはほぼなさそうなので、毎度のことながら自己満足なカスタマイズです。いった小さな作り込みが良いサイトを生み出すと信じて自己満足していきます。コメントをキャンセルメールアドレスが公開されることはありません。karaagebow.com。