WordPressのヘッダーまたはフッターにコードを追加したいですが、やり方分がかりませんか？ツールまたはトラッキングスクリプトの多くでは、WordPressウェブサイトのヘッダーやフッターにコードスニペットを追加する必要があります。しかしデフォルトでは、WordPressのヘッダーやフッターファイルの編集へのアクセスはしにくいです。
本記事では、WordPressプラグインを使用すること、または手動でfunctions.phpファイルにコードを追加することにより、WordPressのヘッダーやフッターにコードを追加する方法をご紹介します。初心者の方は必ずプラグインを使用してください。中上級のWordPressユーザーは、手動でコードを追加しても良いでしょう。
リンクをクリックすると、お好みの手順にジャンプできます：
プラグインを使用してWordPressのヘッダーまたはフッターにコードを追加する
ほとんどのユーザーにとって、WordPressのヘッダーまたはフッターにコードを追加する最もしやすい方法はプラグインを使用することでしょう。下記の手動の方法よりもプラグインを使用する利点は次のとおりです。
- テーマを切り替えても、コードスニペットはそのまま残ります。
- プラグインを使用すると、ホームページのヘッダーまたはフッターのみにコードスニペットを追加することができます。これは非常に便利である用途もあります。
- プラグインの方は、コードを詳しく調べる必要がないため、初心者にとっては使いやすいでしょう。
この機能を提供するプラグインはいくつかありますが、他のプラグインよりも多くのコントロールが可能になるStefano LissaのHead, Footer and Post Injectionsプラグインをお勧めします。200,000以上のアクティブなインストールがあり、評価は5つ星のうち5です。
ステップ1：Head, Footer and Post Injectionsをインストールし有効化する
Head, Footer and Post InjectionsはWordPress.orgから無料で入手できる為、「プラグイン」→「新規追加」を選択して検索することにより、WordPressダッシュボード内でもインストールして有効化することができます。
ステップ2：Head, Footer and Post InjectionsにCode Snippetを追加する
プラグインを有効にすると、WordPressダッシュボードの「設定」メニューの「Header and Footer」をクリックすることでそのインターフェイスにアクセスできます。プラグインのインターフェースにいくつかのタブがありますが、このガイドでは、デフォルトの「Head and footer」タブを使用します。
ウェブサイトのヘッダーにコードを追加するには、「 <HEAD> SECTION INJECTION」のボックスにコードを貼り付けます。
- Every page：ウェブサイトのすべての固定ページのヘッダーにコードスニペットを追加します。ほとんどの場合にこれを使います。
- Only home page：ホームページのヘッダーのみにコードスニペットを追加します。
たとえば、Google AnalyticsのトラッキングコードをWordPressに追加するには、「Every page 」ボックスに貼り付けて変更を保存するだけです。
ウェブサイトのフッターにコードを追加するには、「BEFORE THE </BODY> CLOSING TAG (FOOTER)」までスクロールダウンします。こちらにも2つの選択肢がありますが、ヘッダーの選択肢とは異なります。
- Desktop：名前にもかかわらず、これはモバイルのチェックボックスを選択しない限りウェブサイトのデスクトップ版のフッターにもモバイル版のフッターにもコードを追加します。
- Mobile：これを選択すると、ウェブサイトのモバイル版に異なるコードスニペットを追加できます。
すべてのユーザーを対象にフッターにコードスニペットを追加する場合は、「Desktop」ボックスに貼り付けて、「Mobile」を選択しないままにします。
必要に応じて、各ボックスに複数のコードスニペットを追加できます。
ボーナス：Google AMPのページのヘッダーとフッターにコードを追加する
Google AMP for WordPressをご利用の場合は、本プラグインを使用すると（Automatticの公式のプラグインを使用している限り）、固定ページのGoogle AMPバージョンのヘッダーとフッターにコードスニペットを追加できることは本プラグインのもう一つのメリットです。
これを行うには、「Header and Footer」メニューの「AMP」タブにアクセスし、コードスニペットを適切なボックスに貼り付けます。
ウェブサイト全体で様々なPHP関数を追加するには、無料のCode Snippetsプラグインをご検討ください。このプラグインを使用すると、テーマのfunctions.phpファイルにカスタムスニペットを追加しなくて済みます。100,000以上のアクティブなインストールがあり、評価は5つ星のうち5です。
手動でWordPressのヘッダーまたはフッターにコードを追加する
PHPの基本知識のない方は、上記のプラグインを使用した方法を使用した方が良いでしょう。手動の方法は難しすぎるかもしれません。
このセクションでは、functions.phpファイルを使ってテーマのヘッダーまたはフッターにコードスニペットを手動で追加する方法をご紹介します。
上記のプラグインよりもこの手段を使用すると、編集用のWordPressの子テーマを使用することが不可欠です。子テーマを使用しない場合は、WordPressテーマを更新すると、ヘッダーやフッターに追加したコードが上書きされます。
子テーマを提供している開発者が多いですが、ご利用の開発者が提供しないなら、WordPress子テーマの作成についてこちらのガイドをご参照ください。子テーマを準備したら、次の手順に従ってテーマのヘッダーまたはフッターにコードを追加します。
header.php と footer.php ファイルに直接コードスニペットを追加することができますが、 functions.php ファイルと適切なWordPressフックを使用した方がより効率がいいでしょう。これにより、すべてのスニペットを1か所にまとめて、コアテーマファイルを変更することを回避できます。
ステップ１：コードスニペットを準備する
ヘッダーとフッターの両方にコードを追加する大まかなフレームワークをご紹介します。
ヘッダにコードを追加するには、次のコードスニペットを使用します：
/* Describe what the code snippet does so you can remember later on */
add_action('wp_head', 'your_function_name');
function your_function_name(){
?>
PASTE HEADER CODE HERE
<?php
};フッターにコードを追加するには、次のコードスニペットを使用します：
/* Describe what the code snippet does so you can remember later on */
add_action('wp_footer', 'your_function_name');
function your_function_name(){
?>
PASTE FOOTER CODE HERE
<?php
};各スニペットについて、必ず下記を変更してください。
- 「Describe what the code snippet does so you can remember later on 」（簡単な説明。1年後にコードスニペットの用途を思い出すのに便利です。）
- your_function_nameプレースホルダー（両方のインスタンス）
- PASTE X CODE HEREプレースホルダー
ステップ2：子テーマのfunctions.phpファイルにコードスニペットを追加する
適切なコードスニペットが用意されたら、子テーマのfunctions.phpファイルに追加します。FTP経由でウェブサイトに接続してこのファイルが編集できます。あるいは、「外観」→「エディタ」にアクセスし、functions.phpファイルを選択します。次に、ファイルの末尾にコードを貼り付けます。
変更を必ず保存してください。これで完了です。
ボーナス：特定のページのヘッダーやフッターにのみコードを追加する
ヘッダまたはフッターのコードスニペットの表示場所をさらに管理したい場合は、「if」ステートメントを使用して、コードをWordPressウェブサイトの特定のページにのみ追加することができます。
たとえば、ホームページのヘッダーまたはフッターのみにコードスニペットを追加するには、次のようにします：
/* Describe what the code snippet does so you can remember later on */
add_action('wp_head', 'your_function_name');
function your_function_name(){
if(is_front_page()) { ?>
PASTE HEADER CODE HERE
<?php }
};
コードスニペットを特定の投稿または固定ページにのみ追加することもできます。これを行うには、次のコードスニペットを使用します：
/* Describe what the code snippet does so you can remember later on */
add_action('wp_head', 'your_function_name');
function your_function_name(){
if(is_single(73790)) { ?>
PASTE HEADER CODE HERE
<?php }
};例の番号（73790）を必ず、コードスニペットを追加する投稿または固定ページのID番号に置き換えてください。
自信のない方はプラグインを使用してください
以上は、当社のWordPressウェブサイトのヘッダーまたはフッターにコードを追加する方法についてのガイドでした。手動の手段がわかりにくい場合は、プラグインを使用した方が安全でしょう。初心者ならはるかに使いやすく、同じく正常に機能します。
