Bloggerの見出しタグ
Bloggerの最初の設定のままだと見出しタグの順番が変です。
何が変かというと、記事に見出しタグを使う順番が間違っているのではないかということです。
見出しタグは、大きい見出しから順にh1・h2・h3・h4・h5・h6を振り分けます。なので、一番大きい見出しである記事タイトルはh1であるはずなのに、Bloggerではなぜかh3になっています。
さすがに、これはまずいと思ったのでがどこに振り分けられているのか調べたうえで自分で変更しました。
見出しタグの変更前と変更後
| h1 | ブログ名 |
| h2 | ガジェットタイトル 日付 見出し |
| h3 | 記事タイトル 小見出し |
| h4 | コメント 準見出し |
| h5 | なし |
| h6 | なし |
| h1 | ブログ名 記事タイトル |
| h2 | 見出し |
| h3 | 小見出し |
| h4 | コメント 準見出し |
| h5 | ガジェットタイトル 日付 |
| h6 | なし |
まず、h2がガジェットタイトルです。ガジェットタイトルがh2である必要はないし、見出しを装飾したらガジェットタイトルも装飾されてしまうので許せないので、ガジェットタイトルをh2からh5に変更しました。
次に、記事タイトルですがh3はさすがに問題です。記事タイトルは見出しより上の存在でなければいけないと思ったのでh3からh1に変更しました。
変更する前に
見出しタグの順番を変更するためにHTMLを編集します。
なので、変更する前には必ずバックアップをとっておいてください。
編集を失敗した時のためです。バックアップがあれば、編集に失敗したときにブログを元の戻すことができます。
私は今回の編集で2回ほどバックアップでブログを元に戻しました。
バックアップをとったら、もう一つ記憶しておいてほしいものがあります。
それが、カスタマイズから入力したCSSです。HTMLを編集したら入力しておいたはずのCSSが消えてしまいます。
なので、カスタマイズから入力したCSSをどこかにコピペしておくことをお勧めします。
HTMLを編集して見出しタグを変更する
テーマからHTMLを編集します。
HTMLを編集する画面を開いてコードの中から<b:skin>...</b:skin>を見つけてください。私の場合は、24行目にありました。
<b:skin>...</b:skin>は、今閉じた状態なので行数横の黒い三角を押してコードを開いてください。そうすると、青文字で書かれたコードが大量に表示されます。
このコードの中から、見出しタグを見つけて全て書き換えます。h3をh1に変更する場合はh3全部をh1に書き換えます。
このようにして、大量のコードから1つ1つ書き換えていきます。このときに、間違えないように書き換えてください。間違えたら、自分で修正するかバックアップを復元してください。
青いコードの中の見出しタグを書き換えたら、次は青いコード以外に使用されている見出しタグを書き換えます。
コードの中のどこに見出しタグがあるかは人それぞれ違います。
なので、すべてのコードを開いて1つ1つ見出しタグを探して、見つけては変更して行くしかありません。地道な作業です。
変更できたら、プレビューやブログを見て変更が間違っていないか、変なところがないかを確認して保存したら完了です。
変更後にガジェットを追加したら
変更後にガジェットを追加したら、その都度HTMLの編集で、ガジェットの見出しタグを変更してください。
