Bloggerの記事タイトルやURLなどをJavaScriptで取得する方法

ブロガーのThemeを作っていると、

「ブログのタイトルを取得したい！」とか

「現在表示しているページが、個別記事なのかTopページなのかJSで取得したい！」

とかあったりしませんか？そSでBloggerの様々情報を取得して変数に格納する短いコードを記載します。どうぞご活用ください。

情報を取得するJavascriptコード

このコードをテンプレート中の<script>に記載すれば、それぞれ変数で定義した値を取得可能に。

<script type="text/javascript">
var blogTitle = '<data:blog.title/>';
var blogUrl = '<data:blog.homepageUrl/>';
var pageTitle = '<data:blog.pageTitle/>';
var url = location.href;
var blogType = '<data:blog.pageType/>';
</script>

それぞれ以下のようになっています。

• ブログタイトル: <data:blog.title/>
• ブログTopページのURL：<data:blog.homepageUrl/>
• 表示しているページのURL：<data:blog.homepageUrl/>
• 表示しているページのタイトル：<data:blog.pageTitle/>
• 表示しているページの種類：<data:blog.pageType/>

なので、現在表示しているページの種類を知りたくば変数blogTypeの値を参照すればOKなわけです。ページの種類にはレイアウト用のデータタグ - Blogger ヘルプよれば、

「item」「file」「index」の３種類があるとされていますが、他にも加えて「archive」「static_page」が存在します。すべての種類は

• item: 個別記事ページ
• file: 不明？
• archive: アーカイブ
• index: ラベル、アーカイブ、トップページ
• static_page: ページで作成した、ページ

の5種類です。

グローバルに参照できるデータ

<script>部にBloggerのdataタグが使用できるってちょっと以外ですよね。ミックスした文法に違和感というか。データタグって<b:>記法で参照できるものなんだなって勝手に解釈してた。


Blogger公式ヘルプの情報をみると

グローバルに利用可能なデータ この情報は、特定のウィジェットでのみ使用できるデータとは異なり、任意の場所で使用できます
レイアウト用のデータタグ - Blogger ヘルプ

任意の場所で使用できますとなっている。任意とは・・・・・？？

画像引用元：ジョジョ5部

任意の場所・・・・・ってテンプレートのウィジェットの種類を選ばないでOK！ってことだと思ってたんだよ。。。。テンプレート=htmlのどこでも利用できるデータなのね。だからscriptの変数に混ぜたり、expr:してデータを取得したりとか結構できるみたいなんですね。これは奥深いわ。てか覚えられねぇよなぁ。なんとか体系的に語っている教科書的な情報はないものかなぁ・・・