【初心者向け】テンプレート階層を使ってレイアウトの違う固定ページを作成する【WordPress化】

以前作成した固定ページはsingle.phpをほぼコピーしただけのシンプルなものでした。

しかし「固定ページによってレイアウトを変えたい！」という場合もあると思います。

こばゆた

例えば「お問い合わせ」ページと「アクセス」ページのレイアウトが同じだと変ですよね

きなこ

でもすでに作っちゃった場合どうしたらいいの？

こばゆた

テンプレートファイルにはテンプレート階層があってページごとの優先順位がつけられているんだよ

それを使うことで自分の表示させたいページをある程度自由に出すことができるんだ

もちろん固定ページだけじゃないけど今回は固定ページを例にやっていくよ

1.テンプレート階層

こちらがテンプレート階層の図です。

この図の左側に行くほど方優先順位が高いので

“page-スラッグ名.php” > “page-記事id.php” > page.phpになっています。

つまり“page-スラッグ名.php”か”page-記事id.php”を使うことで通常の固定ページよりも優先して表示されるということになります。

参考

スラッグ名はどこかというと記事編集のところで決めたやつですね。

記事idは記事タイトルにカーソルを載せるとリンクに現れる番号がそれです。

今回は前者の”page-スラッグ名.php”で作成していきます。

テンプレート階層を使用した固定ページの作り方

STEP1
専用の固定ページを作成する
「ごあいさつ」のスラッグ名は”greet”なので”page-greet.php”という形で新規ファイルを作成します。
STEP2
ページの中身を作成する
その中身に別に用意したHTMLファイルをコピーして入れます。

するとまだタグを埋め込んでいないので、見た目がデフォルトのままですが、他の固定ページとは異なる動きになったことがわかります。
STEP3
タグを埋め込む
復習にはなりますが、共通パーツや画像のところにタグを埋め込みます。
index.php(トップページ)を作成した時の要領です!
- ヘッダーが入っていた部分
```
<?php get_header(); ?>
```
- サイドバーが入っていた部分
```
<?php get_sidebar(); ?>
```
- フッターが入っていた部分
```
<?php get_footer(); ?>
```
- 画像ファイルの前に(/も忘れない様に)
```
<?php echo get_template_directory_uri(); ?>
```
通常の固定ページとはレイアウトの異なる固定ページができました。