サイトアイコン うっくん家(ち)

3)サイトに広告を載せてみる やったーやったよー編

娘っ子はどこでもガジガジするガジラさん。
買ったばかりの椅子をガジガジ..ゴリゴリ..メリメリ..
あ。椅子がささくれだらけ。
ウフフ。この椅子高かったんですよ( ͡° ͜ʖ ͡°)
ささくれとってヤスリをかける日々です。

さてさて、前回審査に落ちてから1年ぶりにAdSenseに申請を出してみる。

今回はすんなりと翌日に合格通知が!
フゥーフゥーーーー!ヤッホォーーーーイヽ(゚∀゚)ノ


ブログをこまめに更新しているかいがありました。
さっそく広告の設定とコードを手に入れよう!

手始めにパソコンとモバイル向けのQuickStart広告をオンに。

画面左上の横三本線からメニューを開きます。
広告設定 > 広告ユニット を選び「新しい広告ユニット」を押します。

広告の種類を選びます。
PCメインのブログなので「テキスト広告とディスプレイ広告」を選びます。
モバイル用のAMPに表示する際は「インフィード広告」がおススメです。

広告ユニットの名前を付けて(とりあえずテストに)大きさを選びます。
細かい設定は後でするとしてこれで準備は完了です。

コードを取得したら表示する場所にコードを埋めます。
今回はウェジットに表示したいので 外観 > ウェジット からテキストを選びます。
テキストにコードを埋め込んで好きなサイドメニューの位置に設置すると完成です。

ちなみに取得したコードで下記コードはページで一回だけ読み込めばいいので二つ設置するときは下記コードの部分を省きます。

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

AMPのプラグインにコードを埋め込む場合は amp/templates/single.php に下記タグを埋め込みます。

<amp-ad
width="300"
height="250"
type="adsense"
data-ad-client="ca-pub-XXXXXXXXXXXXXXXX"
data-ad-slot="XXXXXXXXXX">
</amp-ad>

amp/templates/single.php はプラグイン > AMP の編集から書き換えができます。
single.phpの </footer> と </article> の間に埋め込みます。
</footer>
// adsense
<amp-ad width="300" height="250"
type="adsense"
data-ad-client="ca-pub-XXXXXXXXXXXXXXXX"
data-ad-slot="XXXXXXXXXX">
</amp-ad>
</article>

私の場合は広告がすぐは表示するのを確認できましたが、たまに数時間待たないと表示されないことがあるようです。

モバイルバージョンを終了