アドセンスコードの貼り方

THE THOR(ザ・トール)アドセンスコードの貼り方を徹底解説!

アドセンスコードの貼り方

当ブログをご覧になっている人は、ほとんどがアフィリエイト収入を得るためにブログ運営をしていることと思います。

いくつかあるアフィリエイト収入の中でも、特に人気なのが「Googleアドセンス」でしょう。

THE THOR(ザ・トール)はいくつか広告コードを貼る方法があるので、今回は広告コード、特にアドセンスコードの貼り方について解説していきますね!

THE THOR(ザ・トール)にアドセンス(広告)コードを張り付ける方法

THE THOR(ザ・トール)にアドセンス(広告)コードを張り付ける方法ですが、基本的にHTMLコードが書けるところなら何処でも表示させることができます。

WordPressのプラグインにも、アドセンスコードを簡単に挿入できるものもあります。

ただTHE THOR(ザ・トール)にはデフォルトで広告を設置することができどうな箇所が何カ所かあるので、使えるならこれを利用しない手はありません。

私が貼れそうな箇所をいくつか抜き出してみました。

 

  • 記事ごとに手動で貼り付け
  • タグ管理機能を使って貼り付け
  • カスタマイザーの広告設定から貼り付け
  • ウィジェットで貼り付け

 

ではそれぞれアドセンスコードを張り付けて検証してみましょう。

貼り付けるアドセンスコードは、Googleアドセンスにしたい所でしたが、それだと記事に反映されるのに時間がかかるため、一部に検証用に「忍者adMax」のコードを張り付けました。

記事ごとに手動で貼り付け

これは普通に貼り付けられます。
むしろ貼り付けられなかったら、何かミスをしているので、コードが間違っていないかなど確認してくださいね。

ではアドセンスコードの貼り付け方です。

投稿編集画面の文章の好きな所に「テキストエディタ」で下のようなコードを張り付けます。

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle"  style="display:block; text-align:center;"  data-ad-layout="in-article"  data-ad-format="fluid"  data-ad-client="ca-pub-123456789"  data-ad-slot="123456789"></ins><script>  (adsbygoogle = window.adsbygoogle || []).push({});</script>

表示されるブログサイトのバランスや広告のクリック率を考えて自分で貼り付ける1番オーソドックスな方法です。

投稿編集画面を開いてテキストエディタに変更します。

テキストエディタでコードを張り付け

あとは記事に反映されると広告が表示されます。
ちなみにGoogleアドセンスだと反映に最大1時間程度かかるらしいので、気長に待ちましょう。

ある程度ブログサイトの運営に慣れてきたら色々貼る場所を考えて試してみても良いでしょう。

タグ管理機能を使って貼り付け

タグ管理機能とは、本来ランキング記事などに使う商品詳細を表示させる項目です。

例えば下の画像のようなものを作成する機能です。

タグ管理デモ商品

エディター画面でテキストを入力する画面があるので、ここでも貼り付けられないか試してみました。

ダッシュボードのメニュー「タグ管理」をクリックします。

タグ管理をクリック

タグ管理の新規追加ボタンをクリックします。

タグ管理新規追加をクリック

テキストエディタのタブをクリックし、分かりやすいタイトルを決めます。

あとは取得したアドセンスコードを張り付けます。

コードを張り付け

忘れてならないのが次です。

公開ボタンをクリックする前に、下の方にスクロールしてください。

「タグ管理オリジナルフォーマット」という欄がありますが、この中の「表示スタイル」という項目の「フォーマットを利用しない」に必ずチェックを入れてください。

じゃないと、変な表示になってしまうのでご注意ください。

フォーマットを利用しないにチェック

最後に公開ボタンをクリックして完了させます。

公開ボタンの下の方にショートコードが表示されているので、任意の場所にこのショートコードを張り付ければ広告が表示されます。

ショートコードが表示される

実際の投稿記事画面です。

タグ管理広告表示

 

ちょっと見難いですが、グレーの枠線の中に広告が表示されます。

枠線が表示されているのが気になりますが、普通の設定で消す方法が分かりませんでした。

今のところCSSで枠線を消したり、線の種類や色は変えられるので、知りたい人はご連絡ください。

カスタマイザーの広告設定から貼り付け

カスタマイザーの広告設定でアドセンスコードを張り付ける方法です。

THE THOR(ザ・トール)では、この広告設定で貼り付けるのが王道でしょう。

ダッシュボードのメニュー「外観」⇒「カスタマイズ」でカスタマイザーを開き「広告設定[THE]」をクリックします。

広告設定カスタマイザー

アーカイブ用広告設定

アーカイブ画面で表示させるインフィード広告を設定します。

