本文の構造

記事本文の構造を示します。

記事記述用として必要なクラスは次で示します

非公開メッセージ
<div class="section">
  <h3><a href="~" name="~"><span class="sanchor">■</span></a>見出し</h3>
  ~本文~
  <h4><a href="~" name="~"><span class="sanchor"></span>小見出し</a></h4>
  ~本文~
  <h5><a href="~" name="~">小々見出し</a></h5>
  ~本文~
</div>
<div class="footnote">
  ~注釈~
</div>
<div class="section">
  <h3><a href="~" name="~"><span class="sanchor">■</span></a>見出し2</h3>
  ~本文~
</div>

非公開メッセージ

非公開記事の場合、div.section の手前に次のHTMLが出力されます*1

<strong class="warning">【この記事は非公開です】</strong><br>

*1 : もちろんログインして編集権限がないと見ることはできません

div.section

記事本文はいくつかの「div.section」からなります。div.section の外に記事本文が出力されることは現状ありませんが、できれば div.section がなくてもまともに表示できるようにしてください。

div.footer

	<p class="footnote"><a href="~" name="fn2">*2</a> : 注釈1</p>
	<p class="footnote"><a href="~" name="fn3">*3</a> : 注釈1.1</p>

注釈が出力されます。注釈は各セクションごとに(div.sectionの直後に)出力されます。

見出し要素

<h3><a href="~" name="~"><span class="sanchor">■</span></a>見出し</h3>
<h4><a href="~" name="~"><span class="sanchor"></span>小見出し</a></h4>
<h5><a href="~" name="~">小々見出し</a></h5>
<h3><a href="~" name="~"><span class="sanchor">■</span></a>見出し</h3>

見出し要素は標準では"h3"のみアンカーマーク(span.sanchor)が付きます。アンカーが空の場合は、見出し全体がリンクになります*2。h4にアンカーマークが付くこともあります。(h5にアンカーマークが付くことがありません)

konomiテーマのようにクラス指定を使ってアンカーを画像に変えることもできます。

div.body h3 span.sanchor {
	font-size: 0pt;
	padding: 16px 23px 0 0;
	line-height: 0;
	background-image:    url("petal-large.gif");
	background-position: bottom right;
	background-repeat:   no-repeat;
	width: 0; height; 0:
	_padding: 0;
	_width: 23px; _height: 16px; /* for IE */
	color: #fef;
}

時刻付き見出し

見出しおよび小見出しにはその項目が書かれた時刻(または日付)が付くこともあります。

<h3>
	<a href="~#1152588924" name="1152588924"><span class="sanchor">■</span></a>
	時刻付き見出しです <span class="timestamp">2006/07/11</span>
</h3>

*2 : アンカーを含めて見出し全体をリンクにする方法もありますが、<a>タグの閉じ位置が変わるだけなので気にしなくてよいです