小粋空間: 2006年1月 6日アーカイブ

Top ＞ January 6, 2006

FC2ブログテンプレート

January 6,2006 11:58 PM
Category：[テンプレート]
Tag：[Blog, FC2, Template]
Permalink

FC2ブログ用のテンプレートを作りました。サンプルのスクリーンショットは3カラムですが、2カラム・1カラムも用意しております。カラムレイアウトの設定方法につきましては本エントリーを参照ください。
またHTMLについては通常カレンダー版と横旗カレンダー版の2種類をご用意致しました。

FC2ブログではサービス内に「共有テンプレート」というコーナーがあり、そちらに数多くのテンプレートが登録されていますが、メンテナンスを考慮してとりあえずこのサイトでのみの公開とさせて頂きたいと思います。
FC2ブログの登録および当サイトの公開テンプレート設定方法については下記の記事を参考にしてください。

１．動作確認環境

動作確認は下記の環境で行っています。

OS：Windows2000/XP
ブラウザ：IE6.0/Firefox1.0.7/Netscape7.1/Netscape8.0.4/Opera8.5
FCブログ：http://koikikukan.blog42.fc2.com/

２．利用規定

ご利用の前にテンプレートのページを必ずご覧くださいますよう、よろしくお願い致します。

３．カラムレイアウト変更方法

このテンプレートではカラムレイアウトのバリエーションとして、

3カラム（カラム幅固定）
3カラムリキッドレイアウト（中央カラム幅可変）
2カラム（右サイドバー：カラム幅固定）
2カラム（左サイドバー：カラム幅固定）
2カラムリキッドレイアウト（右サイドバー：左カラム幅可変）
2カラムリキッドレイアウト（左サイドバー：右カラム幅可変）
1カラム（カラム幅固定）
1カラムリキッドレイアウト（カラム幅可変）

の計8種類を用意しています（それぞれのサンプルはちょっと下にある画像をご覧ください）。

カラムレイアウトは、HTMLテンプレートの body 要素の class 属性を書き換えることで変更することができます（カラム数を変更する場合はHTMLテンプレートの修正が必要ですがこれについては後述します）。例えば、3カラムレイアウトから2カラム・リキッドレイアウト（右サイドバー）に変更したい場合は、HTMLテンプレートの

<body class="layout-three-column">

の赤色部分を

<body class="layout-two-column-liquid-right">

と、青色の内容に変更します。このテクニックは Designing with Web Standards でも紹介されています。

個別エントリー用HTMLありのテンプレートをお使いの場合、ベースHTMLと個別エントリー用HTMLで異なるレイアウトを設定することができます。例えばベースHTMLで3カラム、個別エントリー用HTMLで1カラムという設定も可能です。

以下にそれぞれのレイアウトに対する class 属性値を示します。なおサンプル画像は Movable Type のものを流用しておりますので予めご了承ください。

<body class="layout-three-column">

3カラム

<body class="layout-three-column-liquid">

3カラム・リキッドレイアウト

<body class="layout-two-column-left">

2カラム（左サイドバー）

<body class="layout-two-column-liquid-left">

2カラム・リキッドレイアウト（左サイドバー）

<body class="layout-two-column-right">

2カラム（右サイドバー）

<body class="layout-two-column-liquid-right">

2カラム・リキッドレイアウト（右サイドバー）

<body class="layout-one-column">

1カラム

<body class="layout-one-column-liquid">

1カラム・リキッドレイアウト注：左右のマージンをなくすことも可能です。

公開テンプレートは一番上の3カラムレイアウトで配布しております。

次にカラム数を変更する場合の修正方法です。例えば3カラムから2カラム（左サイドバー）に変更する場合は、右カラムを表示する

<!-- 右カラム開始 -->
<div id="links-right-box">
<div id="links-right">
　　　　　　　　　：
　（ここに書かれているものをコピー）
　　　　　　　　　：
</div><!-- /links-right -->
</div><!-- /links-right-box -->
<!-- 右カラム終了 -->

の間に書かれている必要なメニュー（検索・カテゴリー・バナー等）をコピーし、左カラム

<!-- 左カラム開始 -->
<div id="links-left-box">
<div id="links-left">
　　　　　　　　：
　　　　（ここにペースト）
　　　　　　　　：
</div><!-- /links-left -->
</div><!-- /links-left-box -->
<!-- 左カラム終了 -->

にペーストしてください。そのあと

<!-- 右カラム開始 -->
　　　　　　　：
<!-- 右カラム終了 -->

を丸ごと削除します。1カラムに変更される場合は左右両方のカラムをごっそり削除してください。

４．1カラムレイアウトについて

1カラムレイアウトはポータル的な要素を排除して、個人の日記サイトとして気軽に書けるデザインにしています（言い換えると単にサイドバーをとっぱらっただけです）。個別エントリーとコメント・トラックバックは機能しますので、サイトを初めて訪れる方でも戸惑わずに閲覧することが可能です。

1カラムでご利用になる際は前項での左右カラムの削除および、テンプレート内に設定されている

<!-- for one column
<div id="footer-one"><a href="http://www.koikikukan.com/"><img src="http://blog42.fc2.com/k/koikikukan/file/banner.gif" alt="小粋空間" width="128" height="22" /></a><br />
<%ad> | <%ad2><br />
<p style="margin:10px 0 0 0">Copyright © 200x xxxxx. All Rights Reserved.</p>
</div>
/for one column -->

の赤色部分を削除してください（これでFC2ブログの広告とクレジットバナーがページの一番下に表示されます）。

５．記事の日付表示等について

FC2ブログでは投稿日の日付が記事単位に付与されますが、本テンプレートでは JavaScript を用いてページの前方に同一日付の記事がある場合、日付を重複して表示しないようにしています。また個別ページのトラックバックタイトルも同様の制御を行っています。
また複数記事が存在する場合のページ下のナビゲーションリンクについては、前後のリンクが存在しない場合は非表示にしています。
この機能を無効にする場合はベースHTMLテンプレート下にある

<script type="text/javascript">
<!--
var elements = document.getElementsByTagName('h2');
var work;
var work_old = '';
for (i=0; i<elements.length; i++) {
    work = elements[i].innerHTML;
    if(work == work_old){
        elements[i].style.display = 'none';
    }
    work_old = work;
}
elements = document.getElementsByTagName('h3');
work;
work_old = '';
for (i=0; i<elements.length; i++) {
    work = elements[i].innerHTML;
    if(work == work_old){
        elements[i].style.display = 'none';
    }
    work_old = work;
}
if (document.getElementById('nav_previous') || 
    document.getElementById('nav_next')) {
    document.getElementById('nav_main').style.display = 'inline';
} else {
    document.getElementById('nav_main').style.display = 'none';
}
//-->
</script>

を削除してください。

６．XHTML1.0 Transitional valid

当サイトではWeb標準を推奨しています。テンプレートを設定した状態で W3C Markup Validation Service での XHTML1.0 Transitional valid および、Another HTML-lint gateway で高得点になるようにしています。

７．プラグインについて

プラグインカテゴリー1を左カラム下に、プラグインカテゴリー2を右カラム下に配置しています。

８．その他

基本的な動作は確認したつもりですが、FC2ブログの機能を全て把握できていない状態ですので、不具合等ございましたらご連絡ください。

HTML（通常カレンダー版）

<?xml version="1.0" encoding="euc-jp"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja" id="sixapart-standard">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-jp" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="generator" content="FC2 Blog" />
<meta name="author" content="<%author_name>" />

