template-partsを使うと管理しやすくなる理由

WordPressテーマを作っていると、最初は front-page.php や page.php にそのままHTMLを書いていくことが多いです。

最初のうちはそれでも問題ありません。

ただ、セクションが増えてくると、だんだんファイルの中身が長くなってきます。

たとえばトップページに、

ファーストビュー

サービス紹介

選ばれる理由

実績

ブログ一覧

FAQ

お問い合わせ

のようなセクションがある場合、これらをすべて front-page.php に直接書いていくと、かなり見通しが悪くなります。

そこで便利なのが、template-parts です。

template-partsとは

template-parts は、WordPressテーマの中でパーツごとにファイルを分けて管理するための考え方です。

たとえばトップページのセクションを、以下のように分けます。

template-parts/

  front/

    hero.php

    service.php

    reason.php

    works.php

    faq.php

    contact.php

そして front-page.php 側では、このように読み込みます。

<?php get_template_part('template-parts/front/hero'); ?>

<?php get_template_part('template-parts/front/service'); ?>

<?php get_template_part('template-parts/front/reason'); ?>

<?php get_template_part('template-parts/front/works'); ?>

<?php get_template_part('template-parts/front/faq'); ?>

<?php get_template_part('template-parts/front/contact'); ?>

これだけ見ると、ただファイルを分けているだけに見えるかもしれません。

でも、実際に運用してみると、この「分ける」ということがかなり重要です。

1つのファイルが長くなりすぎない

template-partsを使う一番大きなメリットは、1つのファイルが長くなりすぎないことです。

トップページをすべて front-page.php に書いていると、数百行、場合によっては1000行近くになることもあります。

そうなると、少し修正したいだけでも、目的の場所を探すのに時間がかかります。

「FAQを修正したい」

「お問い合わせ部分の文言を変えたい」

「実績セクションのHTMLを調整したい」

こういうときに、1つの長いファイルの中から該当箇所を探すのは地味に面倒です。

一方で、template-partsで分けておけば、FAQを修正したいなら faq.php を開けばいいだけです。

修正する場所が明確になるので、作業スピードが上がります。

セクションごとに役割がわかりやすくなる

template-partsを使うと、ファイル名を見るだけで「どの部分のファイルなのか」がわかるようになります。

たとえば、

hero.php

service.php

reason.php

works.php

contact.php

というファイル名になっていれば、それぞれの役割はすぐにわかります。

これは、自分ひとりで作業しているときにも便利です。

数日後、数週間後に見返したときに、

「このコード、どこに書いたっけ？」

となることが減ります。

Web制作では、作った直後は覚えていても、時間が経つと細かい構造は忘れます。

そのときに、ファイル構成が整理されていると、過去の自分に助けられます。

修正の影響範囲が小さくなる

ファイルを分けることで、修正の影響範囲も把握しやすくなります。

たとえば faq.php を編集しているなら、基本的にはFAQセクションだけに影響します。

逆に、すべてを front-page.php に書いていると、修正中に別のセクションのコードまで触ってしまう可能性があります。

もちろん、ファイルを分けたからといってミスが完全になくなるわけではありません。

ただ、作業範囲を小さくできるので、余計なミスは減らしやすくなります。

これは実務ではかなり大事です。

小さな修正のつもりが、別の場所のレイアウト崩れにつながることは普通にあります。

だからこそ、最初からパーツごとに分けておくと安心です。

並び替えや追加がしやすい

template-partsを使っていると、セクションの並び替えも簡単になります。

たとえば、トップページの構成を変更して、

「実績セクションをもう少し上に持ってきたい」

となった場合、front-page.php の読み込み順を変えるだけで対応できます。

<?php get_template_part('template-parts/front/hero'); ?>

<?php get_template_part('template-parts/front/works'); ?>

<?php get_template_part('template-parts/front/service'); ?>

<?php get_template_part('template-parts/front/reason'); ?>

