異なるデザインの固定ページを作成する【WordPress制作入門講座】

会社概要とお問い合わせ、この２ページは固定ページを使って作ります。

• WordPressでデザインの異なる固定ページを作成する方法
• 会社概要ページをWordPress化する

WordPressでデザインの異なる固定ページを作成する方法

会社概要とお問い合わせは、デザインが違いますよね。
固定ページはpage.phpを使って表示されると紹介しましたが、page.phpという１つのファイルでどちらのデザインも再現するのは大変です。

そこで、WordPressでは、固定ページに応じて別のテンプレート（phpファイル）で表示させることができる仕組みも用意されています。

方法はいくつかありますが、簡単なのはスラッグを使う方法。
スラッグというのは、URL（パーマリンク）の末尾の部分のこと。
page-スラッグ.phpというファイル名を付けると、自動的に「スラッグ」が一致する固定ページを使ってページが表示されます。

スラッグの設定と合わせて、固定ページ部分の作成方法を見ていきましょう。

会社概要ページをWordPress化する

WordPress管理画面から、固定ページの新規追加を開きます。

タイトル部分に「会社概要」と入力してください。
右側のメニューから、パーマリンクの項目をクリック。

URLスラッグを入力します。
会社概要のページなので「company」にしておきましょう。

スラッグを入力したら、固定ページを公開してください。

次に、WordPressのテーマ（テンプレート）を作成しましょう。
company.htmlをエディタで開きます。

そのまま、名前をつけて保存/別名で保存を選択。
「page-company.php」という名前で保存してください。

page-company.phpを編集しましょう。
やることはfront-page.phpと同じく、パスの修正です。
<?php echo get_template_directory_uri()?> を使って、下記４箇所を直します。

• style.cssの読み込み
• 画像（company.png）
• 画像（images/banner.png）
• gacha.jsの読み込み

<?php echo get_template_directory_uri()?>の挿入イメージ↓

修正できたら、page-company.phpを上書き保存。
WordPressの管理画面に戻って、会社概要のページを表示してみましょう。

HTMLページと同じように表示され、格言ガチャも動いていれば成功です！

もう一つの固定ページ、お問い合わせページの作成に進みましょう。