サイドバーを取り付ける
Edgewall SoftwareのTracページのように Trac のすべてのページにサイドバーを取り付けてみる。
スタイルシート追加
まずは、PROJECT/templete/site_css.cs にて必要なスタイルシートの定義を行うのだが、ここに記述した内容は丸々HTMLソースに乗っかってしまうので、ここでは
@import url(<?cs var:htdocs_location ?>css/sidebar.css)
とだけ記述する。ClearSilver によって var:htdocs_location は PROJECT/conf/trac.ini の trac セクションにある htdocs_location で指定した URL に置換される。
sidebar.cssは、
/* メイン画面全体をコンテナとして使えるようにする */
#main {
position: relative;
width: auto;
_width: 100%;
top: 0;
left: 0;
}
/* サイドバー本体、メイン画面の (0, 0) の少し右に幅 100px で配置 */
div.sidebar {
position: absolute;
top: 0px;
left: 0px;
width: 100px;
margin-left: 1em;
}
/* サイドバーにアイテムを列挙するための UL */
#sidebar ul {
list-style: none;
margin: 0px;
padding: 0px;
}
/* サイドバーのアイテム、背景画像と文字のセンタリング設定 */
#sidebar li {
background: #fff url(/images/plate.gif) top left;
width: 100px;
height: 31px;
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
line-height: 31px;
}
/* 上記アイテムにあった設定に変更 */
#sidebar :link, #sidebar :visited, #sidebar :link:hover, #sidebar :visited:hover
{
color: black;
background: transparent;
border: none;
}
#sidebar :link:hover, #sidebar :visited:hover
{
font-weight: bold;
}
/* Trac のメインコンテンツを右に128px移動 */
#content
{
margin-left: 128px;
}こんなかんじで作った。
サイドバーを埋め込む
trac の PROJECT/template/site_header.cs と site_footer.cs では、ナビゲーションバーやオルテテキストの上下になってしまうので、この2つではうまくサイドバーが収まらないので、footer.cs をカスタマイズする。
PYTHON/share/trac/template からカスタマイズしたいテンプレートファイルである footer.cs を PROJECT/template/ にコピーしてから内容を変更する、といっても先頭に3行足すのみ
<div id="sidebar" class="sidebar"> <?cs include "site_sidebar.cs" ?> </div>
内容からわかると思うが、site_sidebar.cs を PROJECT/template/ に作成する。
<ul> <li><a href="<?cs var:project.url ?>">Home</a></li> <li><a href="<?cs var:project.url ?>docs/">Documents</a></li> <li><a href="<?cs var:project.url ?>files/">Download</a></li> </ul>
とりあえず、これだけ。これでサイドバーがすべての Trac のコンテンツ内に付与された。
ClearSilver の if 文で site_sidebar.cs のチェックをして import を書き出すようにすれば、マスターテンプレートの footer.cs に書き込んじゃってもいいかな?
ClearSilver の使い方をちょっと調べて、可能そうならやってみよう。*1