Serene Bachでは2種類のHTMLテンプレートとひとつのCSSテンプレートを1セットのテンプレートとして利用します。
テンプレートのセットは複数保存することが出来ます。また、テンプレート編集画面のテンプレート名から該当するテンプレートをプレビューすることが出来ます。
テンプレートは以下で構成されます。
個別記事用HTMLテンプレートは個別記事表示モードのときのみに使用されます。このテンプレートは全く設定しなくても構いません。もし個別記事用HTMLテンプレートが設定されていない場合は、個別記事表示でもベースHTMLテンプレートが利用されます。
アーカイブやプロフィール表示に適用するテンプレートを個別に設定することもできます。「テンプレート設定」で利用するテンプレートを設定します。また、各カテゴリー毎にテンプレートを変えることも可能です。カテゴリー毎にテンプレートを変えた場合でも「CSS反映」の設定は引き継がれます。
Serene Bachではあるフォーマットに従ってパッケージされたテンプレートパッケージファイルを読み込むことができます。テンプレートの画像を収めるディレクトリを正しく設置すると、テンプレートインポート機能が有効になります。
静的生成とは記事作成時にhtmlファイルを生成する動作のことです。静的生成によって作成されたhtmlファイルは、CGIスクリプトを通さずに閲覧することが出来ます。
動的生成とはCGIプログラムを通して表示する動作のことです。記事作成時にhtmlファイルを生成しません。
Serene Bachでは環境設定の「保存形式」により、静的生成のレベルを設定することが出来ます。
訪問者がSerene Bachで生成されたコンテンツを閲覧する際、いくつかの表示モードが用意されています。保存形式に応じて、Serene Bachでは静的生成されたファイルに対しての閲覧か、Serene BachのCGIスクリプトを通した動的生成による閲覧かを切り替えます。
保存形式は以下の3つがあります。
| 表示モード | 説明 |
|---|---|
| ページ表示モード | カテゴリーなどを限定せず環境設定で設定された順番で逐次記事を表示するモードです。記事数が環境設定で設定された表示記事数を超えるとページを分けて表示します。トップページもページ表示モードのひとつです。トップページ以外のページ表示は常に動的生成で表示され、トップページは保存形式に依らず常に静的生成されます。 |
| アーカイブ表示モード | カテゴリーや年月など条件を絞って表示するモードです。カテゴリーによるアーカイブ表示では保存形式に依らず動的生成で表示されます。月別によるアーカイブでは保存形式をMonthlyにしている場合を除き、動的生成で表示します。動的生成されたアーカイブ表示では設定によってページに分けて表示することが可能です。 |
| プロフィール表示モード | 記事ではなく、ユーザーのプロフィールを表示します。保存形式に依らず動的生成で表示されます。プロフィール表示モードでは記事は表示されません。 |
| 個別記事表示モード | ひとつの記事を個別に表示するモードです。その記事に寄せられたコメントやトラックバックも表示されます。保存形式をIndividualにしている場合を除き、動的生成で表示されます。 |
| 携帯電話用表示モード | mb.cgiのアクセスもしくは特定のブラウザ(携帯電話用のブラウザ)によるsb.cgiへのアクセスでは、携帯電話専用の表示モードが利用されます。専用のテンプレートを利用する他、ページ当たりの表示サイズを制限し、文字コードをShift_JISに変換して表示します。 |
HTMLテンプレートは基本的にhtmlの要素で構成されています。
内部に独自ブロックと独自タグを記述することで状態に応じて表示を変化させることが出来ます。
独自ブロックと独自タグは以下のように記述します。
例) 独自ブロックと独自タグの記述
<!-- BEGIN block_name --> {tag_name} <!-- END block_name -->
block_name、tag_name にはそれぞれ有効な独自ブロック名、および独自タグ名が入ります。独自ブロック内でもhtmlタグを使用することができます。
例) htmlタグを併用した表記
<div> <!-- BEGIN block_name --> <p>{tag_name}</p> <!-- END block_name --> </div>
独自ブロックは
と<!-- BEGIN block_name -->
に挟まれた領域のことで、<!-- END block_name -->
がブロックの名前になります。ブロックはモードに応じて表示数が変化します。block_name
なお、
と<!-- BEGIN XXXX -->
で囲まれたエリアは、独自ブロック名が有効かどうかにかかわらず全て独自ブロックとして扱われます。<!-- END XXXX -->
独自タグは
と記述されたSerene Bach用の特殊なタグで、tag_nameが独自タグの名前になります。タグは状態に応じて、内容が置き換わります。{tag_name}
独自ブロックの開始タグ
と終了タグ<!-- BEGIN block_name -->
は行に単独で利用する必要があります。従って、以下の記述例は間違いです。<!-- END block_name -->
例) 間違い その1
<div> <!-- BEGIN block_name --><p>{tag_name}</p><!-- END block_name --> </div>
例) 間違い その2
<div><!-- BEGIN block_name --> <p>{tag_name}</p> <!-- END block_name --></div>
例) 間違い その3
<div> <!-- BEGIN block_name --><p> {tag_name} </p><!-- END block_name --> </div>
| 独自ブロック | 説明 |
|---|---|
| オススメ関連ブロック | |
| amazon | オススメ関連の表示に利用します。 |
| リスト関連ブロック | |
| archives | アーカイブリスト表示に利用します。 |
| category | カテゴリーリスト表示に利用します。 |
| latest_entry | 最新記事リスト表示に利用します。 |
| link | リンクリスト表示に利用します。 |
| recent_comment | 最新コメントリスト表示に利用します。 |
| recent_trackback | 最新トラックバックリスト表示に利用します。 |
| selected_entry | 選択記事リスト表示に利用します。 |
| profile | ユーザーリスト表示に利用します。 |
| タイトル関連ブロック | |
| title | タイトル表示に利用します。 |
| カレンダー関連ブロック | |
| calendar | カレンダー表示に利用します。 |
| カテゴリー関連ブロック | |
| category_area | カテゴリーのトップページで表示されるブロックです。 |
| 記事関連ブロック | |
| entry | 記事表示に利用します。ページ表示ならびにアーカイブ表示モードでは該当記事数分繰り返されます。 |
| コメント関連ブロック | |
| comment | 記事に寄せられたコメント表示に利用します。寄せられたコメントの数だけ繰り返して表示されます。 |
| comment_area | 個別記事表示モードのときに表示されます。コメントフォームなどが含まれます。 |
| ページナビゲーション関連ブロック | |
| page | ページ表示モードのページナビゲーション表示に利用します。 |
| プロフィール関連ブロック | |
| profile_area | プロフィール表示モードのプロフィール表示に利用します。 |
| トラックバック関連ブロック | |
| trackback | 記事に寄せられたトラックバック表示に利用します。受信したトラックバックの数だけ繰り返して表示されます。 |
| trackback_area | 個別記事表示モードのときに表示されます。トラックバック先アドレスなどが含まれます。 |
| その他 | |
| option | 個別記事表示モードのときにのみ表示されるブロックです。 |
| sequel | 個別記事表示モードのときにのみ表示されるブロックです。entryブロック内で利用します。 |
| 独自タグ | 説明 |
|---|---|
| amazonブロック | |
| {amazon_item} | オススメの紹介文を表示します。画像・名称・コメントが利用されます。 |
| {amazon_ProductName} | オススメの商品名を表示します。 |
| {amazon_Catalog} | オススメの商品分類を表示します。 |
| {amazon_Creator} | オススメの著者を表示します。 |
| {amazon_ReleaseDate} | オススメの発売日を表示します。 |
| {amazon_Manufacturer} | オススメの販売元を表示します。 |
| {amazon_ImageUrlSmall} | オススメの画像(小)を表示します。 |
| {amazon_ImageUrlMedium} | オススメの画像(中)を表示します。 |
| {amazon_ImageUrlLarge} | オススメの画像(大)を表示します。 |
| {amazon_Availability} | オススメの情報を表示します。 |
| {amazon_ListPrice} | オススメの定価を表示します。 |
| {amazon_OurPrice} | オススメの発売価格を表示します。 |
| {amazon_comment} | オススメに対するコメントを表示します。 |
| {amazon_url} | オススメページへのリンクを表示します。 |
| {amazon_htmlcomment} | オススメに対するコメントをhtmlとして表示します。 |
| archivesブロック | |
| {archives_list} | 月別アーカイブリストを表示します。 |
| categoryブロック | |
| {category_list} | カテゴリーリストを表示します。 |
| {subcategory_list} | サブカテゴリーリストを表示します。 |
| latest_entryブロック | |
| {latest_entry_list} | 最新記事のリストを表示します。 |
| linkブロック | |
| {link_list} | リンクリストを表示します。 |
| recent_commentブロック | |
| {recent_comment_list} | 最近受け付けたコメントのリストを表示します。 |
| recent_trackbackブロック | |
| {recent_trackback_list} | 最近受信したトラックバックのリストを表示します。 |
| selected_entryブロック | |
| {selected_entry_list} | 現在表示しているページの記事リストを表示します。 |
| profileブロック | |
| {user_list} | 登録されているユーザーのリストを表示します。 |
| titleブロック | |
| {blog_description} | 環境設定で設定されたウェブログの説明を表示します。 |
| {blog_name} | 環境設定で設定されたウェブログの名称を表示します。 |
| {blog_name_only} | 環境設定で設定されたウェブログの名称を表示します(リンクなし)。 |
| calendarブロック | |
| {calendar} | テーブル型のカレンダーを表示します。 |
| {calendar2} | テーブル型のカレンダーを月表示と曜日と共に表示します。 |
| {calendar_horizontal} | 横型のカレンダーを表示します。 |
| {calendar_vertical} | 縦型のカレンダーを表示します。 |
| entryブロック | |
| {category_name} | 記事カテゴリーを表示します。 |
| {entry_date} | 記事の日付を表示します。 |
| {entry_description} | 記事の内容を表示します。 |
| {entry_permalink} | 記事の個別リンクアドレスを表示します。 |
| {entry_sequel} | 記事の続きを表示します。 |
| {entry_time} | 記事の登録時刻を表示します。 |
| {entry_title} | 記事のタイトルを表示します。 |
| {permalink} | 記事の個別リンクアドレスを表示します。 |
| {trackback_auto_discovery} | トラックバック自動検出に利用されます。 |
| {user_name} | 記事の著者を表示します。 |
| {comment_num} | 記事に寄せられたコメント数を表示します。 |
| {trackback_num} | 記事に寄せられたトラックバック数を表示します。 |
| {comment_count} | 記事に寄せられたコメント数を表示します(リンクなし)。 |
| {trackback_count} | 記事に寄せられたトラックバック数を表示します(リンクなし)。 |
| {user_id} | 記事の著者idを表示します。 |
| {category_id} | 記事カテゴリーidを表示します。 |
| {entry_disp_time} | 記事の登録時刻を表示します(リンクなし)。 |
| {entry_excerpt} | 記事の概要を表示します。 |
| {entry_keyword} | 記事のキーワードを表示します。 |
| {category_disp_name} | 記事カテゴリーを表示します(リンクなし)。 |
| {related_category} | 関連カテゴリーを表示します。 |
| {related_category_disp} | 関連カテゴリーを表示します(リンクなし)。 |
| sequelブロック | |
| {next_entry} | ひとつ後の記事へのリンクを表示します。 |
| {next_permalink} | ひとつ後の記事の固定リンクアドレスを表示します。 |
| {next_title} | ひとつ後の記事のタイトルを表示します。 |
| {prev_entry} | ひとつ前の記事へのリンクを表示します。 |
| {prev_permalink} | ひとつ前の記事の固定リンクアドレスを表示します。 |
| {prev_title} | ひとつ前の記事のタイトルを表示します。 |
| pageブロック | |
| {next_page_link} | 次ページへのリンクを表示します。 |
| {next_page_url} | 次ページを表示するためのアドレスを表示します。 |
| {page_now} | 現在表示しているページ番号を表示します。 |
| {page_num} | 総ページ数を表示します。 |
| {prev_page_link} | 前ページへのリンクを表示します。 |
| {prev_page_url} | 前ページを表示するためのアドレスを表示します。 |
| profile_areaブロック | |
| {profile_description} | プロフィール内容を表示します。 |
| {profile_name} | ユーザーのフルネームを表示します。 |
| category_areaブロック | |
| {category_description} | カテゴリーの説明を表示します。 |
| {category_pagename} | カテゴリー名を表示します。 |
| {category_fullname} | カテゴリーのフルネームを表示します。 |
| comment_areaブロック | |
| {comment_iconform} | コメントアイコンを投稿するためのフォームを表示します。 |
| {entry_id} | 記事番号を表示します。 |
| commentブロック | |
| {comment_description} | コメントの内容を表示します。 |
| {comment_name} | コメント投稿者の名前を表示します。 |
| {comment_time} | コメントが寄せられた時刻を表示します。 |
| {comment_icon} | 選択されたコメントアイコンを表示します。 |
| trackback_areaブロック | |
| {trackback_url} | トラックバックを送信先となるアドレスを表示します。 |
| trackbackブロック | |
| {trackback_blog_name} | トラックバック送信元のウェブログ名称を表示します。 |
| {trackback_excerpt} | トラックバック送信元の記事概要を表示します。 |
| {trackback_time} | トラックバックを受信した時刻を表示します。 |
| {trackback_title} | トラックバック送信元の記事タイトルを表示します。 |
| その他(ブロック非依存) | |
| {site_atom} | ウェブログのAtom Feedが置かれているアドレスを表示します。 |
| {site_css} | スタイルシートのアドレスを表示します。 |
| {site_encoding} | ウェブページの文字コードを表示します。 |
| {site_lang} | ウェブページの利用言語を表示します。 |
| {site_rss} | ウェブログのRSSが置かれているアドレスを表示します。 |
| {site_title} | ウェブページのタイトルを表示します。 |
| {site_cgi} | コメント投稿・検索に利用されるスクリプトのアドレスを表示します。 |
| {site_top} | ウェブログのトップページアドレスを表示します。 |
| {selected_archive} | 選択されているアーカイブ種類(カテゴリーの場合、カテゴリー名)を表示します。 |
| {script_version} | Serene Bachのバージョンを表示します。 |
| {script_name} | 「Serene Bach」という名称に置き換わります。 |
| {script_webpage} | Serene Bachの公式ウェブページアドレスを表示します。 |
| {site_mobile} | 携帯電話用のアクセスURLを表示します。 |
| {site_parts} | テンプレート用の画像が置かれるディレクトリアドレスを表示します。 |
| {site_rsd} | ウェブログのRSDのアドレスを表示します。 |
| {mode_name} | ページモードを表示します。 |
| {mode_id} | ページモードにおけるidを表示します。 |
ナビゲーション関連のタグ(pageブロック・sequelブロック)における「前」「後(次)」の時系列関係は環境設定の記事の並び順に依存します。
CSSテンプレートにはカスケードスタイルシートを記述します。
Serene BachではCSSテンプレートにも独自タグを利用することができます。
| 独自タグ | 説明 |
|---|---|
| {site_parts} | テンプレート用の画像が置かれるディレクトリアドレスを表示します。 |
| {site_encoding} | ウェブページの文字コードを表示します。 |
Serene Bachでは携帯電話用のテンプレートも管理画面より設定できます。
携帯電話用のテンプレートでは上述した独自ブロック・独自タグとは若干構成が異なります。
| 独自ブロック | 説明 |
|---|---|
| show_xml_declaration | XML宣言を表示するブロックです。DoCoMo端末では非表示になります。 |
| mobile_top | ページ表示(トップページ含む)用のブロックです。 |
| mobile_entry | 個別記事表示用のブロックです。 |
| mobile_comment_area | コメント表示用のブロックです。 |
| mobile_trackback_area | トラックバック表示用のブロックです。 |
| mobile_form | コメントフォーム表示用のブロックです。 |
commentブロック, trackbackブロックに関しては共通してご利用いただけます。
| 独自タグ | 説明 |
|---|---|
| {entry_link} | ページ分けされた記事用のリンク表示です。 |
| {comment_link} | ページ分けされたコメント用のリンク表示です。 |
| {trackback_link} | ページ分けされたトラックバック用のリンク表示です。 |
| 項目 | 説明 |
|---|---|
| アーカイブ | アーカイブ表示で利用するテンプレートを設定します。選択されたテンプレートのベースHTMLテンプレートが利用されます。 |
| プロフィール | プロフィール表示で利用するテンプレートを設定します。選択されたテンプレートのベースHTMLテンプレートが利用されます。 |
| 携帯用 | 携帯電話用表示で利用するテンプレートを設定します。選択されたテンプレートのベースHTMLテンプレートが利用されます。 |
| CSS反映 | 上記で標準テンプレート以外を利用した場合にCSSテンプレートもそのテンプレートセットのものを利用するかどうかを設定します。 |
Serene Bachではリストや記事で表示される時刻表記を細かく設定できます。
「標準セット」としていくつかの表記がプリセットされています。
| 表記 | 説明 | 表示例 |
|---|---|---|
| %Year% | 4桁の西暦を表示します。 | 2005 |
| %YearShort% | 西暦の下2桁を表示します。 | 05 |
| %Mon% | 月を2桁表示します。1桁の月は先頭に「0」が付きます。 | 03 |
| %MonShort% | 月を省略表示します。この表示は仕様言語に依存します。表示例は英語を選択した場合です。 | Mar. |
| %MonLong% | 月を表示します。この表示は仕様言語に依存します。表示例は英語を選択した場合です。 | March |
| %MonNum% | 月を数値で表示します。 | 3 |
| %Day% | 日を2桁表示します。1桁の日は先頭に「0」が付きます。 | 03 |
| %DayOrd% | 日を序数詞で表示します。 | 3rd |
| %DayShort% | 日を表示します。 | 3 |
| %Week% | 曜日を短縮表示します。この表示は仕様言語に依存します。表示例は英語を選択した場合です。 | Thu |
| %WeekLong% | 曜日を表示します。この表示は仕様言語に依存します。表示例は英語を選択した場合です。 | Thursday |
| %Hour% | 時間を2桁表示します(24時間制)。1桁の時間は先頭に「0」が付きます。 | 00 |
| %Hour24% | 時間を表示します(24時間制)。 | 0 |
| %Hour11% | 時間を2桁表示します(12時間制で0〜11時)。1桁の時間は先頭に「0」が付きます。 | 00 |
| %Hour12% | 時間を2桁表示します(12時間制で1〜12時)。1桁の時間は先頭に「0」が付きます。 | 12 |
| %HourAP% | 午前/午後を「AM」ないし「PM」で表示します。 | AM |
| %Min% | 分を2桁表示します。1桁の分は先頭に「0」が付きます。 | 00 |
| %Sec% | 秒を2桁表示します。1桁の秒は先頭に「0」が付きます。 | 00 |
| %Zone% | タイムゾーンを表示します。 | +0900 |
Serene Bachでは基本的にJUGEMのテンプレートと互換性がありますが、独自解析した結果に基づいてルーチンを作成しているため、一部で動作が異なります。
また、仕様の違いによりJUGEMでしかサポートされない独自タグ・Serene Bachでしかサポートされない独自タグが存在します。
JUGEMでのみサポートされている独自タグには以下のものがあります。
Serene Bachでのみサポートされている独自タグには以下のものがあります。
Serene BachではJUGEMのデフォルトテンプレートをそのまま転用することは推奨しませんが、JUGEMで利用しているテンプレートをSerene Bachに移植する際には以下の点にご注意下さい。
JUGEMでは
と指定されています。./?mode=comment
JUGEMでは特に指定されていません。
./Serene Bachの標準テンプレートSummer Breeze並びにSummer Breezeに利用されている全ての画像の著作権はstick limitedに帰属します。
Summer Breezeは個人で修正・改変してご利用いただけますが、修正・改変如何に関わらず再配布・販売にはstick limitedへの事前承認が必要です。
Summer Breezeには
ならびにpowered by Serene Bach
という記述があります。Copyright © 2005 stick limited. All Rights Reserved.
これらの著作表示はできるだけ残すよう、お願いします。