「WP Cloud」は新規受付を終了しております

WordPress向けレンタルサーバーをご検討の方は、Z.com WPをぜひご利用ください

WordPress(ワードプレス)の固定ページごとに、テーマPHPを変える方法と用途

いつもGMO WP Cloudをご利用いただき、ありがとうございます。当ブログでは、wordpress(ワードプレス)運営者や設置者が多く取り組まれている「wordpress(ワードプレス)カスタマイズ」に関しても、ささやかながら主要なTIPSをご提供させていただき、wordpress(ワードプレス)業界を少しでも盛り上げていければと思っております。

なお私達「GMO WP Cloud」は、wordpress(ワードプレス)に最適なサーバを月900円ご提供しています。制作会社様の納品に。WEB担当者様のお供に。ぜひ、ご検討くださいませ。

固定ページで凝ったページを作りたい方へ

wordpress(ワードプレス)を単なるブログではなくCMS(コンテツ・マネージメント・システム。いわゆる会社のホームページや、サービス紹介ホームページ)として使用している場合、「投稿」よりも「固定ページ」が活躍するシーンが多いですよね。

そして、固定ページの使い方もだんだん多様化・高度化していく傾向が多いように思えます。具体的には、ビジュアルリッチエディターをOFFにしてテキストモードで直接HTMLコーディングを挿入するなど…。

固定ページを使って多彩な要望を実装している方々にとって欠かせない機能である

この記事を読んだ後に出来ること

本記事をご覧になったあと、固定ページごとにPHPテンプレートを変更することが出来ることを知り、wordpress(ワードプレス)を使ったページ実装方法により一層のバリエーションを得ることができます。

テンプレートの設定方法(1)ファイル作成

通常、wordpress(ワードプレス)テーマのなかで固定ページと対応するPHPファイルは、皆様ご存知・お馴染みの「page.php」です。固定ページのレイアウトを変更したい場合に編集をした経験のあるかたも、多いのではないでしょうか。

さて、特定の固定ページだけ特別な記述したテンプレートPHPを適用したい場合、まずはテーマファイル内に、PHPをアップする必要があります。このPHPファイルを作る手順ですが、0からコーディングしても当然いいのですが、ここではよくある方法としてpage.phpをもとにして改造することとします。FTP上でテーマファイルが設置されたディレクトリにアクセスし、page.phpをダウンロードしましょう。

page-templete0

上記画面は、著名FTPソフトで通信した様子。page.phpを選択していますので、ダウンロードをしましょう。対象のpage.phpは、wordpress(ワードプレス)がインストールされたフォルダから見て「/wp-content/themes/テーマフォルダ/page.php」にあります。

※決して、元のpage.phpは消さないようにご注意ください。

その後、ダウンロードしたpage.phpをリネーム(名前変更)しましょう。リネームする際、「single.php」「404.php」などwordpress(ワードプレス)で予約されている名前は付けられない他、page-1.phpなど冒頭に「page」が付くファイル名も、wordpress(ワードプレス)の仕様により他のページにも適用される恐れがあり、推奨できません。
※無難なファイル名は「templete-lp.php」など、wordpress(ワードプレス)によって予約されていない名称にしつつ、自分で後から理解できる名称にすることをおすすめします。

リネームした対象のファイルをテキストエディタで開き、冒頭に下記の記述をします。必ず先頭にしましょう。

<?php
/**
* Template Name: テンプレートテスト1
*/
?>

このコードのうち、「テンプレートテスト1」の部分は任意の文字列を挿入することができます。

あとはご自由に、PHPをカスタマイズして、デザイン変更やプログラム追加を試みて下さい。その後、当該ファイルをFTPソフトでpage.phpと同じフォルダにアップロードしましょう。(※実は同じフォルダでなくても、テーマ内のサブフォルダでも認識されます。たくさんPHPテンプレートを生成する場合、管理しやすいようにサブフォルダに設置することを推奨します。)

テンプレートの設定方法(2) 固定ページへの設定

PHPファイルの作成とアップロードが済みましたら、次は固定ページに設定をしましょう。

先ほどのファイル作成が成功していると、固定ページの編集画面では、下記のように表示されるはずです。※下記画像では、テンプレートPHPを複数設置しました。理論上いくつでも設置できます。

page-templete3

もしこの「ページ属性」というブロックが表示されていない場合、固定ページ編集画面の一番右上の「表示オプション」から、表示/非表示の切り替えをしましょう。

