【簡単・プラグインなし】Wordpressサイトでhead要素を自由に編集する方法!

Linuxと電子部品と音楽のブログ

【簡単・プラグインなし】WordPressサイトでhead要素を自由に編集する方法!

今回はWordpress初心者がよく悩む、サイトのhead要素を弄る方法を教えるよ!

確かに、広告収入とかアフィリエイトを始める上で絶対外せないことだからね。

プラグインを使う方法もあります。が…

WordPressを使ったことがある方はわかると思いますが、Wordpresは単体だけでもとても重く、さらにプラグインを追加すればするほどどんどん表示速度が遅くなってしまい、読み込み速度の遅さによるストレスからせっかく来てくださったユーザーが去ってしまうことがあります。

例として私のサイトの表示速度をご覧ください。

私のブログページ

私のフォーラムページ

ブログページは派手な演出とかシェアボタンを付けたりとかで沢山のプラグインを付けた結果、この有様です…(´・ω・`)
対してフォーラムページはほとんどテキストだけでやりとりして、私のような底辺開発者のフォーラムなんて投稿がほとんどゼロに等しいのでとても高速です。

なので、ここは私の体験談も兼ねてプラグインでhead要素を簡単に編集してしまうよりも自力で直接いじった方が速度も速いですしシンプルに閲覧しやすくなります!
以上のことを踏まえたうえで、実際の編集方法をご紹介していきます。


編集方法

まずは、ご自分で使用しているWordpressの管理画面にアクセスしてください。
特に設定を変えたりしていなければ、
https://自分のサイト/wp-admin.php
で、ログインできるはずです。

Wordpressログイン画面
WordPressログイン画面

このような画面が出てくれば正解です。

そうしたら、左側にあるメニューから外観→テーマエディターの順番に移動してください。

テーマエディター
テーマエディター

このような画面が出てくれは正解です。

その次に、右側にある「テーマファイル」というリストから「functions.php」という項目を探してください。(上の画像では二番目にあります)
テーマによっては、「Theme Functions」などと親切に書いてあります。
その画面まで進むことができたら、次のコードをコピーしてください。

// head要素を追加するスクリプト
function meta_headcustomtags() {
$headcustomtag = <<<EOM

<!-- head要素に入れたいコードをここに入力! -->

<!-- ここまで -->

EOM;
echo $headcustomtag;
}
add_action( 'wp_head', 'meta_headcustomtags', 99);
//ここまで

意味は分からなくても問題ありません。(私も知りませんので…)
これを、このままfunctions.phpの一番下に貼り付けます。

そして、上のコードでいう6行目に当たる部分にGoogleやその他アフィリエイトサイトから指示されたスクリプトを書きます。

私の場合
私の場合

私の場合で例えますと、ほとんどGoogleからのコードです。
これで最後にページ左下にある「ファイルを更新」ボタンを押すことによって、head要素がサイト全体に反映されるようになります。


注意点

これでWordpressを利用しているサイトで無事、head要素を自由にいじることができるようになりました。
ですが、この方法には注意点があります。

  • WordPressで「テーマの更新」をするとhead要素がすべて消える
  • 気分転換などでサイトのテーマを変えるとhead要素がすべて消える

これには十分注意してのご利用をお願いします。
ちなみに、一つ目の問題に関しては「子テーマ」というものを作ることによって対策が可能です。
詳しくは、また別の記事に書きます。
二つ目の問題に関しては対策法がないので、テーマを切り替えるたびに「functions.php」を探して、毎回対応してあげてください。


終わりに

プラグインを使わなくてもWordpressでのhead要素の編集は簡単にできるってことを今回は記事にしたよ!

やっぱWordpressがあるとプログラムを打ち込む部分が最小限で済むから便利だね!

あ、広告をクリックしてくださると喜びます!(唐突)

ありがとうございました!

 

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

Please note that posts that do not contain Japanese are ignored. (Spam measures) (コメントには日本語を含めてください)