はじめに
この記事では、WordPressサイトの特定ページの表示を個別にカスタマイズするための方法について説明します。page.phpファイルは、固定ページが既定のテンプレートを使用しない場合に使われる重要なファイルです。
症状・背景
このテーマが必要になる主な場面:
- 固定ページごとに独自のデザインやレイアウトを適用する必要がある場合
- 1つのページで他のページとは異なる情報構造や機能を提供したい場合
- 既存のpage.phpテンプレートが一部の固定ページに適さない場合
手順・設定方法
ステップ1: ページ固有のテンプレートファイルを作成
特定の固定ページのために個別のテンプレートファイルを作成します。例えば、"about-me"という固定ページ用のテンプレートファイルは "page-about-me.php" と名付けます。
# WordPressテーマのディレクトリに移動
cd /var/www/html/wp-content/themes/your-theme-name
# 新しいテンプレートファイルを作成（例：about-meページ）
touch page-about-me.phpステップ2: テンプレート名を指定する
作成したテンプレートファイル内で、 や のように既存のテンプレート部分を利用しつつ、そのページ固有のコンテンツやレイアウトを追加します。
# page-about-me.phpを開く
nano page-about-me.php
# テンプレートファイル内に以下のようにコードを追加
<?php get_header(); ?>
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<?php
// このページ専用のコンテンツをここで定義します。
echo '<h1>私の紹介</h1>';
echo '<p>ここにあなたのプロフィール情報を表示する。</p>';
?>
</main>
</div>
<?php get_footer(); ?>ステップ3: ページ固有のテンプレートをWordPressで使用する
作成したページ固有のテンプレートファイルを使用するために、固定ページ編集画面から該当の固定ページ設定を変更します。
# WordPress管理ダッシュボードにログイン
ssh user@yourserver.com
wp shell
# 固定ページのIDを取得（例：about-meページ）
$page_id = 2;
# ページ固有のテンプレートを適用
wp post update $page_id --post_name=about-me --template-name="Page About Me"ステップ4: カスタムテンプレートのトラブルシューティング
カスタマイズしたページテンプレートが意図した通りに表示されない場合、WordPressログやブラウザのデベロッパーツールを使用して問題を診断します。
# WordPressのログファイルを開く
tail -f /var/www/html/wp-content/debug.log
# ブラウザのデベロッパーツールでエラーの確認
# コンソールタブでJavaScriptやCSSのエラーを探し、必要に応じて修正します。注意事項
- カスタムテンプレートファイルを作成する際は、WordPressテーマディレクトリ内の他のファイルと同様に適切な名前をつけてください。
- テンプレートファイル内で使用されるPHPコードやHTML構造は、既存のページテンプレートと整合性を保ちつつ独自の機能やデザインを追加することを目的としています。
- 固定ページごとに異なるテンプレートを使用する場合、管理ダッシュボードから各ページに適切なテンプレートが適用されていることを確認してください。
まとめ
1. カスタムテンプレートファイル作成: 特定の固定ページ用に個別のテンプレートファイルを作成します。
2. 既存のテーマ構造利用: 新しいテンプレートファイル内で、既存のWordPressテーマのヘッダーやフッターを継続的に使用します。
3. 固定ページ設定更新: ワードプレス管理画面から特定の固定ページにカスタムテンプレートを適用します。
4. トラブルシューティング: カスタマイズしたテンプレートが意図した通りに表示されない場合、デバッグツールやログファイルを使用して問題を解決します。
関連記事: