共通パーツ(header,footer等)をPHPで読み込んで編集を楽にする方法

  • 公開日2025/04/22
  • HowTo

headerやfooterに限らず、同じパーツを使っている場合は、共通パーツを読み込ませて管理した方が断然楽ちんです。ですので、以前『共通パーツ(header,footer等)をjQueryで読み込んで編集を楽にする方法 & 文字化け対策』の記事を書いて以来、共通パーツの運用はjQueryを使っていました。

ですが、新たにWordPress(ワードプレス)で作ったサイトにこの共通パーツを使おうとしたところ、機能しなかった。。

というわけで今回は『共通パーツ(header,footer等)をPHPで読み込んで編集を楽にする方法』について書きたいと思います。

PHPを使って、共通パーツを読み込む方法

以前の静的な「HTML」を「JS(JavaScript)」で読み込む方式だと、初期表示できちんと表示されないでSEO的には不利になることがあります。ですが、今回のPHPを使った方法だと、最初から出力=成形されてでてきてくれるのでSEO的にも問題なく、jQueryの『.load()』に依存しないので、軽量かつ安定して使うことができる ということになります。

そんなわけで、WordPress等のPHPを使っているサイトでの共通パーツを読み込ませる場合は、WPのテンプレート関数を使うこの方法が断然オススメです。

1. 共通で読み込みたいパーツを作成する

まずは以下のようなhtmlで作成された「共通パーツ」を、『PHP』ファイルとして作成します。

今回の例としては、footerで共通のパーツを使用したかったので、『footerCommonBox.php』という名前(任意)のファイルを作成しました。

中身は共通で出力したいコードを記載します。以下はサンプルです。

<!--ここから共通<header>-->
<a href="パス">タイトルとか</a>
<ul>
  <li><a href="パス">メニューとか</a></li>
  <li><a href="パス">メニューとか</a></li>
  <li><a href="パス">メニューとか</a></li>
</ul>
<!--ここまで共通</header>-->

htmlやbodyタグなどは不要 なのは前回同様です。

2. テーマ直下に「.php」ファイルを配置する

作成した『footerCommonBox.php』のファイルを、以下に配置します。

wp-content/themes/テーマのフォルダ名/template-parts(任意のフォルダ)/footerCommonBox.php

3. 読み込みたい場所で呼び出す

WordPress(ワードプレス)のテンプレート内(今回であれば、footer.php など)に以下を記述します。

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

これでOKです!

超簡単!! これでそのパーツ内で修正すれば、3を記述した場所全てで、修正内容が自動的に更新されます!!「後々更新するかも?」というパーツがある場合は、最初作るときにこのような作りにしておいた方が、後々絶対に楽!なので、オススメです!

まとめ

以前作ったサイトもWordPress(ワードプレス)で作ったものだったのですが、その頃はPHPが苦手でJavascriptを使った、という経緯もあるのですが、JavaScriptを作った方法だと、PHPやWPのバージョンによって、使えたり使えなかったりするんですよね。

ですので、WordPress(ワードプレス)で作っているサイトであれば、「PHP苦手」という方であっても、後々のことを考えればPHPで作る方がオススメなのかな。と思います。

Google AdS



関連記事

FACEBOOK デバッガー & TWITTER Card validator

【2021】FacebookやTwitter CardのOGPの設定をする!チェックツールURLも!プラグインなし


今まで何度も『OGP』の設定に関する記事は書いてきたのですが、新規サイト立ち上げで参考にしようと見てみたら、Facebo…

記事を読む▷


『PS Auto Sitemap』のエラーを消して、代替プラグインを使わずそのまま使う方法!


『PS Auto Sitemap』を結構長い間使っていたのですが、いつの頃からか「WP_DEBUG」でエラー表示させると…

記事を読む▷


「.DS_Store」「_notes」を削除&定期的に削除する方法!01

「.DS_Store」「_notes」を削除&定期的に削除する方法!


「.DS_Store」「_notes」まじで邪魔!と思われた方、結構おられますよね?おそらく。Macの人なら特に…

記事を読む▷


【2025年版】『reCAPTCHA v3』をWordPressのサイト&Contact Form7で表示させる方法

【2025年版】『reCAPTCHA v3』をWordPressのサイト&Contact Form7で表示させる方法


今までをWordPress(ワードプレス)で作ったサイトの「問い合わせページ」をContact Form7で作成し、『r…

記事を読む▷


cron設定で対策する方法!XSERVERの設定画面

WordPressサイトが遅い原因は「PHPのスリープ」かも?cron設定で対策する方法!XSERVERにて


管理しているWordPress(ワードプレス)のサイトをチェックする時、『最初だけ』いっつもおっそいなぁ。 と思ってたん…

記事を読む▷


Message

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください