WordPressでサイト全体のheadを編集する。

目次

  1. WordPressブラウザ画面からheadを編集する。
  2. 何をしたのか。
  3. あとがき

1.WordPressブラウザ画面からheadを編集する。

上記サイト様を参照しましたが、少しだけ変わっていたのでメモ。

  • WordPressダッシュボードから外観>テーマエディタを開く。
  • 画面右側テーマファイルから「テーマのための関数(function.php)」を選択。
  • 下記コードをfunctions.phpの一番下に追記。
// head内にカスタム用のコードを追加する
function meta_headcustomtags() {
$headcustomtag = <<<EOM


// ここにhead内に追記したいコードを記述。

EOM;
echo $headcustomtag;
}
add_action( 'wp_head', 'meta_headcustomtags', 99);
  • ページ下部の「ファイルを更新」を押下。

以上で反映されるかと思います。

確認方法は実際のページをChrome等ブラウザで開きF12を押してください。(右クリック>検証でも可能)
「Elements」というタブでそのページのソースコードを見ることができますのでhead内にコードが追加されたか確認してみてください。

2.何をしたのか。

そもそもfunctions.phpって?

下記リンクがわかりやすいかと思います。

※各テーマファイルそれぞれで持っているファイルですから自分が適用しているテーマのfunctions.phpを編集するようにしましょう。

追記したコードの意味

// head内にカスタム用のコードを追加する
function meta_headcustomtags() {
$headcustomtag = <<<EOM


// ここにhead内に追記したいコードを記述。

EOM;
echo $headcustomtag;
}
add_action( 'wp_head', 'meta_headcustomtags', 99);

PHPはhtmlを生成するための言語というイメージです。(あくまでもイメージです。)
なので、ここではhead内にこのコードを追加してください!と指定している感じです。

1行目:PHPでは先頭に//を付けるとコメントになります。なので特に処理は行われません。

2行目~10行目:meta_headcustomtagsという関数を定義しています。
名前は好きに変更できます。わかりやすい名前を付けましょう。
<<<EOM~~EOM;とありますが、こちらはヒアドキュメントというもので、EOMで挟んだ部分を全て変数($headcustomtag)へ代入します。
その後のechoで$headcustomtagに入っている文字列をhtmlとして出力します。

11行目:WordPressで定義されているadd_actionという関数です。ざっくり言うと優先度をつけて定義した関数を適当なタイミングで実行してもらうようにする関数です。
詳しくは下記リンクWordPressのリファレンスをご参照ください。
https://wpdocs.osdn.jp/%E9%96%A2%E6%95%B0%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9/add_action
なので、
htmlのhead作ってる時に優先度低くていいからmeta_headcustomtagsって関数実行してね」と命令しているんです。
そして、関数が実行されると「記述したコードをecho(htmlに出力)してね」と命令されるのです。

あとがき

おそらくアフィリエイト等の審査目的でhead内にスクリプトを追記することは多いのかなと思います。かくいう自分もそうでした。
今回軽く調べてみて、functions.phpを触れることでかなり幅が広がるのかなと思いました。少しずつサイトを拡張していきますので、また気づき等があればなるべくわかりやすく解説していきたいと思います。

質問などありましたらお気軽にどうぞ。

コメントを残す

メールアドレスが公開されることはありません。

RSS
Follow by Email