【WordPress】一覧や詳細ページに別々のテンプレートを割り当てる

どうも松井です。

WordPressでは、固定ページで別々のテンプレートが適用できたように、一覧ページでも別々のテンプレートをカンタンに適応することができます。

例えば、お知らせや実績で全体的なレイアウトを変更したいと思う時に有効です。今回は、一覧だけではなく、詳細のフォーマットとの割り当て方法も纏めています。

大まかな流れ

流れは、3ステップでカンタンです。

  • カテゴリーのテンプレートを作成する
  • ループ処理を行うテンプレートの作成
  • シングルページのテンプレートを作成する

カテゴリーのテンプレートを用意する

まず一覧のテンプレートは、category.phpで書いていくため、フォーマットを作りたい分だけ作成します。名前は、category-{slug}.phpの{slug}部分をわかりやすい名前に変更して作成します。

ちなみに{slug}部分が、urlのhttps://xxxxxx.jp/works/の/works/とイコールとなるため、slug名にはカテゴリ名をつけましょう。

これで、お知らせや実績でのレイアウトを変更できますが、繰り返し処理する部分も変更する必要があるので、loop.phpをみていきます。

ループ処理を行うテンプレートの作成

loop.phpは、一覧ページで繰り返し表示させたいもの記述するため、こちらもカテゴリー同様、フォーマットが必要な分だけ作成します。名前は、loop-{slug}.phpの{slug}部分を変更します。カテゴリーの複製と同じですね。名前もカテゴリーと同じ名前にするとわかりやすいかと思います。

これで一覧部分の表示フォーマットは、別々のテンプレートを適応できます。一覧が変更できれば、詳細ページも変更してきましょう。

シングルページのテンプレートを作成する

シングルページもカンタンで、single-{slug}.phpを作成して{slug}部分を変更するだけ。こちらもループ,カテゴリーの名前と統一したもので作成します。

これで、カテゴリー→ループ→シングルまでの流れを作成でき、カテゴリーごとに表示を切り替えることができます。

松井 貴史

松井 貴史

RUBY DESIGN. 代表 スタートアップや企業のサービスのフロントに関わるデザインや実装の仕事をしています。現在、リソースシェアサービスサービスを開発中/完全朝型/熊本出身 リモートチーム募集中です。詳しくはお知らせをご覧ください。

類似記事

なくなる事は今後を考えるチャンス

制作時間を短縮できるwebサービスパレット(打ち合わせ〜進行やりとり編)

制作時間を短縮できるwebサービスパレット(打ち合わせ〜進行やりとり編)

Sassの導入とgulp4でコンパイルして自動監視する方法

プログラマー とデザイナーが入れ替わってサービスを作る