<link rel="stylesheet" href="<%css_link>" type="text/css" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="<%url>?xml" />
<link rel="index" href="<%url>" />
<link rev="made" href="mailto:user@domain" />

<!--nextpage--><link rel="next" href="<%nextpage_url>" title="次ページ" /><!--/nextpage-->
<!--prevpage--><link rel="prev" href="<%prevpage_url>" title="前ページ" /><!--/prevpage-->

<title><%blog_name></title>

<script type="text/javascript">
function OpenComments (c) {
    window.open(c, 'comments', 'width=480,height=520,scrollbars=yes,status=yes');
}
function OpenTrackback (c) {
    window.open(c, 'trackback', 'width=480,height=520,scrollbars=yes,status=yes');
}
</script>

</head>

<body class="layout-three-column">

<div id="box">

<!-- タイトル -->
<div id="banner">
<h1 id="banner-header"><a href="<%url>" accesskey="1"><%blog_name></a> <span style="font-size:12px; color:#ffffff;">by FC2 BLOG</span></h1>
<div id="banner-description"><%introduction></div>
</div>

<!-- 左カラム開始 -->
<div id="links-left-box">
<div id="links-left">

<!-- カレンダー開始 -->
<div class="side">
<div class="calendar">
<table summary="投稿した日にリンクする月別のカレンダー">
<caption class="calendarhead">
<a href="<%prev_month_link>" title="<%prev_month>月のページへ"><</a> 
<%now_year>年<%now_month>月
 <a href="<%next_month_link>" title="<%next_month>月のページへ">></a>
</caption>
<tr>
<th abbr="Sunday"><span class="calendar"><span class="red">Sun</span></span></th>
<th abbr="Monday"><span class="calendar">Mon</span></th>
<th abbr="Tuesday"><span class="calendar">Tue</span></th>
<th abbr="Wednesday"><span class="calendar">Wed</span></th>
<th abbr="Thursday"><span class="calendar">Thu</span></th>
<th abbr="Friday"><span class="calendar">Fri</span></th>
<th abbr="Saturday"><span class="calendar"><span class="blue">Sat</span></span></th>
</tr>

<!--calender-->
<tr>
<td class="day"><%calender_sun></td>
<td class="day"><%calender_mon></td>
<td class="day"><%calender_tue></td>
<td class="day"><%calender_wed></td>
<td class="day"><%calender_thu></td>
<td class="day"><%calender_fri></td>
<td class="day"><%calender_sat></td>
</tr>
<!--/calender-->

</table>
</div>
</div>
<!-- カレンダー終了 -->

<!-- エントリーリスト開始 -->
<div class="sidetitle">
Recent Entries
</div>

<div class="side">
<ul>
<!--recent-->
<li><a href="<%recent_link>" title="<%recent_title>"><%recent_title></a></li>
<!--/recent-->
</ul>
</div>
<!-- エントリーリスト終了 -->

<!-- 最近のコメント開始 -->
<div class="sidetitle">
Recent Comments
</div>

<div class="side">
<!--rcomment-->
<%rcomment_etitle><br />
└ <a href="<%rcomment_link>#c<%rcomment_no>" title="<%rcomment_body>"><%rcomment_title></a> <%rcomment_name> <%rcomment_month>/<%rcomment_day><br />
<!--/rcomment-->
</div>
<!-- 最近のコメント終了 -->

<!-- 最近のトラックバック開始 -->
<div class="sidetitle">
Recent Trackbacks
</div>

<div class="side">
<!--rtrackback-->
<%rtrackback_etitle><br />
└ <a href="<%rtrackback_link>#p<%rtrackback_no>" title="<%rtrackback_excerpt>"><%rtrackback_title></a> <%rtrackback_blog_name> <%rtrackback_month>/<%rtrackback_day><br />
<!--/rtrackback-->
</div>
<!-- 最近のトラックバック終了 -->

<!--plugin-->
<!--plugin_first-->
<div class="sidetitle">
<%plugin_first_title>
</div>

<div class="side">
<%plugin_first_content>
</div>
<!--/plugin_first-->
<!--/plugin-->

</div><!-- /links-left -->
</div><!-- /links-left-box -->
<!-- 左カラム終了 -->

<!-- 中央カラム開始 -->
<div id="content">
<div class="blog">

<!--topentry-->

<!-- エントリー日付開始 -->
<div class="date"><%topentry_year>年<%topentry_month>月<%topentry_day>日</div>
<!-- エントリー日付終了 -->

<div class="entry">

   <!-- エントリータイトル -->
   <h2 id="a<%topentry_no>" class="entry-header">●<%topentry_title></h2>

   <!-- エントリー -->
   <div class="entry-content">
      <div class="entry-body"><%topentry_body></div>

      <!-- 追記 -->
      <!--more_link-->
      <div class="entry-more">
         <a href="<%topentry_link>#more">続きを読む "<%topentry_title>"</a>
      </div>
      <!--/more_link-->
      <!--more-->
         <%topentry_more>
      <!--/more-->

      <!--community-->
      <p>スレッドテーマ:<a href="<%topentry_thread_link>" title="<%topentry_thread_title>へのリンク"><%topentry_thread_title></a>:<a href="<%topentry_community_janrelink>" title="<%topentry_community_janrename>へのリンク"><%topentry_community_janrename></a></p>
      <!--/community-->

   </div><!-- /entry-content -->

   <!-- 投稿者情報開始 -->
   <div class="entry-footer">
Posted at <%topentry_hour>:<%topentry_minute>
 | Category : <a href="<%topentry_category_link>" title="<%topentry_category>のページへ"><%topentry_category></a>
 | <a class="permalink" href="<%topentry_link>" title="<%topentry_title>の個別ページへ">Permalink</a>
<!--allow_comment-->
 | <a href="<%topentry_link>#comments" title="comments<%topentry_no>">Comments</a> [<%topentry_comment_num>]
<!--/allow_comment-->
<!--allow_tb-->
 | <a href="<%topentry_link>#trackbacks" title="trackbacks<%topentry_no>">Trackbacks</a> [<%topentry_tb_num>]
<!--/allow_tb-->
   </div><!-- /entry-footer -->
   <!-- 投稿者情報終了 -->

   <!--
   <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
            xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
            xmlns:dc="http://purl.org/dc/elements/1.1/">
   <rdf:Description
       rdf:about="<%topentry_link>"
       trackback:ping="<%url>tb.php/<%topentry_tb_no>"
       dc:title="<%topentry_title>"
       dc:identifier="<%topentry_link>"
       dc:subject="<%topentry_category>"
       dc:description="<%topentry_discription>"
       dc:creator="<%author_name>"
       dc:date="<%topentry_year>-<%topentry_month>-<%topentry_day>T<%topentry_hour>:<%topentry_minute>:<%topentry_second>+09:00" />
   </rdf:RDF>
   -->

</div><!-- /entry -->

<!--/topentry-->

<p class="content-nav">
   <!--prevpage--><a href="<%prevpage_url>" title="前のページへ" id="nav_previous" name="nav_previous">≪ </a><!--/prevpage-->
   <a href="<%url>" title="メインへ" id="nav_main" name="nav_main">メイン</a>
   <!--nextpage--><a href="<%nextpage_url>" title="次のページへ" id="nav_next" name="nav_next">≫</a><!--/nextpage-->
</p>

