テンプレートタグでカスタマイズ２

前回の記事でこう書きました。

ページレベルタグを使うと、メインページに表示するパーツ、記事単独ページに表示するパーツなどをＨＴＭＬで書き分けて、ページの種類ごとに表示するコンテンツを変える、といったカスタマイズも可能になります。

今日はこの続き。テンプレートタグ（特にページレベルタグ）は一般的な HTML とはちょっと違う書き方が出来ます。

これはページ内のブログタイトル表示の部分なんですが、一行目をみると、<a> が閉じ終わる前に外側の <ItemPage> が閉じてしまっています。
実はテンプレートタグは HTML タグと違って、「再構築」ボタンを押してページが構成される時に解釈され書き換えられるので、このような書き方ができるのです。
この例の場合、ページ構成時に記事単独ページには

<a href="http://noko-noko.blogspot.com/">
クリボウの Blogger Tips
</a>

と書き出され、一方メインページ、アーカイブページには

クリボウの Blogger Tips

とだけ書かれることになります。
言うのが遅くなりましたが <ItemPage> には、「包含しているものを記事単独ページにのみ書き出す」という役割があります。この例だと結局、記事単独ページではリンクつきのブログタイトルを、メインページやアーカイブページではリンクなしのブログタイトルが表示されることになりますね。
ちなみに <ItemPage> の仲間を挙げると

<ArchivePage>　…　アーカイブページにのみ書き出し
<ItemPage>　…　記事単独ページにのみ書き出し
<MainOrArchivePage>　…　メインページ、アーカイブページに書き出し
<MainPage>　…　メインページにのみ書き出し

があります。これらのタグはとても役に立つので、使い道を研究してみてください。

とりとめもなく長くなってきましたがこれらのタグの使い方、ちょっとは感じがつかめたでしょうか？
大事なのは「ページの種類ごとに切り替わって見える」のではなくて「ページの種類ごとに違う HTML が書き出される」ということ。だからテンプレートタグは HTML の規則どおりに書かなくてもいいわけですね。この性質を利用するとこんな使い方もできちゃいます。

<MainPage></MainPage>

コメントアウトさせるかどうか、ページの種類ごとに変えてみたり、

スクリプトの変数の中身をページの種類ごとに変えてみたり、と。
しかし色々思いつくけれど、実際に何に使うの？と聞かれると困ってしまうクリボウなのでした…。

追記

スタイルシートをページの種類ごとにがばっと変えて、ページのデザインを完全に切り替えたら？などと考えてみたれど、スタイルシートの書ける <head> 内には <MainPage> をはじめページ切替タグは使えないとのこと。無理に <body> 内にスタイルシートを入れても、ブラウザで解釈してくれるとは思うのだけれど…。

スポンサードリンク：

お願い：

「この記事役に立った！」と思ったら、ぜひフィード登録をお願いします。　