｜WordPressで絞り込み検索機能を実装する｜

【第５回】カスタム投稿の一覧ページを作成

カスタム投稿で作成したページの一覧表示ページを作成

デフォルトのレイアウト

カスタム投稿で作成した一覧ページを表示するとデフォルトのこの様なレイアウトになる。
有料テーマを除き多少異なるが何もこの程度。

今回デザインするレイアウト

今回はこのようなレイアウトにしたいので、通常の投稿で利用される一覧ページとは別にカスタム投稿用の一覧ページを作成する。

通常投稿一覧ページはデフォルトのものがあるが、今回は上記の様にオリジナルのレイアウトを作るのでオリジナルをコピーして新規のファイルを作成する。

【ファイル名の付け方】
“フィールド名”には必ずCPT UIで作成した時につけたスラッグ名にする。

テーマによって違いはあるが、通常投稿一覧ページのデフォルトはhome.phpまたはindex.phpというファイル名を使う場合が多い。
ちなみにlightningの場合はg2またはg3のディレクトリ下にあるindex.phpが対象ファイルとなる。

【今回のファイル名】archive-apparel.php

一覧に表示される商品名や価格などは第４回でやったget_field()関数やhtml、CSSを編集する。

ここまででACFを設定し、カスタム投稿ページを表示させるという部分までは完了。