メインブログをBloggerに変更して1年が経過しました。
Awesome Inc. テンプレートをそのまま使用していた頃に比べると、スタイルシートの活用やスクリプトの導入などにより見栄えや使い勝手がよくなりました。
アドセンス で収益を上げることができるかを検証する目的で Gooブログから Blogger へ移行したので、カスタマイズは アドセンス に関係するものが多くなっています。
moreタグをアドセンスコードに置換するスクリプトを設置して以降クリック率が格段に向上したので、Blogger で アドセンス をやってみようと考えている方にお勧めしたい情報です。
この記事は、以下の情報があります。
- タイトル変数の調整
- タイトルの下にもラベルを表示
- ヘッダやウィジェットの余白を調整
- クロールエラーを修復
- 構造化データエラーを修復
- robots.txt を修正してGoogleインデックスカバレッジに対応させる
- 関連記事を表示するスクリプトを設置
- more を アドセンス に置換
見た目を改善してアクセシビリティを向上させる
<title>～</title>
タイトル変数を修正すると、Google などで検索した時に [記事のタイトル：ブログ名] の順序で表示させることができます。
併せて、タイトルの下にラベルを表示すると使い勝手がよくなります。
- タイトル変数の調整
- タイトルの下にもラベルを表示
- ヘッダやウィジェットの余白を調整
タイトル変数の調整
上の画像は [ブログ名：記事のタイトル] の順序で表示されている場合のスナップショットです。
Awesome Inc. テンプレートは <title>[ブログ名：記事のタイトル] </title> の並びになっているので、ブログ名が長い場合は Google などの検索結果にブログ名しか表示されない状態になる可能性があります。
ブログ名が長い場合はタイトル変数を調整することをお勧めします。
Awesome Inc. を開いて <title>～</title> の中に定義されている変数を入れ替えるだけでタイトルを変更することができます。
<title><data:blog.pageName/> :<data:blog.title/></title>
この並びにすると、Google検索結果が [記事のタイトル：ブログ名] になるので、ユーザーは記事を探しやすくなります。
タイトルの下にもラベルを表示
Awesome Inc. は投稿記事の最後にラベルが表示されますが、タイトルの下にもラベルを表示させることができます。
通常は本文を読んだらさらにその下までスクロールすることは少ないので、ラベルをタイトルの下に設置するとアクセシビリティを向上させることができます。
ヘッダやウィジェットの余白を調整
当方のブログは 1024×768 のノートPCで閲覧できるように、ブログの横幅やウィジェット間の予約などを調整しています。 Related post
Google Search Console 対策
Google Search Console には、Awesome Inc. テンプレートに起因するエラー「構造化データエラー」が記録されていました。エラーを修正すると Google のクローラーに正しい情報を提供できるようになるので、検索結果にいい影響を与えることができる可能性があります。
併せて、Blogger の robots.txt は、/search 以下をクロール拒否する設定になっているので内容を確認しておきましょう。
クロールエラーを修復
Blogger の自動パーマリンクは、記事のタイトルと投稿日から自動的に投稿記事のURLを生成する仕様になっています。
従って、Blogger の自動パーマリンクが有効になっている状態で、ブログを投稿した月とは異なる月に記事を修正した場合やタイトルを変更した時は投稿記事のURLが変わります。
Google Search Console に記録されるクロールエラーは、Blogger の自動パーマリンクに起因するエラーが多数を占めています。
URLが自動的に変更されているためクロールエラーの対象記事を探すのが困難なこともありますが、Blogger の転送機能を利用して新しいURLへ自動的に転送させることができます。
構造化データエラーの修復
Awesome Inc. テンプレートは次の規格を採用しています。- 構造化データの規格：schema.org
- シンタックス：microformats.org (hentry)
しかしながら、Awesome Inc. テンプレートは Google クローラーが指標としている schema.org が規定するいくつかのフィールド、メタタグが存在しないので Google Search Console では構造化エラーとして記録されています。
Awesome Inc. を修正するとエラーが記録されないようになります。
robots.txt を修正してGoogleインデックスカバレッジに対応させる
Blogger に付属する robots.txt は、そのまま利用すると Google Search Console からエラー警告を受けます。
具体的には、/search/label/xxx.html のコンテンツに Googleクローラがアクセスできないと警告されます。
しかしながら、Google クローラーはインデックス処理を実行するのでこの警告はスルーしても問題ありませんが、警告が記録されないように対応することは可能です。
Javascript の導入
関連記事を表示するスクリプト、<!--more--> タグの位置に アドセンス コードを追記するスクリプトを Awesome Inc. テンプレートに設置しました。関連記事を表示するスクリプトを設置
Blogger は関連記事をリストアップするガジェットがないので、海外サイトで見つけたスクリプトを設置しました。Google アドセンス には関連コンテンツユニットがあるので、利用対象になっている方はこちらを利用することをお勧めします。
more を アドセンスコードに置換
Blogger エディターの <!--more--> タグを利用しているので、<!--more--> を記述している場所に アドセンス コードを追加するスクリプトを導入しました。利用できる アドセンス ユニットに制限はありますが、<!--more--> を利用しているならばこの方法はお勧めできます。
アドセンス のクリック率が劇的に変わります。
検証：Awesome Inc. テンプレート
：SC2
このサイトを検索 | Search this site
ブロトピ：今日のブログ更新