固定ページのテンプレートにオリジナルを追加・作成する方法

  • このエントリーをはてなブックマークに追加
  • 0
WordPressカスタマイズ

WordPress の記事作成には、2つのタイプがあります。ひとつは投稿。もうひとつは固定ページです。その固定ページですが、テーマによってはテンプレートを選ぶことができます。例えば、WordPress にデフォルトで備わっているテーマの場合を見てみましょう。

Twenty Elevenの場合、テンプレートは3種類あります。

  • デフォルトテンプレート
  • サイドバーテンプレート
  • ショーケーステンプレート
また、Twenty Twelve の場合も3種類あります。

  • デフォルトテンプレート
  • フロントページテンプレート
  • 全幅ページテンプレート、サイドバーなし

基本的にこれらのテンプレートのうち、どれかを使えば事足りるとは思いますが、中にはちょっと違うレイアウトのテンプレートが欲しいと思う場合もあるでしょう。

特に、〝トップページのみ〟他のページとは違ったレイアウトにしたいと思う事は少なくないのではないでしょうか? かく言うぼくも、トップページのみレイアウトや表示を変えたいと思った事が多々あります。そんな時は条件分岐タグを使うのも1つの方法ですが、テンプレートファイルを新たに作成し、別のレイアウトを表示してくれる方法を使うのも手です。

この記事では、そんなテンプレートファイルの作り方を説明していきます。

事例)Twenty Eleven の場合

テンプレートファイルとは?

ここでは、WordPress のデフォルトテーマである Twenty Eleven を例に取って見て行きます。Twenty Eleven には3種類のテンプレートがありました。デフォルトテンプレート・サイドバーテンプレート・ショーケーステンプレートの3つです。これら3つのテンプレートを呼び出すファイルは次の3つです。

  • デフォルトテンプレート → page.php
  • サイドバーテンプレート → sidebar-page.php
  • ショーケーステンプレート → showcase.php

これらのファイルを開いてみてください。ショーケーステンプレートは結構複雑で、何が書かれているのかよく分かりませんが、デフォルトとサイドバーテンプレートは、結構スカスカで、簡単な作りになっているのが分かると思います。

ですが、その全ての元になっているのはデフォルトテンプレートです。よく見てみると、デフォルトテンプレートとサイドバーテンプレートの違いは、サイドバー呼び出すタグがあるかないかの違いだけです。

デフォルトテンプレート

サイドバーテンプレート

Twenty Eleven に新たにテンプレートを追加したい場合は、サイドバーテンプレートを活用すると簡単です。

(1) テンプレートファイルを複製する

まずは、サイドバーテンプレートを複製します。ファイル名は適当に付けてください。ここでは、【 sub-page.php 】としておきます。複製したファイルは子テーマのテーマフォルダにアップロードしましょう。

テンプレートファイルを複製

(2) テンプレートであることを認識させる

複製したファイルを開くと以下のようになっています(サイドバーテンプレートと同じ内容)。このファイルを新しいテンプレートと認識させるのはとても簡単です。冒頭部分の【 Template Name: Sidebar Template 】という部分に新しい名前を付けるだけです。【 Sidebar Template 】の部分ですね。ここは日本語でもOKです。

これで一旦固定ページ作成画面を見てみましょう。新しいテンプレートが認識されているはずです。

固定ページのテンプレート選択

新しいテンプレート用のスタイルシートを適用する

新しく追加したテンプレートには、一部適用されないスタイルシートがあります。例えば、今回はサイドバーテンプレートを複製しましたが、サイドバーテンプレートにしか適用されないスタイルは、新しいテンプレート(ここではサブページテンプレート)に適用されません。そのため、サイドバーの位置が横ではなく、コンテンツの下にきているはずです。

新しいテンプレートだけにスタイルを適用させたい場合は、以下のように書くと便利です。

もしくは、カスタムフィールドを使って、該当する固定ページのみに適用される専用スタイルシートを、新たに追加する方法もあります。

また、テンプレートに割り振られている id 自体を、新しく書き換えてもいいです。しかし、そうすると全てのスタイルをいちから適用し直さなくてはならなくなるので面倒です。

  • このエントリーをはてなブックマークに追加

無料メール講座

WordPress を活用している
社長、フリーランス、ウェブマーケターのための

ホームページ制作の 3 つの間違い
売上を上げるフレームワークを無料公開中……

無料メール講座

もっと楽に、簡単にホームページを作れないものだろうか?
もっと楽に、簡単にインターネットから集客できないものだろうか?
もっと楽に、簡単にインターネットから売上を上げられないものだろうか?

そんなことを思ったことがある方のために、このページを用意しました。

私たちは、ウェブマーケティングに携わる中で、多くの人が陥っているある「勘違い」に気づきました。

その勘違いとは・・・

コメントをどうぞ

メールアドレスが公開されることはありません。