はてなブログの設定を晒す

なぜ晒すのか

同じような設定をしたい人の参考になれば！

というよりは自分用メモです、はい。 設定どうしたかって忘れちゃうよね！

主な設定方針

• 無料アカウントだけど広告（Googleアドセンス）をいい感じ（記事下とか）に出したい
  • スマホでも出したい
• googleタグマネージャーでアドセンスやアナリティクスは管理する
  • アカウント作成方法も忘れるのでメモっておきたい

はてなブログの設定

• デザイン

  • デザインテーマ
    • 公式テーマ：Life（デフォルト）

  • カスタマイズ

    • サイドバー
      • モジュールを追加でHTMLを選択
        • googleタグマネージャーのbody内タグを追加（タイトルは『GTMbody内』にした）
    • フッタ
      • ※1をコピペ
        • 広告表示
        • タイトルのリンクをアーカイブに変更

  • スマートフォン

    • 詳細設定
      • レスポンスデザインにチェック

• 設定

  • 詳細設定
    • headに要素を追加
      • ※2をコピペ
        • googleタグマネージャーのhead内タグ
        • トップページへのアクセスはアーカイブへリダイレクト（※現在はやめた）
    • 解析ツール
      • Google Search Console

↓※1

<!-- // 広告表示 -->
<div id="content-footer-ads">

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- hatena_aoma23 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="xxxxxxxxxx"
     data-ad-slot="xxxxxxxxxx"
     data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

</div>
<script>
// 記事があれば記事下に移動
var entry_content_elements = document.getElementsByClassName("entry-content");
if (entry_content_elements.length > 0) {
    var content_footer_ads=document.getElementById("content-footer-ads");
    var temp=content_footer_ads.cloneNode(true);
    content_footer_ads.parentNode.removeChild(content_footer_ads);
    entry_content_elements[0].appendChild(temp);
}
</script>

<!-- // タイトルのリンクをアーカイブに変更 -->
<script>
(function() {
  document.querySelector("#title a").href = "/archive";
}());
</script>

↓※2

<!-- トップページへのアクセスはアーカイブへリダイレクト -->
<script type="text/javascript">
  if( location.href == 'http://aoma23.hatenablog.jp/'){
  location.href='http://aoma23.hatenablog.jp/archive';
}
</script>

<!-- googleタグマネージャーのhead内タグ -->
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-xxxxxxxxxx');</script>
<!-- End Google Tag Manager -->

googleタグマネージャー作成

googleタグマネージャーで新しいアカウントを作成して埋め込むタグを取得

body内

googleアナリティクス

• 新しいタグ作成
  • googleアナリティクス側でトラッキングIDを取得しておく

googleアドセンス　タグ

新規作成

googleサーチコンソール

新規プロパティ作成