<!-- コメント -->
<!--comment_area-->

<div id="comments" class="comments">
   <div class="comments-content">
      <h3 class="comments-header">コメント</h3>

      <!-- コメントタイトル -->
      <!--comment-->
      <div class="comment" id="c<%comment_no>">

         <!-- コメント本文 -->
         <div class="comment-content">●<%comment_title><br /><%comment_body></div>

         <!-- コメント投稿者情報 -->
         <p class="comment-footer">
            Posted by <a href="<%comment_url>"><%comment_name></a> at <%comment_year>.<%comment_month>.<%comment_day> <%comment_hour>:<%comment_minute> | <a href="<%comment_edit_link>" title="コメント編集のページへ">edit</a>
         </p>
      </div>
      <!--/comment-->

   </div>

   <!-- コメント投稿 -->
   <form method="post" action="./" name="comment_form">
   <input type="hidden" name="mode" value="regist">
   <input type="hidden" name="comment[no]" value="<%pno>">
   
   <!-- コメント投稿フォームタイトル -->
   <div class="comments-open" id="comments-open">
      <h3 class="comments-open-header">コメントする</h3>
      
      <div class="comments-open-content">

         <!-- コメント投稿フォーム開始 -->
         <div id="comments-open-data">
            <dl>
               <dt><label for="comment-author">名前:</label></dt>
               <dd><input id="comment-author" name="comment[name]" tabindex="6" accesskey="n" size="20" value="<%cookie_name>" /></dd>
               <dt><label for="comment-title">タイトル:</label></dt>
               <dd><input id="comment-title" name="comment[title]" tabindex="7" accesskey="t" size="30" value="" /></dd>
               <dt><label for="comment-email">メールアドレス:</label></dt>
               <dd><input id="comment-email" name="comment[mail]" tabindex="8" accesskey="m" size="30" value="<%cookie_mail>" /></dd>
               <dt><label for="comment-url">URL:</label></dt>
               <dd><input id="comment-url" name="comment[url]" tabindex="9" accesskey="u" size="30" value="<%cookie_url>" /></dd>
               <dt></dt><dd><script type="text/javascript" src="http://blog8.fc2.com/load.js"></script></dd>
               <dt><label for="comment">コメント:</label></dt>
               <dd><textarea id="comment" name="comment[body]" tabindex="12" accesskey="c" rows="10" cols="30"></textarea></dd>
               <dt><label for="pass">パスワード:</label></dt>
               <dd><input id="pass" type="password" name="comment[pass]" tabindex="10" size="20"></dd>
               <dt><label for="secret">Secret:</label></dt>
               <dd><input id="secret" type="checkbox" name="comment[himitu]" tabindex="11">サイト管理者にのみ通知する</dd>
            </dl>
         </div>
         <div id="comments-open-footer" class="comments-open-footer">
            <input type="submit" tabindex="13" accesskey="s" name="post" id="comment-post" value="投稿" />
            <input type="reset" tabindex="14" value="クリア" />
         </div>
         <!-- コメント投稿フォーム終了 -->

      </div><!-- /comments-open-content -->
   </div><!-- /comments-open -->
   </form>

</div>
<!--/comment_area-->

<!-- コメント編集 -->
<!--edit_area-->

<div id="comments" class="comments">

   <!-- コメント編集 -->
   <form method="post" action="./" name="comment_form">
   <input type="hidden" name="mode" value="edit">
   <input type="hidden" name="mode2" value="edited">
   <input type="hidden" name="edit[rno]" value="<%eno>">
   
   <!-- コメント投稿フォームタイトル -->
   <div class="comments-open" id="comments-open">
      <h2 class="comments-open-header">コメントの編集</h2>
      
      <div class="comments-open-content">

         <!-- コメント投稿フォーム開始 -->
         <div id="comments-open-data">
            <dl>
               <dt><label for="comment-author">名前:</label></dt>
               <dd><input id="comment-author" name="edit[name]" tabindex="6" accesskey="n" size="20" value="<%edit_name>" /></dd>
               <dt><label for="comment-title">タイトル:</label></dt>
               <dd><input id="comment-title" name="edit[title]" tabindex="7" accesskey="t" size="30" value="<%edit_title>" /></dd>
               <dt><label for="comment-email">メールアドレス:</label></dt>
               <dd><input id="comment-email" name="edit[mail]" tabindex="8" accesskey="m" size="30" value="<%edit_mail>" /></dd>
               <dt><label for="comment-url">URL:</label></dt>
               <dd><input id="comment-url" name="edit[url]" tabindex="9" accesskey="u" size="30" value="<%edit_url>" /></dd>
               <dt></dt><dd><script type="text/javascript" src="http://blog8.fc2.com/load.js"></script></dd>
               <dt><label for="comment">コメント:</label></dt>
               <dd><textarea id="comment" name="edit[body]" tabindex="12" accesskey="c" rows="10" cols="30"><%edit_body></textarea></dd>
               <dt><label for="pass">パスワード:</label></dt>
               <dd><input id="pass" type="password" name="edit[pass]" tabindex="10" size="20"></dd>
               <dt><label for="secret">Secret:</label></dt>
               <dd><input id="secret" type="checkbox" name="edit[himitu]" tabindex="11">サイト管理者にのみ通知する</dd>
            </dl>
         </div>
         <div id="comments-open-footer" class="comments-open-footer">
            <input type="submit" tabindex="13" accesskey="s" id="comment-post" value="変更" />
            <input type="submit" tabindex="13" accesskey="s" name="edit[delete]" id="comment-post" value="削除" />
            <input type="reset" tabindex="14" value="クリア" />
         </div>
         <!-- コメント編集フォーム終了 -->

      </div><!-- /comments-open-content -->
   </div><!-- /comments-open -->
   </form>

</div>
<!--/edit_area-->

<!--trackback_area-->
<div id="trackbacks" class="trackbacks">

   <!-- トラックバックURLタイトル -->
   <h3 id="trackback" class="trackbacks-header">トラックバックURL</h3>

   <!-- トラックバックURL -->
   <div id="trackbacks-info">
      <p><label class="techstuff" for="tb_url">このエントリーのトラックバックURL:</label><br />
         <input name="tb_url" id="tb_url" class="tb_url" value="<%trackback_url>" readonly="readonly" onfocus="this.select()" /></p>
   </div>

   <h3 class="trackbacks-header">トラックバック</h3>

   <!-- トラックバック -->
   <!--trackback-->

   <!-- トラックバックタイトル -->
   <div class="trackbacks-content">

      <!-- トラックバック本文 -->
      <div class="trackback" id="p<%tb_no>">
         <div class="trackback-content">
            <p>
               ≫ <a rel="nofollow" href="<%tb_url>"><%tb_title></a> from <%tb_blog_name><br />
               <%tb_excerpt> <a rel="nofollow" href="<%tb_url>">[Read More]</a>
            </p>
         </div>
         <p class="trackback-footer">
            Tracked on <%tb_year>.<%tb_month>.<%tb_day>
         </p>
      </div>
   </div>
   <!--/trackback-->
</div>
<!--/trackback_area-->

</div><!-- /blog -->

<!-- for one column
<div id="footer-one"><a href="http://www.koikikukan.com/"><img src="http://blog42.fc2.com/k/koikikukan/file/banner.gif" alt="小粋空間" width="128" height="22" /></a><br />
<%ad> | <%ad2><br />
<p style="margin:10px 0 0 0">Copyright c 200x xxxxx. All Rights Reserved.</p>
</div>
/for one column -->

