本テンプレートサイトでは、固定ページの作成方法として以下の2つの方法を使い分けています。
- テンプレートを使用するページ
- SWELLのブロックエディターのみで作成するページ
ページの目的やデザイン要件に応じて、適切な方法を選択してください。
目次
固定ページ作成の基本フロー
固定ページが表示される際の処理の流れは以下の通りです。
- まず
page.phpが読み込まれる page-templatesフォルダ内にスラッグと一致するテンプレートを探す- テンプレートが存在すればそのテンプレートを読み込む
- 最後にWordPress管理画面で入力された本文が表示される
テンプレートの読み込みルール
page.php 内では、ページのURIを取得し、それに対応するテンプレートファイルを自動で読み込む仕組みになっています。
$request_path = trim(get_page_uri($the_id), '/');
$template_path = get_stylesheet_directory() . '/page-templates/' . $request_path . '.php';
このため、ページのスラッグとテンプレートのパスが一致している必要があります。
例
| ページURL | 読み込まれるテンプレート |
|---|---|
| /reason | page-templates/reason.php |
| /privacy-policy | page-templates/privacy-policy.php |
| /service/seo-consulting | page-templates/service/seo-consulting.php |
| /solution/youtube | page-templates/solution/youtube.php |
親子ページの場合は、フォルダ構造も同じになります。
テンプレートページのコーディングルール
テンプレートファイルでは、以下の点に注意してください。
h1はテンプレートに書かない
h1はWordPress管理画面で設定したページタイトルが自動で表示される仕組みになっています。
そのため、テンプレート内でh1を書く必要はありません。
main / article は書かない
page.php 側で
- main
- article
などのレイアウトタグは自動で出力されます。
そのためテンプレートでは、いきなりページのコンテンツを書き始めて問題ありません。
例
<div class="page-container">
<section>
コンテンツ
</section>
</div>
テンプレートを使わないページの作成方法
簡易的なページを作成する場合は、テンプレートを作らずにSWELLの管理画面のみで作成しても問題ありません。
この場合は通常の固定ページとして作成します。
作成手順
- WordPress管理画面
- 固定ページ
- 新規追加
- ブロックエディターでページを作成
テンプレートなしページの例
以下のページは、テンプレートを作らずにSWELLのブロックエディターのみで作成しています。
あわせて読みたい
鳥屋直弘 | 株式会社BIRDY 代表挨拶
期待値を常に超えていく 株式会社BIRDYは、お客様がYouTubeを活用したビジネス展開をお手伝いする、最適なパートナーでありたいと考えています。近年では様々な業種にお...
テンプレートを作るべきページ
以下のような場合は、テンプレートファイルを作成します。
- LPなど固定レイアウトが必要
- FVなど特殊デザインがある
- 同じ構造のページを複数作る
- ブロックエディターでは再現が難しい
例
- サービスページ
- LPページ
- 料金ページ
ブロックエディターのみで作るページ
以下のような簡易的なページは、ブロックエディターで作成します。（デザインが複雑な場合はコーディングOK）
- 代表挨拶
- 会社概要
- プライバシーポリシー
- 採用情報
- お知らせ
運用ルールまとめ
固定ページ作成時は以下を判断基準にしてください。
テンプレートを作るページ
- デザイン固定
- 共通構造
- LP型ページ
- サービスページ
テンプレートを作らないページ
ブロックエディターで作れるページ
テキスト中心
シンプルなページ
更新頻度が高いページ