【便利】はてなブログにアドセンスを簡単に貼る方法【div1行、一括変換できる】

はてなブログにアドセンスを貼る方法について、一つ前の記事で紹介しましたが、今回は応用技もお知らせしますね！

divタグ1行で、はてなブログにアドセンスを貼る方法です。

前回記事はこちらです。

www.toyo104-memo.com

Adsenseのコードをそのまま貼ることもできますが・・・

divタグ1行で、はてなブログにアドセンスを貼る方法、をお伝えしようと思うのですが、ぶっちゃけ、Adsenseのコードをそのまま貼っても表示されます。

こんな風に貼って……

f:id:toyo--104:20180521230217p:plain

ちゃんと表示されます。

f:id:toyo--104:20180521230319p:plain

ただ、これだと毎回数行に渡るコードを貼らなくてはいけなくて手間ですし、

非表示にしたり、別のコードに差し替えたい時に、各記事を個別で編集しないといけないので面倒です。

今回お知らせする方法を使えば、divタグ1行で全ページ一括操作が出来て便利ですよ。

早速ためしてみよう、アドセンス一括表示コード

では始めましょう。まずは設定を追加です。

以下のコードをコピーして下さい。

<script>
addEventListener("DOMContentLoaded", function() {

  var gads = document.getElementsByClassName('gads');

  for (var i = 0, len = gads.length; i < len; i++) {
  
    var adsScript_gads = document.createElement('script');
      adsScript_gads.async = true;
      adsScript_gads.src = '//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
    
    var adsInsert_gads = document.createElement('ins');
      adsInsert_gads.className = 'adsbygoogle';
      adsInsert_gads.style.display = 'block';
      adsInsert_gads.dataset.adClient = 'ca-pub-*********************';
      adsInsert_gads.dataset.adSlot= '**************';
      adsInsert_gads.dataset.adFormat = 'auto';

    var adsGoogle_gads = document.createElement('script');
      adsGoogle_gads.text = '(adsbygoogle = window.adsbygoogle || []).push({});';

    gads[i].insertAdjacentHTML('beforeend', "<p>スポンサーリンク</p>");
    gads[i].appendChild(adsScript_gads);
    gads[i].appendChild(adsInsert_gads);
    gads[i].appendChild(adsGoogle_gads);
  }
});
</script>