</div><!-- /content -->
<!-- 中央カラム終了 -->

<div id="footer-liquid"><p>Copyright c 200x xxxxx. All Rights Reserved.</p></div>

<!-- 右カラム開始 -->
<div id="links-right-box">
<div id="links-right">

<!-- 検索開始 -->
<div class="sidetitle">
Search this site
</div>
 
<div class="side">
<form  id="blog_search" name="blog_search" method="get" action="./index.php">
<input type="hidden" name="IncludeBlogs" value="" />
<!--<label for="search" accesskey="4">サイト内の検索</label><br />-->
<input id="search_text" type="text" name="q" size="20" value="" tabindex="4"  accesskey="t" /><br />
<input class="btn" type="submit" value="Search" tabindex="5" accesskey="s" />
</form>
</div>
<!-- 検索終了 -->

<!-- カテゴリーリスト開始 -->
<div class="sidetitle">
Categories
</div>

<div class="side">
<ul>
<!--category-->
<li><a href="<%category_link>" title="<%category_name>のページへ"><%category_name> [<%category_count>]</a></li>
<!--/category-->
</ul>
</div>
<!-- カテゴリーリスト終了 -->

<!-- 月別アーカイブリスト開始 -->
<div class="sidetitle">
Monthly Archives
</div>

<div class="side">
<ul>
<!--archive-->
<li><a href="<%archive_link>"><%archive_year>年<%archive_month>月</a> [<%archive_count>]</li>
<!--/archive-->
</ul>
</div>
<!-- 月別アーカイブリスト終了 -->

<!-- リンク開始 -->
<div class="sidetitle">
Links
</div>

<div class="side">
<ul>
<!--link-->
<li><a href="<%link_url>" target="_blank"><%link_name></a></li>
<!--/link-->
</ul>
</div>
<!-- リンク終了 -->

<!-- RSSフィード開始 -->
<div class="sidetitle">
RSS Feeds
</div>

<div class="side">
<ul>
<li><a href="<%url>?xml">Recent Entries</a></li>
<li><a href="<%url>?xml&comment">Recent Comments</a></li>
<li><a href="<%url>?xml&trackback">Recent Trackbacks</a></li>
</ul>
</div>
<!-- RSSフィード終了 -->

<!--plugin-->
<!--plugin_second-->
<div class="sidetitle">
<%plugin_second_title>
</div>

<div class="side">
<%plugin_second_content>
</div>
<!--/plugin_second-->
<!--/plugin-->

<div class="sidetitle">
Appendix
</div>
<div class="side">
<%ad><br />
<%ad2>
</div>

<!-- クレジットバナー -->
<div class="powered">
Powered by <a href="http://blog.fc2.com/">FC2 BLOG</a><br />
<a href="http://www.koikikukan.com/"><img src="http://blog42.fc2.com/k/koikikukan/file/banner.gif" alt="小粋空間" width="128" height="22" /></a>
</div>

</div><!-- /links-right -->
</div><!-- /links-right-box -->
<!-- 右カラム終了 -->

<br class="clear" />

<div id="footer">Copyright c 200x xxxxx by FC2 BLOG All Rights Reserved.</div>

</div><!-- /box -->

<script type="text/javascript">
<!--
var elements = document.getElementsByTagName('div');
var work;
var work_old = '';
for (i=0; i<elements.length; i++) {
    if((elements[i].getAttribute('class') == 'date') ||
       (elements[i].getAttribute('className') == 'date')) {
        work = elements[i].innerHTML;
        if(work == work_old){
            elements[i].style.display = 'none';
        }
        work_old = work;
    }
}
if (document.getElementById('nav_previous') || 
    document.getElementById('nav_next')) {
    document.getElementById('nav_main').style.display = 'inline';
} else {
    document.getElementById('nav_main').style.display = 'none';
}
//-->
</script>

</body>
</html>

HTML（横型カレンダー版）

<?xml version="1.0" encoding="euc-jp"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja" id="sixapart-standard">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-jp" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="generator" content="FC2 Blog" />
<meta name="author" content="<%author_name>" />

<link rel="stylesheet" href="<%css_link>" type="text/css" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="<%url>?xml" />
<link rel="index" href="<%url>" />
<link rev="made" href="mailto:user@domain" />

<!--nextpage--><link rel="next" href="<%nextpage_url>" title="次ページ" /><!--/nextpage-->
<!--prevpage--><link rel="prev" href="<%prevpage_url>" title="前ページ" /><!--/prevpage-->

<title><%blog_name></title>

<script type="text/javascript">
function OpenComments (c) {
    window.open(c, 'comments', 'width=480,height=520,scrollbars=yes,status=yes');
}
function OpenTrackback (c) {
    window.open(c, 'trackback', 'width=480,height=520,scrollbars=yes,status=yes');
}
</script>

</head>

<body class="layout-three-column">

<div id="box">

<!-- タイトル -->
<div id="banner">
<h1 id="banner-header"><a href="<%url>" accesskey="1"><%blog_name></a> <span style="font-size:12px; color:#ffffff;">by FC2 BLOG</span></h1>
<div id="banner-description"><%introduction></div>
</div>

<!-- カレンダー開始 -->
<div id="globalnavi">
<a href="<%prev_month_link>" title="<%prev_month>月のページへ"><</a> 
<%now_year>年<%now_month>月 |
<!--calender2-->
<span class="day2"><%days></span>
<!--/calender2-->
 <a href="<%next_month_link>" title="<%next_month>月のページへ">></a>
</div>
<!-- カレンダー終了 -->

<!-- 左カラム開始 -->
<div id="links-left-box">
<div id="links-left">

<!-- エントリーリスト開始 -->
<div class="sidetitle">
Recent Entries
</div>

<div class="side">
<ul>
<!--recent-->
<li><a href="<%recent_link>" title="<%recent_title>"><%recent_title></a></li>
<!--/recent-->
</ul>
</div>
<!-- エントリーリスト終了 -->

<!-- 最近のコメント開始 -->
<div class="sidetitle">
Recent Comments
</div>

<div class="side">
<!--rcomment-->
<%rcomment_etitle><br />
└ <a href="<%rcomment_link>#c<%rcomment_no>" title="<%rcomment_body>"><%rcomment_title></a> <%rcomment_name> <%rcomment_month>/<%rcomment_day><br />
<!--/rcomment-->
</div>
<!-- 最近のコメント終了 -->

<!-- 最近のトラックバック開始 -->
<div class="sidetitle">
Recent Trackbacks
</div>

<div class="side">
<!--rtrackback-->
<%rtrackback_etitle><br />
└ <a href="<%rtrackback_link>#p<%rtrackback_no>" title="<%rtrackback_excerpt>"><%rtrackback_title></a> <%rtrackback_blog_name> <%rtrackback_month>/<%rtrackback_day><br />
<!--/rtrackback-->
</div>
<!-- 最近のトラックバック終了 -->

<!--plugin-->
<!--plugin_first-->
<div class="sidetitle">
<%plugin_first_title>
</div>

<div class="side">
<%plugin_first_content>
</div>
<!--/plugin_first-->
<!--/plugin-->

</div><!-- /links-left -->
</div><!-- /links-left-box -->
<!-- 左カラム終了 -->

<!-- 中央カラム開始 -->
<div id="content">
<div class="blog">

<!--topentry-->

