aoma blog

エンジニアの日常とか技術とか

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

なぜ晒すのか

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

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

主な設定方針

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

はてなブログの設定

  • デザイン

    • デザインテーマ
      • 公式テーマ:Life(デフォルト)
    • カスタマイズ

      • サイドバー
        • モジュールを追加でHTMLを選択
          • googleタグマネージャーのbody内タグを追加(タイトルは『GTMbody内』にした)
      • フッタ
        • ※1をコピペ
    • スマートフォン

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

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

↓※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アドセンス タグ

新規作成

googleサーチコンソール

新規プロパティ作成