【はてなブログの知恵袋】トップページで記事と記事の間にgoogleアドセンスをいれる方法

f:id:somalica:20220929235409j:image

みなさんはgoogleアドセンスをどこに配置していますでしょうか？
できるだけ訪問されたユーザーの目につくように広告をどこに配置するかはとても重要です。
はてなブログのTOPページで記事と記事の間に広告を設置する方法について解説したいと思います。

ブログのトップページの表示が一覧表示か全文表示か確認する
デザイン設定のフッタにスクリプトを設置する
２箇所に設置する方法
全文表示の場合の変更点

ブログのトップページの表示が一覧表示か全文表示か確認する

まずブログのトップページの表示が一覧表示か全文表示かでスクリプトが一部異なります。以下一覧表示の場合のスクリプトを記載しております。
全文形式でも可能ですが、変更部分については最後に記載しています。

デザイン設定のフッタにスクリプトを設置する

次にデザイン設定からフッタを選んでそこにスクリプトを設置します。

<script type="text/javascript" src="https://code.jquery.com/jquery-3.6.1.js"></script>
<script>
  var ads_between_entry1=(function() {/*
      <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=クライアントID"
     crossorigin="anonymous"></scrip>
<!-- TOPページ記事間用ディスプレイ広告 -->ここに設置したいgoogle adsenseの<ins>部分をはりつけます
<ins class="adsbygoogle"
     style="display:block; text-align:center;"
     data-ad-layout="in-article"
     data-ad-format="fluid"
     data-ad-client="クライアントID"
     data-ad-slot="スロットNO"></ins>
<scrip>
     (adsbygoogle = window.adsbygoogle || []).push({});
</scrip><br>
  */}).toString().match(/\/\*([^]*)\*\//)[1].replace(/scrip>/g, 'script>');

   $(window).on("DOMContentLoaded", function(){
    if($('body').hasClass('page-index')){
      $entry = $('.archive-entry');
      $entry.eq(1).after($(".toppage-ads1"));
      ($(".toppage-ads1")).html(ads_between_entry1);
    
    }
  });
  
</script>
<div class="toppage-ads1"></div>

赤字部分はご自身の内容で変更してください。
注意はところどころ<script>が<scrip>となっています。ここ注意です。
あえて"t"を抜いています。
また何番目の記事と記事の間に設置したいかによって
entry.eq(1)の1の数字を変更してください。ちなみに何番目の記事のあとに設置するかの数字ですが、最初の記事を０番目として計算します。
つまりこの例ですと”１”なので２番目と３番目の記事の間に広告を挟み込みます。

２箇所に設置する方法

１箇所だけ設置する場合はこれで終わりです。
２箇所に設置したい場合は、このスクリプトを少し修正します。

<script type="text/javascript" src="https://code.jquery.com/jquery-3.6.1.js"></script>
<script>
  var ads_between_entry1=(function() {/*
    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=クライアントID"
     crossorigin="anonymous"></scrip>
<!-- TOPページ記事間用ディスプレイ広告 -->ここに設置したいgoogle adsenseの<ins>部分をはりつけます
<ins class="adsbygoogle"
     style="display:block; text-align:center;"
     data-ad-layout="in-article"
     data-ad-format="fluid"
     data-ad-client="クライアントID"
     data-ad-slot="スロットNO"></ins>
<scrip>
     (adsbygoogle = window.adsbygoogle || []).push({});
</scrip><br>
  */}).toString().match(/\/\*([^]*)\*\//)[1].replace(/scrip>/g, 'script>');

  var ads_between_entry2=(function() {/*
    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=クライアントID"
     crossorigin="anonymous"></scrip>
<!-- TOPページ記事間用ディスプレイ広告 -->ここに設置したいgoogle adsenseの<ins>部分をはりつけます
<ins class="adsbygoogle"
     style="display:block; text-align:center;"
     data-ad-layout="in-article"
     data-ad-format="fluid"
     data-ad-client="クライアントID"
     data-ad-slot="スロットNO"></ins>
<scrip>
     (adsbygoogle = window.adsbygoogle || []).push({});
</scrip><br>
  */}).toString().match(/\/\*([^]*)\*\//)[1].replace(/scrip>/g, 'script>');

  $(window).on("DOMContentLoaded", function(){
    if($('body').hasClass('page-index')){
      $entry = $('.archive-entry');
      $entry.eq(1).after($(".toppage-ads1"));
      ($(".toppage-ads1")).html(ads_between_entry1);
      $entry.eq(3).after($(".toppage-ads2"));
      ($(".toppage-ads2")).html(ads_between_entry2);  
    }
  });
  
</script>     
<div class="toppage-ads1"></div>
<div class="toppage-ads2"></div>