WordPressの無料テーマ「STINGER8」子テーマのようにヘッダーファイル（header.php）やフッターファイル（footer.php）が用意されてないテーマもあります。
ヘッダーファイルが無いとGoogleアナリティクスなどのアクセス解析に必要なトラッキングコードを追加することが出来ません。
親テーマのヘッダーファイルに追加してもいいのですが、もし親テーマが更新されバージョンアップするとヘッダーファイルに追加したトラッキングコードが無くなってしまいます。
テーマのバージョンアップの度にトラッキングコードを書くのは面倒です。
なので、子テーマにヘッダーファイルがあるほうが良いので、「WordPress子テーマにヘッダー・フッターファイルを追加する2つの方法」を書いていきます。
ヘッダーファイルやフッターファイルを追加する方法は他にもあるかもしれないですが、この2つの方法がプログラムになれてない初心者でも簡単かなと思います。
ヘッダーファイルを追加する方法で書いていますが、同じ方法でフッターファイルも追加できます。
子テーマにヘッダーファイルを追加する2つの方法の特徴
ただ子テーマに新規に「header.php」を追加しても駄目です。レイアウトが乱れて正常に表示されません。
これは子テーマが有効になっているので子テーマの「header.php」が優先され親テーマの「header.php」が読み込まれないためです。
なので以下の方法で子テーマにヘッダーファイルを作成します。
- 親テーマの「header.php」を子テーマにコピーする
- 子テーマにサブのヘッダーファイルを作成する
どちらもFTPソフトの接続が必要になります。
親テーマの「header.php」を子テーマにコピーする
1.の方法は簡単です。親テーマにある「header.php」をコピペするだけなので親テーマに直接トラッキングコードを書くのと同じです。
親テーマが更新されても子テーマのheader.phpは上書きされません。
ですが、1つ注意することがあります。
親テーマの更新で「header.php」が修正された場合でも、子テーマの「header.php」が優先される。
なので、WordPressの仕様変更や「header.php」にバグなどがあり改良され修正された場合でも子テーマにある古い「header.php」になるので、また親テーマからコピペし直さないといけない。そしてトラッキングコードも書く必要があります。
子テーマにヘッダーファイルを追加する一番手っ取り早い方法ですが、バージョン管理が面倒なのが欠点です。
子テーマにサブのヘッダーファイルを作成する
2.の方法です。
2.の方法は、「header-include.php」など親のヘッダーファイルと名前を変えて作成します。
名前を変えるので親テーマのヘッダーファイルをコピペする必要がありません。なので、親テーマのヘッダーファイルが修正されても影響がないです。
ただ、子テーマの「functions.php」を編集するので多少コードを読む知識が必要です。
後述で記入するコード書いているのでコードを理解する必要はありませんが、最低でも「HTMLの閉じタグがどこにあるのか」ぐらいは理解しているのが望ましいです。
2.の方法はソースコードに手を加えるのに抵抗がある人はお勧めしません。
子テーマにヘッダー・フッターファイルを追加する作業
実際に作業して進めていきます。
親テーマのヘッダーファイルを子テーマにコピペする
親テーマのheader.phpを子テーマにコピーして持ってくるだけです。
手順は次の通りです。
- FTPソフトなどで「STINGER8」の親テーマのディレクトリにアクセス
- STINGER8の親テーマの「header.php」ファイルをコピーする
- STINGER8の子テーマの「header.php」に貼り付ける
- WordPress管理画面から子テーマの「header.php」にトラッキングコード追記する
これで、サイトの表示が乱れることもなく、追記したコードも反映されます。
フッター「footer.php」も同様に子テーマにコピーします。
子テーマに「サブ」ヘッダーファイルを追加する
子テーマの「functions.php」で親テーマと別名のヘッダーphpファイルを用意して、そこにトラッキングコードを追加していきます。
先ほどと違い、ファイル名の「header.php」は子テーマに作成しません。新しく「header-include.php」を作成します。
作成するファイル名は親テーマに使っていない名前なら何でも良いです。
あらかじめ、パソコンで「header-include.php」をファイルを作成しておいてください（中身空でOK)。
- FTPソフトなどでSTINGER8の子テーマがあるディリクトリにアクセス
- 子テーマのディレクトリに「header-include.php」をアップロード
- WordPressで子テーマの「functions.php」を編集
- WordPressで子テーマの「header-include.php」にアクセス解析コードを追加
という流れで説明していきます。「header-include」のファイル名は親テーマに無いファイル名なら変えても大丈夫です、その場合はheader-includeを置き換えて読んでください。
ファイルマネージャーやFTPソフトで子テーマに「header-include.php」をアップロードします。（中身は空で大丈夫です）
なお、子テーマの場所は「/wp-content/themes/stinger8-child/」にあります。
FTPでヘッダーファイルをアップロードするとWordPress管理画面のテーマ編集にファイルが追加されます。
次に、functions.phpに以下のコードを追加して保存します。
function header_php_include() {
include('header-include.php');
}
add_action('wp_head', 'header_php_include');
ヘッダーファイルを追加するコード
子テーマ用のヘッダーファイル名が「header-include.php」と異なる場合は
include('header-include.php');
の「header-include」を変更してください。。
※保存後にページが表示されなくなったら、FTPソフトなどで元の「functions.php」をアップロードして戻します。
WordPress本体のバージョンアップで、保存するときにエラーチェックが入るようになりました。エラーになってもそのままコードの修正が可能ですが、もし保存に失敗した場合は中身が全て消え真っ白になります。
保存失敗の場合も、FTPから「functions.php」をアップロードして戻してください。
「header-include.php」の編集画面に戻りトラッキングコードを追記して保存します。外部ファイルのjavascriptなども「header-include.php」から読み込むことも可能です。
フッター.phpも同様に「footer-include.php」を作成して、functions.phpに以下のコードを追加します。同様のやり方で出来ます。
function footer_php_include() {
include('footer-include.php');
}
add_action('wp_footer', 'footer_php_include');
フッターファイルを追加するコード
まとめ
WordPressの子テーマにヘッダーファイル（フッターファイル）が用意されていなくても、新たにつかすることが出来ます。
トラッキングコードなどを親テーマに書かなくて済むので、テーマ更新後に、書いたコードが消える心配がありません。
STINGER8の子テーマを使って書いていきましたが他のテーマの子テーマでも同様の方法です。
functions.phpを編集する際は、必ずバックアップを取ってから進めてください。
参考、子テーマを作成する
WordPressに入っている標準テーマ（Twenty）など子テーマが無いテーマに、子テーマを作成する方法です。