<!-- エントリー日付開始 -->
<div class="date"><%topentry_year>年<%topentry_month>月<%topentry_day>日</div>
<!-- エントリー日付終了 -->

<div class="entry">

   <!-- エントリータイトル -->
   <h2 id="a<%topentry_no>" class="entry-header">●<%topentry_title></h2>

   <!-- エントリー -->
   <div class="entry-content">
      <div class="entry-body"><%topentry_body></div>

      <!-- 追記 -->
      <!--more_link-->
      <div class="entry-more">
         <a href="<%topentry_link>#more">続きを読む "<%topentry_title>"</a>
      </div>
      <!--/more_link-->
      <!--more-->
         <%topentry_more>
      <!--/more-->

      <!--community-->
      <p>スレッドテーマ:<a href="<%topentry_thread_link>" title="<%topentry_thread_title>へのリンク"><%topentry_thread_title></a>:<a href="<%topentry_community_janrelink>" title="<%topentry_community_janrename>へのリンク"><%topentry_community_janrename></a></p>
      <!--/community-->

   </div><!-- /entry-content -->

   <!-- 投稿者情報開始 -->
   <div class="entry-footer">
Posted at <%topentry_hour>:<%topentry_minute>
 | Category : <a href="<%topentry_category_link>" title="<%topentry_category>のページへ"><%topentry_category></a>
 | <a class="permalink" href="<%topentry_link>" title="<%topentry_title>の個別ページへ">Permalink</a>
<!--allow_comment-->
 | <a href="<%topentry_link>#comments" title="comments<%topentry_no>">Comments</a> [<%topentry_comment_num>]
<!--/allow_comment-->
<!--allow_tb-->
 | <a href="<%topentry_link>#trackbacks" title="trackbacks<%topentry_no>">Trackbacks</a> [<%topentry_tb_num>]
<!--/allow_tb-->
   </div><!-- /entry-footer -->
   <!-- 投稿者情報終了 -->

   <!--
   <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
            xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
            xmlns:dc="http://purl.org/dc/elements/1.1/">
   <rdf:Description
       rdf:about="<%topentry_link>"
       trackback:ping="<%url>tb.php/<%topentry_tb_no>"
       dc:title="<%topentry_title>"
       dc:identifier="<%topentry_link>"
       dc:subject="<%topentry_category>"
       dc:description="<%topentry_discription>"
       dc:creator="<%author_name>"
       dc:date="<%topentry_year>-<%topentry_month>-<%topentry_day>T<%topentry_hour>:<%topentry_minute>:<%topentry_second>+09:00" />
   </rdf:RDF>
   -->

</div><!-- /entry -->

<!--/topentry-->

<p class="content-nav">
   <!--prevpage--><a href="<%prevpage_url>" title="前のページへ" id="nav_previous" name="nav_previous">≪ </a><!--/prevpage-->
   <a href="<%url>" title="メインへ" id="nav_main" name="nav_main">メイン</a>
   <!--nextpage--><a href="<%nextpage_url>" title="次のページへ" id="nav_next" name="nav_next">≫</a><!--/nextpage-->
</p>

<!-- コメント -->
<!--comment_area-->

<div id="comments" class="comments">
   <div class="comments-content">
      <h3 class="comments-header">コメント</h3>

      <!-- コメントタイトル -->
      <!--comment-->
      <div class="comment" id="c<%comment_no>">

         <!-- コメント本文 -->
         <div class="comment-content">●<%comment_title><br /><%comment_body></div>

         <!-- コメント投稿者情報 -->
         <p class="comment-footer">
            Posted by <a href="<%comment_url>"><%comment_name></a> at <%comment_year>.<%comment_month>.<%comment_day> <%comment_hour>:<%comment_minute> | <a href="<%comment_edit_link>" title="コメント編集のページへ">edit</a>
         </p>
      </div>
      <!--/comment-->

   </div>

   <!-- コメント投稿 -->
   <form method="post" action="./" name="comment_form">
   <input type="hidden" name="mode" value="regist">
   <input type="hidden" name="comment[no]" value="<%pno>">
   
   <!-- コメント投稿フォームタイトル -->
   <div class="comments-open" id="comments-open">
      <h3 class="comments-open-header">コメントする</h3>
      
      <div class="comments-open-content">

         <!-- コメント投稿フォーム開始 -->
         <div id="comments-open-data">
            <dl>
               <dt><label for="comment-author">名前:</label></dt>
               <dd><input id="comment-author" name="comment[name]" tabindex="6" accesskey="n" size="20" value="<%cookie_name>" /></dd>
               <dt><label for="comment-title">タイトル:</label></dt>
               <dd><input id="comment-title" name="comment[title]" tabindex="7" accesskey="t" size="30" value="" /></dd>
               <dt><label for="comment-email">メールアドレス:</label></dt>
               <dd><input id="comment-email" name="comment[mail]" tabindex="8" accesskey="m" size="30" value="<%cookie_mail>" /></dd>
               <dt><label for="comment-url">URL:</label></dt>
               <dd><input id="comment-url" name="comment[url]" tabindex="9" accesskey="u" size="30" value="<%cookie_url>" /></dd>
               <dt></dt><dd><script type="text/javascript" src="http://blog8.fc2.com/load.js"></script></dd>
               <dt><label for="comment">コメント:</label></dt>
               <dd><textarea id="comment" name="comment[body]" tabindex="12" accesskey="c" rows="10" cols="30"></textarea></dd>
               <dt><label for="pass">パスワード:</label></dt>
               <dd><input id="pass" type="password" name="comment[pass]" tabindex="10" size="20"></dd>
               <dt><label for="secret">Secret:</label></dt>
               <dd><input id="secret" type="checkbox" name="comment[himitu]" tabindex="11">サイト管理者にのみ通知する</dd>
            </dl>
         </div>
         <div id="comments-open-footer" class="comments-open-footer">
            <input type="submit" tabindex="13" accesskey="s" name="post" id="comment-post" value="投稿" />
            <input type="reset" tabindex="14" value="クリア" />
         </div>
         <!-- コメント投稿フォーム終了 -->

      </div><!-- /comments-open-content -->
   </div><!-- /comments-open -->
   </form>

</div>
<!--/comment_area-->

<!-- コメント編集 -->
<!--edit_area-->