アーカイブ画面とは、例えばカテゴリーページの記事一覧画面のことを言います。

注意書きにもありますが、アーカイブページ設定で「コントローラー設定」の「レイアウト切替ボタン」が非表示になっていないと広告が表示されないので、注意してくださいね。

アーカイブ広告設定画面1
アーカイブ広告設定画面2

PC版では「ワイドレイアウト・カードレイアウト・ノーマルレイアウト」、スマホ版では「ワイドレイアウト・ノーマルレイアウト」それぞれにアドセンスコードを張り付けます。

あとは「1つ目・2つ目の広告」を何番目に表示させるか設定します。

個別ページ用広告設定

ここでは、記事内に表示させるアドセンス広告を設定します。

アドセンスコードを入力すると、あとは投稿編集画面で「adcode」と入力するだけで広告が挿入されます。

個別ページ用広告設定画面1

「ダブルレクタングル広告」とは、こんな感じに左右に2つ並んだ広告のことです。

ダブルレクタングル表示例

左右それぞれ表示させるアドセンスコードを入力します。

個別ページ用広告設定画面2

ちなみに「背景スタイルを無効にする」にチェックを入れると、下の画像のように左右の広告の周りの背景が無効になります。

ダブルレクタングル背景スタイル無効

ウィジェットで貼り付け

ウィジェットエリアに広告を貼る方法です。

普通のバナー広告などはテキストウィジェットでも良いのですが、THE THOR(ザ・トール)には広告ウィジェットがあるので、こちらを利用しましょう。

WordPressのダッシュボード⇒「外観」⇒「ウィジェット」をクリックします。

左側にある「利用できるウィジェット」の「[THE]広告」を任意のウィジェットエリアに追加します。

任意のウィジェットエリアに追加

試しに「投稿ページ上部エリア」に追加してみましょう。

投稿ページ上部エリアに追加

で、タイトルは「広告」で良いでしょう。

広告タグを入力して、背景スタイルはとりあえず無効にはしません。

投稿ページ表示例

記事の上に表示されましたね。

広告のサイズは適当だったので、その辺りは広告側で調整しましょう。

ちなみにテキストウィジェットでも表示させれますが、多少手間がかかるのでオススメしません。

試しにテキストウィジェットで表示させてみます。

テキストウィジェットでの表示例

上が「広告ウィジェット」で下が「テキストウィジェット」で広告を表示させています。

まあ下の「テキストウィジェット」で表示させた広告も悪くはないと思いますが、上の「広告ウィジェット」を使った方が広告らしくて良いですね。

ちなみに下のテキストウィジェットで表示させた広告が左側に寄ってちゃってますが、広告タグを「<center>~</center>」で囲えば中央に表示されます。
テキストウィジェットで広告タグを入力する場合は、「ビジュアル」ではなく「テキスト」で入力してくださいね。

Googleアドセンスの自動広告を設定する

Googleアドセンスの「自動広告」の設定方法を解説します。

まずGoogleアドセンスの自動広告とは、Googleアドセンス側でブログ内に自動的に広告を表示させてくれる機能を持った広告種類になります。

アドセンス広告をどこに表示させたら良いか分からないという人には便利な機能となっています。

自動広告の設定方法は簡単です。

まずはGoogleアドセンスの管理画面から自動広告用の広告コードを取得します。

すでにURLを登録している場合は、①「自動広告を設定」をクリックして広告コードを取得します。

新規で自動広告を取得する場合は、②「新しいURLグループ」から設定してください。
今回はその辺の詳しい設定方法は割愛します。

Googleアドセンス自動広告タグを取得

Googleアドセンス自動広告コードを取得しましたら、それをブログサイトの「<head>~</head>」の間に貼り付けます。

本来は直接「header.php」ファイルに貼り付けるのですが、THE THOR(ザ・トール)では専用に貼り付ける箇所があるので、そちらに貼り付けましょう。

WordPressのダッシュボード⇒「外観」⇒「カスタマイズ」からカスタマイザーを開きます。

「基本設定[THE]」をクリックしたら下の方に「高度な設定」という項目があるので、これをクリックして開きます。

「</head>直上の自由入力エリア」に取得した自動広告コードを張り付けて「公開」ボタンをクリックして完了です。

head内に貼り付け

張り付けてもすぐには反映されないので、気長に待ちましょうね。

まとめ

いかがでしたか?

THE THOR(ザ・トール)での広告コードの貼り付け方法について説明しました。

今回はアドセンス広告に絞って説明しましたが、普通のバナー広告にも活用できる部分はあるので参考にしてください。

メルマガ登録バナー1

アドセンスコードの貼り方
最新情報をチェックしよう!