Blogger の個別記事にはページ ID が存在し、この情報は下書きの段階でも確認できます。
Blogger の記事の HTML には id="" のような個別 ID が自動で付きます。知っていると便利な使い方が可能です。
ID は他と被らないようにしなければなりません。バッティングするとサイトのレイアウトが崩れてしまう可能性すらあります。 そのため、サードパーティのウェブツールは対象の HTML が不明なため、ID には長い文字列を使っています。
執筆者が文字列を考えるのは面倒で気を使います。自動で付けてくれるのはありがたい。Blogger の ID の確認方法と活用方法です。
Google Blogger の記事 ID を確認する方法
エディット画面のブラウザ URL の末尾 18–19 文字の数字が ID です。
-
記事のタイトルリンクの直前に #○○○○○○○○○○○○○○○○○○○ の ID が付きます。
<a name='1609651531103563098'></a>
記事タイトル <h3> のすぐ上に name 属性が追加されます。空タグなのでスタイル指定には使えませんがリンクターゲットとして利用できます。なお、現代の a 要素の name 属性は廃止され id 属性一つにまとめられています。
-
記事本文には #post-body-○○○○○○○○○○○○○○○○○○○ が付きます。こちらが本命。記事本文とはタイトルを除いたエディット画面で内容を書く部分です。
Blogger 自動 ID の利用例
name 属性 の使いどころ
name 属性はリンクターゲットとして利用できます。
http://nonsubject.arinco.org/2024/01/blogger-preview-get-boost.html#1609651531103563098
記事の直前までジャンプします。
対象記事が見えるページなら次のような使い方も可能。
#post-body-id の使いどころ
-
記事本文に付く ID (#post-body-id) はその記事のみのスタイルに使えます。
<style>
#post-body-1609651531103563098 {
background-color: lightyellow;
}
</style> -
記事内 ID のプリフィックスとして指定する。
🤩おすすめの使い方です。
<section id="#post-body-1609651531103563098-1">
<h3 id="#post-body-1609651531103563098-1h">
この命名規則なら、アーカイブ、記事一覧、ラベル、トップページ、サイト内のどこから閲覧しても ID は重複しません。
id の先頭に数字は使えないので name の識別子は利用不可です。
-
name 属性と同じようにリンクターゲットとしても使えますが、ページタイトルが含まれないので、この使い方なら name 属性のが有効でしょう。
blogger-preview-get-boost.html#post-body-1609651531103563098