<div id="comments" class="comments">

   <!-- コメント編集 -->
   <form method="post" action="./" name="comment_form">
   <input type="hidden" name="mode" value="edit">
   <input type="hidden" name="mode2" value="edited">
   <input type="hidden" name="edit[rno]" value="<%eno>">
   
   <!-- コメント投稿フォームタイトル -->
   <div class="comments-open" id="comments-open">
      <h2 class="comments-open-header">コメントの編集</h2>
      
      <div class="comments-open-content">

         <!-- コメント投稿フォーム開始 -->
         <div id="comments-open-data">
            <dl>
               <dt><label for="comment-author">名前:</label></dt>
               <dd><input id="comment-author" name="edit[name]" tabindex="6" accesskey="n" size="20" value="<%edit_name>" /></dd>
               <dt><label for="comment-title">タイトル:</label></dt>
               <dd><input id="comment-title" name="edit[title]" tabindex="7" accesskey="t" size="30" value="<%edit_title>" /></dd>
               <dt><label for="comment-email">メールアドレス:</label></dt>
               <dd><input id="comment-email" name="edit[mail]" tabindex="8" accesskey="m" size="30" value="<%edit_mail>" /></dd>
               <dt><label for="comment-url">URL:</label></dt>
               <dd><input id="comment-url" name="edit[url]" tabindex="9" accesskey="u" size="30" value="<%edit_url>" /></dd>
               <dt></dt><dd><script type="text/javascript" src="http://blog8.fc2.com/load.js"></script></dd>
               <dt><label for="comment">コメント:</label></dt>
               <dd><textarea id="comment" name="edit[body]" tabindex="12" accesskey="c" rows="10" cols="30"><%edit_body></textarea></dd>
               <dt><label for="pass">パスワード:</label></dt>
               <dd><input id="pass" type="password" name="edit[pass]" tabindex="10" size="20"></dd>
               <dt><label for="secret">Secret:</label></dt>
               <dd><input id="secret" type="checkbox" name="edit[himitu]" tabindex="11">サイト管理者にのみ通知する</dd>
            </dl>
         </div>
         <div id="comments-open-footer" class="comments-open-footer">
            <input type="submit" tabindex="13" accesskey="s" id="comment-post" value="変更" />
            <input type="submit" tabindex="13" accesskey="s" name="edit[delete]" id="comment-post" value="削除" />
            <input type="reset" tabindex="14" value="クリア" />
         </div>
         <!-- コメント編集フォーム終了 -->

      </div><!-- /comments-open-content -->
   </div><!-- /comments-open -->
   </form>

</div>
<!--/edit_area-->

<!--trackback_area-->
<div id="trackbacks" class="trackbacks">

   <!-- トラックバックURLタイトル -->
   <h3 id="trackback" class="trackbacks-header">トラックバックURL</h3>

   <!-- トラックバックURL -->
   <div id="trackbacks-info">
      <p><label class="techstuff" for="tb_url">このエントリーのトラックバックURL:</label><br />
         <input name="tb_url" id="tb_url" class="tb_url" value="<%trackback_url>" readonly="readonly" onfocus="this.select()" /></p>
   </div>

   <h3 class="trackbacks-header">トラックバック</h3>

   <!-- トラックバック -->
   <!--trackback-->

   <!-- トラックバックタイトル -->
   <div class="trackbacks-content">

      <!-- トラックバック本文 -->
      <div class="trackback" id="p<%tb_no>">
         <div class="trackback-content">
            <p>
               ≫ <a rel="nofollow" href="<%tb_url>"><%tb_title></a> from <%tb_blog_name><br />
               <%tb_excerpt> <a rel="nofollow" href="<%tb_url>">[Read More]</a>
            </p>
         </div>
         <p class="trackback-footer">
            Tracked on <%tb_year>.<%tb_month>.<%tb_day>
         </p>
      </div>
   </div>
   <!--/trackback-->
</div>
<!--/trackback_area-->

</div><!-- /blog -->

<!-- for one column
<div id="footer-one"><a href="http://www.koikikukan.com/"><img src="http://blog42.fc2.com/k/koikikukan/file/banner.gif" alt="小粋空間" width="128" height="22" /></a><br />
<%ad> | <%ad2><br />
<p style="margin:10px 0 0 0">Copyright c 200x xxxxx. All Rights Reserved.</p>
</div>
/for one column -->

</div><!-- /content -->
<!-- 中央カラム終了 -->

<div id="footer-liquid"><p>Copyright c 200x xxxxx. All Rights Reserved.</p></div>

<!-- 右カラム開始 -->
<div id="links-right-box">
<div id="links-right">

<!-- 検索開始 -->
<div class="sidetitle">
Search this site
</div>
 
<div class="side">
<form  id="blog_search" name="blog_search" method="get" action="./index.php">
<input type="hidden" name="IncludeBlogs" value="" />
<!--<label for="search" accesskey="4">サイト内の検索</label><br />-->
<input id="search_text" type="text" name="q" size="20" value="" tabindex="4"  accesskey="t" /><br />
<input class="btn" type="submit" value="Search" tabindex="5" accesskey="s" />
</form>
</div>
<!-- 検索終了 -->

<!-- カテゴリーリスト開始 -->
<div class="sidetitle">
Categories
</div>

<div class="side">
<ul>
<!--category-->
<li><a href="<%category_link>" title="<%category_name>のページへ"><%category_name> [<%category_count>]</a></li>
<!--/category-->
</ul>
</div>
<!-- カテゴリーリスト終了 -->

<!-- 月別アーカイブリスト開始 -->
<div class="sidetitle">
Monthly Archives
</div>

<div class="side">
<ul>
<!--archive-->
<li><a href="<%archive_link>"><%archive_year>年<%archive_month>月</a> [<%archive_count>]</li>
<!--/archive-->
</ul>
</div>
<!-- 月別アーカイブリスト終了 -->

<!-- リンク開始 -->
<div class="sidetitle">
Links
</div>

<div class="side">
<ul>
<!--link-->
<li><a href="<%link_url>" target="_blank"><%link_name></a></li>
<!--/link-->
</ul>
</div>
<!-- リンク終了 -->

<!-- RSSフィード開始 -->
<div class="sidetitle">
RSS Feeds
</div>

<div class="side">
<ul>
<li><a href="<%url>?xml">Recent Entries</a></li>
<li><a href="<%url>?xml&comment">Recent Comments</a></li>
<li><a href="<%url>?xml&trackback">Recent Trackbacks</a></li>
</ul>
</div>
<!-- RSSフィード終了 -->

<!--plugin-->
<!--plugin_second-->
<div class="sidetitle">
<%plugin_second_title>
</div>

<div class="side">
<%plugin_second_content>
</div>
<!--/plugin_second-->
<!--/plugin-->

<div class="sidetitle">
Appendix
</div>
<div class="side">
<%ad><br />
<%ad2>
</div>

<!-- クレジットバナー -->
<div class="powered">
Powered by <a href="http://blog.fc2.com/">FC2 BLOG</a><br />
<a href="http://www.koikikukan.com/"><img src="http://blog42.fc2.com/k/koikikukan/file/banner.gif" alt="小粋空間" width="128" height="22" /></a>
</div>

</div><!-- /links-right -->
</div><!-- /links-right-box -->
<!-- 右カラム終了 -->

<br class="clear" />

<div id="footer">Copyright c 200x xxxxx by FC2 BLOG All Rights Reserved.</div>

</div><!-- /box -->

<script type="text/javascript">
<!--
var elements = document.getElementsByTagName('div');
var work;
var work_old = '';
for (i=0; i<elements.length; i++) {
    if((elements[i].getAttribute('class') == 'date') ||
       (elements[i].getAttribute('className') == 'date')) {
        work = elements[i].innerHTML;
        if(work == work_old){
            elements[i].style.display = 'none';
        }
        work_old = work;
    }
}
if (document.getElementById('nav_previous') || 
    document.getElementById('nav_next')) {
    document.getElementById('nav_main').style.display = 'inline';
} else {
    document.getElementById('nav_main').style.display = 'none';
}
//-->
</script>

</body>
</html>

スタイルシート

@charset "euc-jp";

/*
 * File      : style.css
 * Version   : 1.03
 * Update    :
 * 1.01 2006.02.04 change the 'comment-text' attribute name to 'comment' and add propaties.
 * 1.02 2006.02.26: delete font-weight property from all name selector and add h type selectors
 *                            and brought property for the title together.
 * 1.03 2006.08.13: change h tag level.
 *
 * Copyright (C) 2004-2006 www.koikikukan.com All rights reserved.
 */

