（はじめに）

前回の記事で、Blogger beta 用のレイアウト可能なテンプレートを書くには、新しい形式のタグを使わないといけない、ということを書きました。そのタグについてのヘルプ Blogger Help: Page Elements Tags for Layouts を自分の勉強のために日本語にしてみました。正式にヘルプが日本語化されるまでの間ですが、参考にしてもらえたら、と思います。


ページエレメントタグ

新しい Blogger beta テンプレートの body 要素内は、セクションとウィジェットで構成されます。

• セクション … サイドバー、フッターといったページの領域のこと。
• ウィジェット … 画像やリスト、ブログロールなど、Blogger beta 管理画面のページエレメントタブから加えることができる、ページの部品たち。

セクションタグ

たとえばヘッダーセクションではこのようなタグが使われています。

この b:section タグで指定できる属性は次のとおりです。

• id … （必須）英数字だけを使ったユニークな名前。
• class … （オプション）テンプレートで共通に使われているのは、navbar、header、main、sidebar、footer。別の名前を使用することも可能。
• maxwidgets … （オプション）そのセクションに含むウィジェットの最大数。未指定だと最大数を設けません。
• showaddelement … （オプション）yes か no を設定することができます。これはページエレメントタブでこのセクションに Add a Page Element（ページエレメントを追加する）リンクを表示するかどうかです。未設定だと yes。
• growth … （オプション）horizontal か vertical を設定します。これはそのセクションが含むウィジェットを水平（horizontal）に配置するか、垂直に配置するかを設定するもの。未設定は vertical。

この b:section タグは動的ページ生成の際に div 要素に書き換えられます（id はそのまま）。なので id='header' な b:section 要素に CSS を適用したい場合は、div.header を指定したスタイルを書きましょう。

セクションはウィジェットしか含むことが出来ません。他のセクションや他のコードは含むことができないので注意が必要です。


ウィジェットタグ

Blogger beta 管理画面の簡単な表示形式では、ウィジェットは一つのタグで表されます（内容を展開して表示する事も可能）。例を挙げるとこんな感じです。



b:widget タグが指定できる属性は、次のとおりです。

• id … （必須）英数字のみの、テンプレート内でユニークな名前。ウィジェット ID はウィジェットを削除して新しいものを作らないと、変更することが出来ません。
• type … （必須）どんな種類のウィジェットかを示します。指定できる文字列は次のとおりです。
  • BlogArchive
  • Blog
  • Feed
  • Header
  • HTML
  • SingleImage
  • LinkList
  • List
  • Logo
  • BlogProfile
  • Navbar
• locked … （オプション）yes か no を指定します。ウィジェットをロックするかどうかの設定です。ロックされたウィジェットは動かしたり削除することができません。
• title … （オプション）ウィジェットの表示タイトルです。未指定だと List1 などの文字列が自動的に使われます。
• pageType … （オプション）そのウィジェットをどのページに表示するかを設定します。all（全ページ）、archive（アーカイブページ）、main（メインページ）、item（記事単独ページ） のいずれかを指定します。デフォルトは all です。この pageType に関わらず、ページエレメントタブにはウィジェットが表示されます。

自分でウィジェットを作る場合には、ウィジェットのレイアウトとコンテンツを、ウィジェット内容が展開された形式のフォームに書き入れます。
バックアップのために Edit HTML タブからダウンロードするコードは、この展開されたコードになります。
普通、このモードでウィジェットを操作する必要はないと思います。ページエレメントタブからそれらを変更するだけの方が簡単なので。

この b:widget タグも動的ページ生成の際に div 要素に書き換えられます（id はそのまま）。そのため id='myList' な b:widget 要素に CSS を適用したい場合は、div.myList を指定したスタイルを書くようにしましょう。


（おわりに）

テンプレートタグを新しいものに書き換えないと、ぐらいにしか考えていなかったんですが、テンプレートの仕組み自体が大きく変わっているんですね。ブログの部品のフォーマットがはっきりしている分、部品を導入したりはずしたりということが随分楽になりそうな予感。もちろん部品を作る方は、新しいタグの仕組みをしっかり覚えないといけませんが。

Blogger beta で用いる独自のウィジェット作成に関しては、ウィジェットタグの詳細 Widget Tags for Layouts や、ウィジェットで参照するデータ Layouts Data Tags も理解しておかないといけないと思うので、また日本語にしてこのブログで公開することにします。需要があるかはわかりませんが…（汗）。

スポンサードリンク： お願い：