page-templete2

「ページ属性」から任意のテンプレートPHPを選択し、「公開」(または「更新」)を押すと、テンプレートPHPが設定された状態となっているはずです。

設定方法は以上になります。ステップは少なく、お手軽に出来る技ですよね。いくつかこの方法を使った実装パターンを見てみましょう。

事例1:ランディングページの実装事例

よくある事例としては、ランディングページのような特殊なJavaScriptなりHTMLコーディングが施されたページを、wordpress(ワードプレス)の固定ページとして公開するもの。複雑にコーディングされたページはエディタの「テキストモード」だけでは手に負えない時もありますし、パソコンに詳しくない人がうっかり「ビジュアルリッチエディタ」として操作してコーディングが崩れてしまうことも、しばしば。

その場合、テンプレートPHPの中にランディングページのコーディングデータを移植してしまい、固定ページのテンプレートとして設置してしまうと、管理が楽で安全です。

そのような運営をしている場合、下記のような固定ページも少なくありません。

page-templete4

すなわち、本文は使用しておらず、テンプレートファイルの中に必要なコーディングを全て入れ込んでしまっているパターン。これは、頻出な設定方法である印象があるものの、知らない人も多いのではないでしょうか。「業者が納品したwordpress(ワードプレス)で、対象の固定ページを編集したくて開いたものの、本文が空欄でどこにHTMLデータがあるのか不明!」という事態が、過去私自身にもありましたが、だいたいこのパターンではないでしょうか。

事例2:ECサイトで、商品ページだけ異なるPHPテンプレートを使用する場合

wordpress(ワードプレス)でECサイトを構築する事例も増えてきました。独自のカスタマイズがしやすい他、SEO観点での管理もしやすいという理由もあるでしょう。JavaScriptを埋め込むだけでカートが設置できたり、商品ページをwordpress(ワードプレス)で構築してカートページを同じサーバに別のプログラムを設置する等の実装方法も、設置事例があるようです。

その場合、過去に「カスタムフィールド」の解説記事を当ブログでもアップしておりますが、カスタムフィールドで価格や商品名などを登録し、独自のテンプレートPHPでレイアウトをカスタマイズする方法が、管理も楽ではないでしょうか。

page-templete6

上記の設定例では、「カスタムフィールド」に商品名や価格を挿入し、テンプレートPHPでは下記のように記述をすることで、商品ページすべて同じレイアウトで表示されます。

<?php
/**
* Template Name: テンプレートテスト2
*/
get_header(); ?>
<?php
if (have_posts()) : // wordpress ループ
while (have_posts()) : the_post(); // 繰り返し処理開始 ?>
<h1><?php echo get_the_title(); ?></h1>
<?php the_content();?>
商品名:<?php echo get_post_meta($post->ID , ‘商品名’ ,true); ?>
価格(税抜):<?php echo get_post_meta($post->ID , ‘価格’ ,true); ?>
<?php echo’かごに入れるボタン等’;//任意のカートプログラムの設置 ?>
<?php
endwhile; // 繰り返し処理終了
else : // 記事が見つからなかった場合の処理 ?>
<div class=”post”>
<h2>NOT FOUND</h2>
<p><?php echo ‘記事は見つかりませんでした’; ?></p>
</div>
<?php
endif;
?>
<?php get_footer(); ?>

※上記コードは必要最低限のプログラム例となります。

カスタムフィールドに決まった情報を挿入することで、複数のページにまたがって「価格」「送料」「商品名」など決まったレイアウトで表示が必要なものは、このテンプレートPHPの設置で実装ができますね。

まとめ:固定ページのテンプレート切り替えを活用しよう

簡単に習得できて、応用の幅も広い「固定ページごとに異なるPHPテンプレートを設置する技」ですが、いかがでしょうか。皆様はどのような実装でこの技をつかますか?アイデア次第で様々なサイトが柔軟に制作できるwordpress(ワードプレス)。ぜひご活用ください。

AUTHER:GMO WP Cloudの中の人

以上、いかがでしたでしょうか。上級者の方にはもしかしたら物足りない内容だったかも知れません。こちらの連載を続けられるよう、是非リクエストを頂けますと幸いです。

尚、重ね重ねではありますが、私達「GMO WP Cloud」は、wordpress(ワードプレス)に最適なサーバを月900円でご提供しています。ぜひ一度ご覧下さい。

WordPress 専用高速サーバー GMO WP Cloud

関連した記事