12. 固定ページとトップページ

この章では、固定ページとトップページの作り方を学びます。

コーポレートサイトでは、トップページ、会社概要、サービス、問い合わせなどを固定ページとして管理することが多いです。

固定ページを作る

固定ページは、管理画面の「固定ページ」から作成します。

固定ページに向いている内容は次の通りです。

• トップページ
• 会社概要
• サービス紹介
• お問い合わせ
• プライバシーポリシー
• 採用情報

投稿のように時系列で並べるものではなく、サイト内に固定的に存在するページに使います。

トップページの表示設定

コーポレートサイトでは、固定ページをトップページに指定することが多いです。

管理画面の表示設定で、ホームページに固定ページを指定します。

この設定により、トップページで表示される内容やテンプレートの扱いが変わります。

テーマ側にfront-page.phpがある場合は、トップページで優先的に使われます。

front-page.php

front-page.phpはトップページ用のテンプレートです。

<?php get_header(); ?>

<main class="front-page">
    <section class="hero">
        <h1><?php bloginfo( 'name' ); ?></h1>
        <p><?php bloginfo( 'description' ); ?></p>
    </section>
</main>

<?php get_footer(); ?>

トップページはデザインが特別になることが多いため、専用テンプレートとして作ると管理しやすいです。

page.php

page.phpは、固定ページの基本テンプレートです。

<?php get_header(); ?>

<main class="page-content">
    <?php if ( have_posts() ) : ?>
        <?php while ( have_posts() ) : the_post(); ?>
            <article>
                <h1><?php the_title(); ?></h1>
                <div class="entry-content">
                    <?php the_content(); ?>
                </div>
            </article>
        <?php endwhile; ?>
    <?php endif; ?>
</main>

<?php get_footer(); ?>

固定ページの本文は、ブロックエディターで編集した内容がthe_content()で表示されます。

ページごとのテンプレート

特定の固定ページだけ別のデザインにしたい場合は、専用テンプレートを作れます。

ページスラッグがaboutなら、page-about.phpが使われます。

page-about.php
page.php
index.php

ただし、ページごとに専用テンプレートを増やしすぎると管理が大変になります。

共通化できる部分は共通化し、必要なページだけ分けます。

管理画面編集とテンプレート固定

固定ページには、管理画面で編集させる部分と、テーマ側で固定する部分があります。

たとえば、会社概要ページなら、本文を管理画面で編集できるようにすることがあります。

一方、トップページの大きなレイアウトやセクション構造は、テーマ側で固定することもあります。

クライアントが更新する必要があるかどうかで判断します。

固定ページの親子関係

固定ページには親子関係を設定できます。

たとえば、サービス一覧の下にサービス詳細ページを置くような構成です。

サービス
  Webサイト制作
  更新サポート
  運用改善

URLも親子関係に合わせることがあります。

ただし、階層を深くしすぎると管理しづらくなります。

この章のまとめ

• 固定ページは、会社概要やサービスなど固定的な内容に使う
• トップページにはfront-page.phpを使うことが多い
• 固定ページの基本テンプレートはpage.php
• ページごとの専用テンプレートも作れる
• 管理画面で編集させる範囲と、テーマで固定する範囲を分けて考える