/* すべて */
* {
    margin: 0;
    padding: 0;
    font-family: Verdana, Arial, sans-serif;
}

/* 見出し */
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
}

/* リンク */
a,
a:link,
a:visited {
    color: #006699;
    text-decoration: none;
}
a:hover {
    color: #006699;
    text-decoration: underline;
}
a:active {}

/* リンクつき画像 */
a img {
    border: 0;
}

/* 段落 */
p {
    margin-top: 15px;
    margin-bottom: 15px;
}

/* 順序なしリスト */
ul {
}
ul li {
    padding-left: 10px;
    background: url(http://blog42.fc2.com/k/koikikukan/file/lmark.gif) no-repeat 0px 0.4em;
    list-style-type: none;
}

/* 定義リスト */
dl {}
dt {}
dd {
    padding-left: 8px;
}

/* フォーム */
form {
    margin: 0px;
}
input {
    padding: 1px;
    font-size: 12px;
}

/* 引用 */
blockquote {
    width: auto;
    margin: 15px 20px 0 20px;
    padding: 10px;
    border: 1px solid #666666;
    background: #f6f6f6;
    font-size: 10px;
    line-height: 150%;
}
.quotetitle { /* 引用文タイトル */
    font-size: 10px;
    border-bottom: 1px solid #666666;
    padding: 3px;
}

/* タイトルバナー */
#banner {
    padding: 15px;
    border-bottom: 1px solid #666699;
    color: #999999;
    background: #8fabbe;
    background-position: right top;
    background-repeat: no-repeat;
/*    background-image: url(".gif");*/
    text-align: left;
}

#banner a,
#banner a:link,
#banner a:visited {
    color: #ffffff;
    font-size: 32px;
    text-decoration: none;
}
#banner a:hover {}
#banner a:active {}

/* タイトルバナー下の説明 */
#banner-description {
    color: #ffffff;
    font-size: 12px;
}

/* エントリー全体 */
.blog {
    padding: 10px;
    font-size: small;
    color: #36414d;
    background: none;
}

/* エントリー日付 */
.date { 
    margin: 6px 5px 0;
    padding: 2px 0 2px 5px;
    background-position: left; 
    background-repeat: no-repeat;
/*    background-image: url(".gif");*/
    font-size: 11px;
    font-weight: bold;
}

/* エントリー日付・コメントタイトル・トラックバックタイトルの配色 */
.date,
.trackbacks-header,
.comments-header,
.comments-open-header {
    color: #ffffff;
    background: #8fabbe;
}

/* エントリー */
.entry {
    width: auto;
    margin: 0 5px 15px;
    color: #36414d;
    background: #ffffff;
    background-position: right; 
    background-repeat: repeat-y; 
/*    background-image: url(".gif");*/
    font-size: 12px;
    line-height:150%;
    word-break: break-all;
}
.entry a:active {}
.entry img {
    margin-right: 8px;
    margin-bottom: 5px;
}

/* エントリーのテキストエリア可変長指定 */
.entry textarea {
    width: 97%;
}

/* 追記 */
.entry .extended {}

/* エントリータイトル */
.entry-header {
    margin: 15px 0 12px;
    color: #444444;
    font-size: 12px;
    font-weight: bold;
}

/* エントリータイトルのリンク */
.entry-header a:link,
.entry-header a:visited,
.entry-header a:hover {
    color: #444444;
    font-size: 12px;
    font-weight: bold;
}

/* 投稿者 */
.entry-footer {
    margin: 10px 0 0 0;
    border-top: 1px dotted #36414d;
    text-align: right;
    color: #36414d;
    font-size: 9px;
}

/* Typekeyコメンター画像 */
.commenter-profile img {
    vertical-align: middle;
    border-width: 0;
}

/* アーカイブページの前後リンク */
.content-nav {
    margin: 10px;
    text-align: center;
    font-size: 12px;
}

/* カレンダー */
.calendarhead {
    padding-bottom: 5px;
    text-align: center;
    color: #444444;
    font-size: 9px;
    background: none;
    letter-spacing: 0.2em;
}
.calendar {
    text-align: center;
    color: #444444;
    background: none;
}
.calendar table {
    text-align: center;
    padding: 0px;
    border-collapse: collapse;
}
.calendar th {
    padding-bottom: 3px;
    font-size: 8px;
    width: 23px;
}
.calendar td {
    padding: 2px 0;
    font-size: 9px;
    line-height: 120%;
}
.today {
    display: block;
    text-align: center;
    color: #444444;
    border: 1px solid #444444;
}
.red {
    color: #e50003;
}
.blue {
    color: blue;
}
.day2 {
    padding: 0px 2px;
    font-size: 10px;
    text-align: center;
    color: #444444;
}

/* サイドメニュータイトル */
.sidetitle {
    margin-top: 3px;
    padding: 2px 0 1px;
    _padding: 1px 0 2px;
    border: 1px solid  #666666;
    text-align: center;
    color: #444444;
    background: #f6f6f6;
    font-size: 10px;
    line-height: 140%;
}

/* サイドメニュー */
.side {
    margin: 3px 0 20px;
    background: none;
    color: #444444;
    font-size: 10px;
    _font-size: 9px;
    line-height: 150%;
}

/* サイドメニュー(サブカテゴリー用) */
.side #categories ul {
    padding-left: 16px;
}
.side #categories ul ul {
    padding-left: 10px;
}
.side #categories li {
    list-style-type: circle;
}

/* カウンター */
.counter {
    margin: 8px 0 25px;
    padding: 2px;
    background: none;
    font-size: 9px;
}

/* RSSフィード */
.syndicate {
    margin-bottom: 5px;
    text-align: left;
    color: #666666;
    font-size: 9px;
    line-height: 150%;
}

/* クレジットバナー */
.powered {
    margin-top: 50px;
    text-align: left;
    color: #666666;
    font-size: 9px;
    line-height: 150%;
}
.powered img {
    margin-top: 3px;
}

.clear {
    clear: both;
}

/* コメント・トラックバック */
#comments-open-data p {
    margin-bottom: 10px;
}

#comment-post {
    font-weight: normal;
}

#comment-author, #comment-email, #comment-url, #comment-text {
    width: 220px;
}

/* 2006.02.04 id属性名変更(comment-text→comment) */
#comment {
    width: 266px;
}

#comment-bake-cookie {
    margin-left: 2px;
    vertical-align: middle;
}

#comments-open-footer {
    margin-top: 5px;
    text-align: center;
}

.trackbacks,
.comments {
    margin: 10px 5px;
    color: #36414d;
}

.trackbacks-header,
.comments-header,
.comments-open-header {
    margin: 15px 0;
    padding: 2px 0 2px 5px;
    font-size: 11px;
}

#trackbacks-info,
.trackback-content,
.comment-content,
.comments-open-content {
    margin: 0;
    padding: 0;
    font-size: 12px;
    line-height: 150%;
    word-break: break-all;
}

/* 2006.02.04 追加 */
.comment-content img {
    vertical-align: middle;
    padding:0 2px;
}

.trackback-content p,
.comment-content p {
    margin-top: 10px;
    margin-bottom: 5px;
}

.trackback-footer,
.comment-footer {
    font-size: 9px;
    border-top: 1px dotted #36414d;
    text-align: right;
    padding-top: 3px;
    margin-right: 2px;
}

.comments-open label {
    display: block;
}

