functions.phpを編集してheadタグにコードを挿入する方法【WordPress初心者向け】

WordPressのfunctions.phpを使ってheadタグにコードを追加する方法のイメージ
functions.phpを編集してheadタグにコードを追加する手順イメージ

WordPressサイトのカスタマイズで、headタグ内に独自のコードを挿入したいことはありませんか?
例えば、Google Analyticsのトラッキングコードやメタタグ、カスタムCSSなどを追加する際に役立つ方法をご紹介します。

この記事では、テーマのfunctions.phpを使って安全にheadタグにコードを追加する方法を、初心者向けにわかりやすく解説します。

1. functions.phpでheadタグにコードを追加する理由

WordPressのテーマファイルを直接編集する方法もありますが、テーマのアップデート時に変更が消えてしまうリスクがあります。
functions.phpを編集してコードを追加することで、より管理しやすく安全にカスタマイズ可能です。

また、WordPressの公式なフック機能であるwp_headを使うため、推奨される方法でもあります。

テーマ編集の基礎知識については、WordPress初心者でも安心!functions.phpの使い方と注意点をわかりやすく解説の記事もぜひご覧ください。

2. functions.phpにコードを追加する手順

2-1. テーマ編集画面を開く

  1. WordPress管理画面の「外観」→「テーマファイルエディター」をクリック
  2. 右側のファイルリストからfunctions.phpを選択

ポイント
編集前に必ずバックアップを取るか、子テーマの作成方法を確認しましょう。

2-2. headタグにコードを追加する関数を作成

以下のコードをfunctions.phpの最後に追記します。

function my_custom_code_in_head() {
    ?>
    <!-- headタグ内に挿入したいコードをここに記述 -->
    <meta name="description" content="あなたのサイトの説明文">
    <?php
}
add_action('wp_head', 'my_custom_code_in_head');

2-3. 変更を保存し、動作確認

  • 「ファイルを更新」ボタンをクリック
  • ブラウザでサイトを表示し、ソースコード内の<head>タグ内にコードが反映されているか確認

3. よく使われるheadタグへのコード例

3-1. Google Analyticsトラッキングコードの追加例

function add_google_analytics() {
    ?>
    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX-X"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', 'UA-XXXXXXXXX-X');
    </script>
    <?php
}
add_action('wp_head', 'add_google_analytics');

詳細な解析やSEO効果を高めるためのメタタグの追加については、構造化データ(schema.org)とは?SEOに効くマークアップの基本の記事も参考にしてください。

4. 編集時の注意点とおすすめの管理方法

  • バックアップは必須
    functions.phpの編集ミスはサイトの表示エラーを引き起こします。作業前に必ずバックアップを取りましょう。
  • 子テーマでの編集がベスト
    テーマのアップデートで変更が上書きされるのを防ぐため、子テーマのfunctions.phpで管理するのがおすすめです。
  • プラグインとの使い分け
    headタグのカスタムコード追加用プラグインもありますが、サイトを軽量化したい場合や管理を一元化したい場合はfunctions.phpを使う方がシンプルです。

プラグインによるSEO対策については、All in One SEO / Yoast SEO の設定手順と使い分け【WordPress初心者向け】の記事を参考にしてください。

まとめ

  • wp_headアクションフックを使い、functions.phpにコードを追加するのが安全で推奨される方法
  • 編集は必ずバックアップを取り、できれば子テーマで行う
  • Google Analyticsやメタタグの追加など様々な用途に応用可能

WordPressのカスタマイズに慣れてきたら、ぜひこの方法でheadタグを自由に編集して、サイトの機能アップやSEO対策に役立ててくださいね。