今回は、プラグインを使わずにhtmlのhead内にコードを挿入する、というのを紹介したいと思います。
使用テーマはyStandard v4です。
WordPressでブログやサイトを運営していると、head内に○○のコードを貼るという機会が結構あると思います。Webフォントだったり、アドセンス関係だったり、アナリティクスだったり…でもプラグインは使いたくない。そんなときには以下の方法を試してみてください。
Google Analyticsのコード
Google Analyticsについては、[カスタマイズ]→[SEO]→Google Analyticsで設定します。トラッキングIDをコピーして貼り付けるだけです。
子テーマを使ってheadにコードを挿入する
それでは、Google Analytics以外のコードをheadに挿入する方法を見ていきましょう。
親テーマからheader.phpをコピーして、子テーマとして利用します。
<head>から</head>までがheadの内容です。ここにGoogle FontsなどのWebフォントや、その他head内に貼っていくださいといわれるコードを貼り付けます。
よく言われるのが</head>の直前ですね。ここでは</head>の直前にWebフォントのコードを挿入してみました。<link rel=”stylesheet”～>のコードです。
functions.phpで編集する方法
yStandardのheader.phpを子テーマで使えばいいのでは？と思いつく前に検索をかけて覚えた方法がこちら。functions.phpを編集するやり方です。
メリットとしては、どんなテーマを使っていても共通であるということですかね。
参考ページ
WordPressのヘッダーまたはフッターにコードを追加する方法について
上記画像の記述を子テーマのfunctions.phpに追加します。
青緑色のheadireruyoの2箇所は任意に変更可能。わかりやすいファンクション名にしてください。この2箇所は同じ名前にします。
ピンク色の部分に挿入したいコードを貼り付けます。
コードを追加する場合は、必ず<?phpよりも上に記述してください。
/* ヘッダーにウェブフォントとか追加するためのコード */
add_action('wp_head', 'headireruyo');
function headireruyo(){
?>
/* ここにコードを貼り付け(/**/ごと消してね) */
<?php
};
いかがだったでしょうか。
いずれの方法でも、編集後に実際のページでChromeの検証から</head>までの間に挿入したコードがあるか確認するといいと思います。
たまーに表示させるフォントを変えたくなる時があるんですよね、英数字とか。
yStandard v4でheadにコードを挿入する、参考になれば幸いです。
