The current article

WordPressでよく使う部分を切り出し、自作テンプレートにして「get_template_part」で読み込んで使い回す覚書

WordPressで制作するなら「get_header()」や「get_footer()」など、テンプレートをインクルードさせるタグは目にしたことがあると思います。
今回は、よく使う部分を部品化して読み込ます方法について書いておきます。

include1

capture

例えばランディングページでお問い合わせエリアを数回表示する時や、記事リストのループ文を複数箇所で使用する時など、何度も使用する記述がある場合に効果的です。
この「get_template_part」を使えば、「get_header()」と同じように、テンプレート中にインクルードしてくれます。
今回は、お問い合わせエリアを複数回使う例で説明します。

準備

例えば下記のようなテンプレートを作成します。

<div class="contact">
<p>ご相談/お見積もり/ご質問など、お気軽にご連絡下さい。</p>
<ul>
<li><a href="リンク先A">お問い合わせ</a></li>
<li><a href="リンク先B">お見積もり</a></li>
</ul>
</div>

これを「contact.php」という名前などで保存し、テーマの中(header.phpとかと同じ階層)に突っ込んでください。

使い方

「contact.php」で保存したとして、
「get_template_part」の書き方は、.phpの名前部分「contact」を使い、

<?php get_template_part('contact'); ?>

となります。

使用例

   ・
   ・

<h1>WordPressで制作</h1>
<h2>WordPressの特徴</h2>
<p>WordPressはこんな特徴がありますよ!</p>

<?php get_template_part('contact'); ?>

<h2>WordPressの使用例</h2>
<p>WordPressはこんな使い方ができます</p>

<?php get_template_part('contact'); ?>

<h2>お客様の声</h2>
<p>WordPressで制作してこうなりました!</p>
<p>WordPressで制作してああなりました!</p>

<?php get_template_part('contact'); ?>

   ・
   ・

商品紹介LPでよく見られる感じですね。
8,13,19行目の場所に、準備した同じお問い合わせエリアが表示されます。

出力はこんな感じ

   ・
   ・

<h1>WordPressで制作</h1>
<h2>WordPressの特徴</h2>
<p>WordPressはこんな特徴がありますよ!</p>

<div class="contact">
<p>ご相談/お見積もり/ご質問など、お気軽にご連絡下さい。</p>
<ul>
<li><a href="リンク先A">お問い合わせ</a></li>
<li><a href="リンク先B">お見積もり</a></li>
</ul>
</div>

<h2>WordPressの使用例</h2>
<p>WordPressはこんな使い方ができます</p>

<div class="contact">
<p>ご相談/お見積もり/ご質問など、お気軽にご連絡下さい。</p>
<ul>
<li><a href="リンク先A">お問い合わせ</a></li>
<li><a href="リンク先B">お見積もり</a></li>
</ul>
</div>

<h2>お客様の声</h2>
<p>WordPressで制作してこうなりました!</p>
<p>WordPressで制作してああなりました!</p>

<div class="contact">
<p>ご相談/お見積もり/ご質問など、お気軽にご連絡下さい。</p>
<ul>
<li><a href="リンク先A">お問い合わせ</a></li>
<li><a href="リンク先B">お見積もり</a></li>
</ul>
</div>

   ・
   ・

ちなみに

<?php include( TEMPLATEPATH . '/contact.php' ); ?>

という書き方も出来ます。
(WPバージョン3.0未満はこちらを使ってました。現在でも非推奨にはなっていないと思う)

応用

準備で作ったテンプレートの保存名ですが、
「contact-area.php」
「contact-box.php」
などハイフン繋ぎでも作成できます。 この場合、

<?php get_template_part('contact','area'); //contact-area.phpの時 ?>

<?php get_template_part('contact','box'); //contact-box.phpの時 ?>

のような書き方になります。
似てるけどちょっと違うファイルの時使えますかね^^;

変更があれば、1度の作業で全部変わってくれますので便利ですよね!
これでコピペ作業から開放されるんじゃないでしょうかー


Category

Service

Guidance

Salutation

WPCは大阪を中心に、ホームページ制作、リニューアル、コーディング、更新業務、各種印刷物制作、スキルアップ出張講習・セミナー等取り扱っております。
どこの会社に作成を依頼しようかとお悩みの方、リニューアルしたいんだけど良いプランはないかなとお探しの方、本格派のデザイナーにデザインを依頼したい、 コーディングだけ頼みたい、更新だけ頼みたい、パソコンやソフトの使い方を教えて欲しいなど、どんな事でもWPCまでお気軽にご相談ください。