の間にコードを埋め込む方法

「THE THOR」でタグとタグの間にコードを埋め込む方法

  • 2021年9月28日
  • 2021年9月28日
  • THOR
 
ハテナザウルス
<head>の間?タグってどうやって入れるの?
 
ヒラメキザウルス
THORなら簡単に出来るよ!

例えばGoogleアドセンスの申込みのとき、

コードをコピーして(<head>タグと</head>の間)に貼り付けて、と言われますね。

タグ?<head>?

よく分からないこと言って~、となってしまう方はいませんか。

この記事では、<head>タグの間にどうやってコードを貼り付るの?とお困りの方に対して、

コードを張り付ける方法を紹介したいと思います。

 
ヒラメキザウルス
2通りのやり方を紹介するよ!

<head>タグの間にコードを張り付ける方法

この記事では、2通りの方法を紹介します。

まずは、THORの「カスタマイズ」の機能で貼り付ける方法を紹介します。

もう一つは、他のテーマでの応用できる方法として「テーマエディター」の設定から行う方法です。

THORの「カスタマイズ」の機能でコードを貼る方法

THORの「カスタマイズ」から「コピー&ペースト」だけで簡単に<head>タグの間のコードを貼り付けることが出来ます。

「外観」>「カスタマイズ」>「基本設定」>「高度な設定」

カスタマイズから高度な設定を開く

「高度な設定」を開くと</head>直上の自由入力エリアという画面が出てきます。

このエリアに入力したものが<head></head>の間に入っていきます。

「<head>直上の自由入力エリア」にタグを張り付け

</head>直上の自由入力エリアの画面

「公開」を押せば完了です。

 
ハテナザウルス
アドセンス用のコードもこれで、大丈夫だね。

何かうまくいかなかったようです。とエラーが出てしまった場合の対処法

 
ハテナザウルス
あれ?ちょっと待って、エラーが出たよ?

「公開」押したが、エラーになってしまうことがあります。

「何かうまくいかなかったようです。時間を置いてもう一度お試しください。」

以下のような表示が出た場合の対処法をお伝えします。

何かうまくいなかったようですが表示されたの画面

HTMLやCSSのタグを加える設定をしたとき、このメッセージがよく出てきます。

このエラーは時間を置いて解決する場合もありますが、何度やっても出来ない場合もあります。

このメッセージが出てきた時は、

サーバーを開いてWAFの設定を「OFF」にすれば解決します。

筆者はConoHaWINGのサーバーを使用しています。

ConoHaWINGを使用している場合は「サイト管理」>サイトセキュリティからWAFの設定が行えます。

ConoHaサーバーでWAF設定を行う画面

注意

WAFとは (ウェブ・アプリケーション・ファイアウォール)の略でサイトのセキュリティシステムの一つです。

OFFにして、作業が終わったから必ずONにしましょう。

 
ヒラメキザウルス
セキュリティの設定なので注意です!

「テーマエディター」を開いて、直接貼り付ける方法

THORだけじゃなくて、Cocoonなどの他のテーマでも応用が出来るやり方です。

直接HTMLのソースを開いて、コードを張り付けるというやり方です。

「外観」>「テーマエディター」

使用中のテーマの「テーマヘッダー」を選択

サイトのソースが表示されます。

この画面でHTMLを直接入力したり編集することが出来ます。

このように複雑なコードがいくつも並んでいます。

分からない部分は、そのままにしておいた方がいいですね。

 
ハテナザウルス
目が回りそう。

改行は自由にできるので、スペースを作ったりして、

自分で分かる場所へコードを貼り付けしましょう。

 
ハテナザウルス
直接コードをいじるのは何だか怖い気がするなあ。
 
ヒラメキザウルス
なのでTHORでカスタマイズで設定が出来るのはありがたいよね。

全体のまとめ

この記事では、<head></head>の間にタグを張り付けてほしいと言われたときのやり方をまとめました。

タグ?<head>?

よく分からないこと言って~、となってしまう方の参考になればと思います。

THE THORではカスタマイズの機能で簡単にタグを入れる方法。

外観>カスタマイズ>基本設定>高度な設定

</head>直上の自由入力エリアに、タグをコピーして貼り付ける。

「公開」を押して完了です。

「公開」を押して、エラーメッセージが出た際の対処法。

サーバーのWAF設定をOFFにすることで解決します。

WAFはサイトのセキュリティシステムです。

この作業が終わったらONに切り替えるのを忘れないようにしましょう。

テーマエディターから直接HTMLを編集する方法。

外観>テーマエディター>テーマヘッダー

THORだけじゃなくて、Cocoonなどのテーマでも応用が出来る方法です。

<head></head>を探して直接タグを貼り付けします。

当ブログで使用中のテーマ「THE THOR」はこちら