【ITニュース解説】How to Build a Powerful WordPress Directory with Custom Fields and Advanced Search

WordPressは、単なるブログを作成するツールだと考えられがちだが、実はその柔軟性から、様々な種類のウェブサイトを作るための強力な基盤となる。特に、たくさんの情報を整理して、ユーザーが簡単に検索できるようにする「ディレクトリサイト」の構築には非常に適している。この解説では、言語学校のディレクトリを例に、WordPressを使ってそのような多機能なサイトをゼロから構築する方法を具体的に説明する。これは、システムエンジニアを目指す上で、既存のプラットフォームをカスタマイズして特定の要件を満たすシステムを構築する良い学びとなるだろう。

今回のプロジェクトでは、特定の場所やキーワードで学校を検索できる、包括的な言語学校のディレクトリが必要だった。これを実現するために、いくつかの強力なWordPressプラグインと少しのカスタムコードを組み合わせる。使用する主要な技術要素は以下の通りだ。まず、「Custom Post Type UI（CPT UI）」は、WordPressに「ブログ記事」以外の新しい情報の種類（例えば「言語学校」という情報）を追加するために使う。次に、「Advanced Custom Fields（ACF）」は、その新しい情報の種類に、住所や電話番号、ウェブサイトURLといった詳細なデータ項目（カスタムフィールド）を追加するために使う。さらに、「WP Ultimate CSV Importer」は、作成したデータ構造に合わせて、大量の学校情報をCSVファイルから一括でWordPressに登録するためのツールだ。最後に、「Relevanssi」は、WordPressの標準検索機能では検索できないような、カスタムフィールド内の情報まで含めて、より高性能な検索を可能にするためのプラグインである。

最初のステップは、ディレクトリに掲載する情報を、通常のブログ記事とは別に管理するための「カスタム投稿タイプ」を作成することだ。CPT UIプラグインをインストールして有効化し、管理画面から「言語学校」という新しい投稿タイプを作成する。このとき、「centre-formation」（フランス語で「トレーニングセンター」の意）のような識別用の短い名前（スラッグ）を設定する。これにより、WordPressの管理画面に「言語学校」という専用のメニューが現れ、学校の情報を独立して管理できるようになる。また、学校を地域別に分類するために、「都市（ville）」という名前の「カスタムタクソノミー」（カテゴリーのようなもの）もCPT UIを使って作成し、これを「言語学校」投稿タイプに関連付ける。

次に、各学校の具体的な情報を入力するための「カスタムフィールド」を定義する。ACFプラグインをインストールして有効化し、「学校詳細」という新しいフィールドグループを作成する。このフィールドグループは、「言語学校」の投稿タイプで表示されるように設定する。そして、このグループ内に「住所（address）」「電話番号（phone_number）」「ウェブサイトURL（website_url）」「メールアドレス（email_address）」といった具体的なフィールドを追加していく。それぞれのフィールドには、テキスト、URL、メールアドレスなど、適切なデータの種類を指定する。これにより、学校の編集画面には、これらのフィールドが表示され、構造化されたデータを簡単に入力できるようになる。

登録された個々の学校情報をユーザーに見せるためのウェブページ（単一のディレクトリ項目）の表示方法を設定する。WordPressは、特定の投稿タイプに対応するsingle-{投稿タイプスラッグ}.phpという名前のテンプレートファイルが存在する場合、それを使ってページを表示する。今回の例ではsingle-centre-formation.phpというファイルをテーマ（または子テーマ）のフォルダに作成し、その中にPHPコードを記述する。このコードは、WordPressの基本的な表示ループ（while ( have_posts() ) : the_post();）に加えて、ACFのget_field()関数を使って、先に定義した「住所」「電話番号」「ウェブサイト」などのカスタムフィールドの情報を取得し、ウェブページ上に表示するように記述する。これにより、各学校の詳細ページが、タイトルや説明文だけでなく、構造化された情報も美しく表示されるようになる。

さらに、ユーザーが学校を検索するための「検索ページと検索ロジック」を構築する。まず、検索フォームを配置するためのカスタムページテンプレート（search_centres_page.php）を子テーマに作成する。このテンプレートには、キーワードを入力する検索ボックスと、都市で絞り込むためのドロップダウンメニューが含まれるHTMLフォームを記述する。都市のドロップダウンメニューは、wp_dropdown_categories()関数を使って、先に作成した「都市」タクソノミーから自動的に選択肢を生成する。このページテンプレートを使ってWordPressに新しいページを作成すると、そこに検索フォームが表示されるようになる。

次に、実際に検索処理を行い、結果を表示するためのロジックを実装する。これは、子テーマのfunctions.phpファイルにPHPコードを追加することで実現する。このコードは、[centre_search_results]という「ショートコード」を定義する。このショートコードは、検索フォームから送信されたキーワードや都市のフィルター条件を受け取り、それに基づいてWordPressのデータベースを検索するWP_Queryという機能を使って、条件に合う「言語学校」の情報を取得する。取得した情報（学校名や住所など）は、簡単なHTML形式で一覧表示し、ページング（複数ページにわたる結果の表示）機能も追加する。このショートコードは、先に作成した検索ページテンプレート内のdo_shortcode('[centre_search_results]')という部分に記述することで、検索フォームの下に検索結果が表示されるようになる。ここで重要な役割を果たすのがRelevanssiプラグインだ。WordPressの標準検索では、タイトルや本文しか検索できないが、Relevanssiをインストールして設定することで、私たちがACFで追加した「住所」などのカスタムフィールドの内容も検索対象に含めることができ、よりユーザーの意図に沿った高度な検索が可能になる。

最後に、大量の学校データを効率的にシステムに登録する方法だ。手作業で一つずつ情報を入力するのは非現実的なので、「WP Ultimate CSV Importer」プラグインを使用する。まず、学校情報が記載されたCSVファイルを用意する。このとき、CSVファイルの各列のヘッダー（一番上の行の項目名）を、ACFで定義したカスタムフィールド名（例：address、phone_numberなど）と一致させておくことが重要だ。次に、WordPressの管理画面からインポータープラグインのページに移動し、CSVファイルをアップロードする。プラグインのインターフェースを使って、CSVの列とWordPressの各フィールド（投稿タイトル、本文、そしてカスタムフィールド）を正しく関連付けてマッピングする。このマッピングが完了したら、インポートを実行することで、CSVファイル内の全ての学校情報がWordPressデータベースに一括で登録される。

以上で、WordPressを使って、カスタム投稿タイプ、カスタムフィールド、高度な検索機能を備えた強力なディレクトリサイトを構築する基本的なプロセスが完了する。CPT UI、ACF、Relevanssiといったプラグインを適切に組み合わせ、必要な部分にカスタムコードを加えることで、単なるブログツールだったWordPressが、エンドユーザーにとって使いやすく、管理者にとっても運用しやすいデータ駆動型ウェブサイトへと変貌する。最終的な見た目を整えるためには、独自のCSSスタイルをテーマのstyle.cssファイルに追加する必要があるが、ここで説明した基盤は、より複雑なディレクトリプロジェクトにも応用できる、非常に柔軟で強力な土台となるだろう。システムエンジニアを目指す上では、このように既存のツールやフレームワークを最大限に活用し、カスタマイズすることで、多様な要件に対応できるシステムを効率的に構築するスキルが非常に重要となる。