ブログ「ELEMENTORを使うとCustom Post Type UI・Advanced Custom Fieldsを使ったWEBサイト開発が劇的に簡単になる」ではELEMENTOR、Custom Post Type UI、Advanced Custom Fieldsを使うと、データベース型のWEBサイト開発が簡単になると説明しました。
不動産サイトや人材紹介サイトなどでWEB上でデータベースを公開すると、次に必要になるのが検索機能とフィルタリング機能です。
FacetWPはこのフィルタリング機能を簡単に作れる有料プラグインです。
デモ用サイト
それではどのように設定していけば良いか説明します。
実際にFacetWPで動作しているサイトは、私が最近オープンした以下のサイトです。様々なクラウドサービスを検索したり、絞り込んだりすることが可能です。
このようなデータベース型サイトを構築するときは、Custom Post Typeを利用するのが一般的ですが、このサイトではあえて通常のPostを利用しています。
Facetの設定
ダッシュボードのSetting>Facet WPからBasicを表示します。Add Newボタンをクリックして新規Facetを登録します。
ラベルにCategoryなど適当な名前をつけ、Facetのタイプを選びます。ここではCheckboxesを選択します。
Data sourceをPost Typeから選択します。Facet WPの素晴らしいのはタイトルやカテゴリやタグなどWordPress標準のフィールドはもちろん、カスタムフィールドもFacetの対象として設定できる点です。
その他条件設定を行います。
最後に画面右上のRe-indexボタンをクリックしてからSave changesを押してFacetを保存します。Facet WPは多分キャッシュを生成しているのだと思われます。Re-indexを押さないと正しく動作しません！
Facetの作成は以上です。設定が終わったらCopu shortcodeをクリックしてFacetのShortcodeをコピーしておきます。
Templateの作成
Facetのフィルタリング対象である投稿一覧をどのようなデザインで表示するのかをTemplateで作成します。
Templates>Add Newで新規のTemplateを作成します。
ここではFeatured Image, Post Date, Category, Post Title, Post Excerpt,Recommendation（カスタムフィールド）を表示させるようにしています。
各フィールドはグリッドに配置しています。
また右側の設定画面では１行あたりのグリッド表示数、カラムのギャップ、タイトルや抜粋文のスタイル設定が可能です。
実際の稼働画面
実際にカテゴリのチェックマークをクリックすると該当する投稿だけが絞り込まれて表示されます。
まだ大量の投稿データを登録してテストしたわけではありませんが、絞り込みの速度は速くて実用的です。
まとめ
ご覧のように一切PHPなどコードを触ることなくここまでできてしまうのは驚きです。もはや一般のWEBサービスであればデベロッパーが不要ではないかと思います。これから様々なサイトの開発に利用していきたいと思います。