会社概要とお問い合わせ、この2ページは固定ページを使って作ります。
WordPressでデザインの異なる固定ページを作成する方法
会社概要とお問い合わせは、デザインが違いますよね。 固定ページはpage.phpを使って表示されると紹介しましたが、page.phpという1つのファイルでどちらのデザインも再現するのは大変です。
そこで、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()?>
を使って、下記4箇所を直します。
- style.cssの読み込み
- 画像(company.png)
- 画像(images/banner.png)
- gacha.jsの読み込み
<?php echo get_template_directory_uri()?>
の挿入イメージ↓
修正できたら、page-company.phpを上書き保存。 WordPressの管理画面に戻って、会社概要のページを表示してみましょう。
HTMLページと同じように表示され、格言ガチャも動いていれば成功です!
もう一つの固定ページ、お問い合わせページの作成に進みましょう。