このように、各セクションが独立していれば、ページ全体の構成変更がしやすくなります。

新しいセクションを追加するときも同じです。

たとえば「お客様の声」を追加したいなら、

voice.php

を作って、必要な位置で読み込めばいいだけです。

最初から構造を分けておくことで、後からの変更に強くなります。

コードの見通しがよくなる

template-partsを使うと、front-page.php がページ全体の設計図のようになります。

直接HTMLが大量に書かれている状態ではなく、

heroを読み込む

serviceを読み込む

reasonを読み込む

worksを読み込む

contactを読み込む

というように、ページの流れだけが見える状態になります。

これはかなり見やすいです。

front-page.php を見れば、トップページがどの順番で構成されているのかがすぐにわかります。

細かい中身を見たいときは、それぞれのtemplate-partsファイルを開けばいい。

この状態にしておくと、全体像と詳細を分けて確認できます。

複数ページで使い回しやすい

template-partsは、同じパーツを複数ページで使い回すときにも便利です。

たとえば、お問い合わせセクションをトップページだけでなく、下層ページにも表示したい場合があります。

そのときに contact.php としてパーツ化しておけば、必要なページで同じファイルを読み込めます。

<?php get_template_part('template-parts/common/contact'); ?>

同じコードを何度も書かなくて済むので、管理が楽になります。

もしお問い合わせ部分の文言を変更したくなった場合も、contact.php を修正すれば、読み込んでいるページすべてに反映できます。

これはかなり大きなメリットです。

同じようなHTMLをいろいろな場所にコピペしていると、後から修正するときに漏れが出やすくなります。

「あっちのページは直したけど、こっちのページは古いままだった」

ということが起きやすいです。

共通パーツ化しておけば、そういった管理ミスを減らせます。

チーム作業でもわかりやすい

template-partsは、自分ひとりで作業するときだけでなく、複数人で作業するときにも役立ちます。

ファイルがセクションごとに分かれていれば、

「この人はhero.phpを編集する」

「別の人はfaq.phpを編集する」

というように作業を分けやすくなります。

また、他の人がコードを見る場合でも、ファイル名から内容を推測しやすいです。

WordPressテーマは、作った本人しかわからない構造になりがちです。

でも、template-partsで整理しておけば、他の人が見ても比較的理解しやすい構造になります。

これは引き継ぎや保守の面でも大事です。

template-partsを使うときの注意点

ただし、何でもかんでも細かく分ければいいわけではありません。

分けすぎると、逆にファイル数が増えすぎて管理しにくくなります。

たとえば、見出しだけ、ボタンだけ、画像だけ、というレベルで細かく分けすぎると、どこに何があるのかわかりにくくなります。

最初は、セクション単位で分けるくらいがちょうどいいです。

トップページであれば、

hero.php

service.php

reason.php

works.php

faq.php

contact.php

くらいの分け方で十分です。

共通で何度も使うものだけ、common のようなフォルダに入れておくと管理しやすくなります。

template-parts/

  front/

    hero.php

    service.php

    works.php

  common/

    contact.php

    cta.php

このくらいの粒度が、実務では扱いやすいと感じます。

まとめ

template-partsを使うと、WordPressテーマの管理がかなり楽になります。

理由は、コードをセクションごとに分けられるからです。

1つのファイルにすべて書くよりも、ファイルごとの役割が明確になり、修正箇所を探しやすくなります。

また、並び替えや追加もしやすく、共通パーツの使い回しにも向いています。

特にトップページのようにセクションが多いページでは、template-partsを使うかどうかで、後々の管理しやすさが大きく変わります。

WordPressテーマを自作するなら、最初から完璧な設計を目指す必要はありません。

ただ、セクションごとにファイルを分けるだけでも、かなり見通しはよくなります。

コードは、書いた瞬間よりも、後から直す時間の方が長くなりがちです。

だからこそ、後から見てもわかりやすい形にしておくことが大切です。

template-partsは、そのためのかなり実用的な方法だと思います。