.comments-head {
    font-size: 11px;
    color: #ffffff;
    background: #8fabbe;
    padding: 2px 0 2px 5px;
    margin: 15px 0;
}

#tb_url {
    width: 250px;
    _width: 270px;
}

#comments-open-data dl {}
#comments-open-data dt {
    float: left;
    width: 80px;
    padding: 5px 5px 5px 0;
    _padding: 5px 0 5px 0;
    text-align: right;
}
#comments-open-data dd {
    padding: 5px 0 5px 8px;
}

/* カラム切り替え */

/* 3カラム用 */
body.layout-three-column,
body.layout-two-column-left,
body.layout-two-column-right,
body.layout-one-column {
    margin-bottom: 20px;
    text-align: center;
    background: #36414d;
}
.layout-three-column #container,
.layout-two-column-left #container,
.layout-two-column-right #container {
    margin-bottom: 10px;
}
.layout-three-column #box {
    width: 850px;
    margin-right: auto;
    margin-left: auto;
    padding: 0 0 15px 0;
    border-bottom: 1px solid #666699;
    border-left: 1px solid #666699;
    border-right: 1px solid #666699;
    text-align: left;
    background-color: #ffffff;
}

/* 2カラム用 */
.layout-two-column-left #box,
.layout-two-column-right #box {
    width: 665px;
    margin-right: auto;
    margin-left: auto;
    padding: 0 0 15px 0;
    border-bottom: 1px solid #666699;
    border-left: 1px solid #666699;
    border-right: 1px solid #666699;
    text-align: left;
    background-color: #ffffff;
}

/* 2カラム用 */
.layout-one-column #container {
    margin-bottom: 0;
}

/* 1カラム用 */
.layout-one-column #box {
    width: 478px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 0;
    padding: 0;
    border-bottom: 1px solid #666699;
    border-left: 1px solid #666699;
    border-right: 1px solid #666699;
    text-align: left;
    background-color: #ffffff;
}

/* 1カラム・リキッドレイアウト用 */
/* タイトルバナー */
.layout-one-column-liquid #banner {
    margin-right: 100px;
    margin-left : 100px;
    border-left: 1px solid #666699;
    border-right: 1px solid #666699;
}
body.layout-one-column-liquid {
    background: #36414d;
}

/* 2/3カラム用フッタ */
.layout-three-column-liquid #footer-liquid,
.layout-two-column-liquid-left #footer-liquid,
.layout-two-column-liquid-right #footer-liquid,
.layout-three-column #footer,
.layout-two-column-left #footer,
.layout-two-column-right #footer {
    text-align: center;
    font-size: 10px;
    color: #444444;
}
.layout-three-column-liquid #footer,
.layout-two-column-liquid-left #footer,
.layout-two-column-liquid-right #footer,
.layout-three-column #footer-liquid,
.layout-two-column-left #footer-liquid,
.layout-two-column-right #footer-liquid {
    display: none;
}

/* 1カラム用フッタ */
.layout-one-column #footer-one {
    margin: 0;
    font-size: 10px;
    text-align: center;
    color: #444444;
    line-height: 150%;
}
.layout-one-column-liquid #footer-one {
    margin: 0 0 15px;
    text-align: center;
    font-size: 10px;
    color: #444444;
    line-height: 150%;
}
.layout-one-column-liquid #footer-liquid,
.layout-one-column-liquid #footer,
.layout-one-column #footer-liquid,
.layout-one-column #footer {
    display: none;
}
.layout-one-column #archive,
.layout-one-column-liquid #archive {
    font-size: 9px;
    text-align: center;
}

/* 3カラム(リキッドレイアウト) */
.layout-three-column-liquid #content {
    margin: 0 185px 10px;
    border-bottom: 1px solid #666699;
    border-left: 1px solid #666699;
    border-right: 1px solid #666699;
}
.layout-three-column-liquid #links-left{
    position: absolute;
    width: 155px;
    top: 95px;
    left: 15px;
    color: #ffffff;
}
.layout-three-column-liquid #links-right{
    position: absolute;
    width: 155px;
    top: 95px;
    right: 15px;
    color: #ffffff;
}

/* 2カラム(リキッドレイアウト：右サイドバー) */
.layout-two-column-liquid-right #content {
    margin: 0 185px 10px 0;
    border-bottom: 1px solid #666699;
    border-right: 1px solid #666699;
}
.layout-two-column-liquid-right #links-right {
    position: absolute;
    width: 155px;
    top: 95px;
    right: 15px;
    color: #ffffff;
}

/* 2カラム(リキッドレイアウト：左サイドバー) */
.layout-two-column-liquid-left #content {
    margin: 0 0 10px 185px;
    border-bottom: 1px solid #666699;
    border-left: 1px solid #666699;
}
.layout-two-column-liquid-left #links-left {
    position: absolute;
    width: 155px;
    top: 95px;
    left: 15px;
    color: #ffffff;
}

/* 1カラム(リキッドレイアウト) */
.layout-one-column-liquid #content {
    margin: 0 100px 10px;
    border-bottom: 1px solid #666699;
    border-left: 1px solid #666699;
    border-right: 1px solid #666699;
    background: #ffffff;
}

/* 3カラム */
.layout-three-column #content {
    float: left;
    width: 478px;
    margin: 0 0 10px 0;
    border-bottom: 1px solid #666699;
    border-left: 1px solid #666699;
    border-right: 1px solid #666699;
}
.layout-three-column #links-left-box,
.layout-three-column #links-right-box {
    float: left;
    width: 185px;
}
.layout-three-column #links-left,
.layout-three-column #links-right {
    padding: 15px 15px 0 15px;
    color: #ffffff;
}

/* 2カラム(右サイドバー) */
.layout-two-column-right #content {
    float: left;
    width: 478px;
    margin: 0 0 10px 0;
    border-bottom: 1px solid #666699;
    border-right: 1px solid #666699;
}
.layout-two-column-right #links-right-box {
    float: left;
    width: 185px;
}
.layout-two-column-right #links-right {
    padding: 15px 15px 0;
    color: #ffffff;
}

/* 2カラム(左サイドバー) */
.layout-two-column-left #content {
    float: left;
    width: 478px;
    margin: 0 0 10px 0;
    border-bottom: 1px solid #666699;
    border-left: 1px solid #666699;
}
.layout-two-column-left #links-left-box {
    float: left;
    width: 185px;
}
.layout-two-column-left #links-left {
    padding: 15px 15px 0;
    color: #ffffff;
}

/* 1カラム */
.layout-one-column #content {}

input,textarea {
    font-family: "Osaka", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", arial, sans-serif;
}

#globalnavi {
    font-size: 10px;
    text-align: center;
    padding: 5px 0;
    border-bottom : 1px solid #666699;
}

2006.02.04
投稿したコメントを編集できるように修正しました。またコメントで絵文字等の挿入ができなかった不具合を修正しました。

2006.02.26
スタイルシートの全称セレクタから font-weight プロパティを削除し、見出し用のタイプセレクタを追加しました。またエントリー日付・コメントタイトル・トラックバックタイトルの配色用セレクタをまとめました。

2006.08.13
テンプレートの見出しレベルを変更しました。

2006.08.26
コメントタイトル・トラックバックタイトルについて、JavaScript なしで複数表示されないように修正しました。

2006.12.08
見出しレベル変更により同じ日付が表示される不具合を修正しました。また見出しレベルを一部修正しました。

Comments [198] | Trackbacks [11]

小粋空間 - a cheap joke and a play on words site