以下の内容はhttp://10plate.blog44.fc2.com/blog-entry-113.htmlより取得しました。


ブログタイトル下に横カレンダーを入れる

ブログタイトルの下に横カレンダーを設置するカスタマイズを紹介します。

HTMLを編集します。
テンプレートにより編集箇所が違います。

【standardの場合】

<!--▼▼▼▼ メインボディ(コンテンツ部分)▼▼▼▼-->
<tr><td id="main_body">

<!--▼ 横カレンダー ▼-->
<div class="line_calendar">
<a href="<%prev_month_link>"><%prev_year> <%prev_month></a>

<!--calender2-->
<span class="line_cal_day"><%days></span>
<!--/calender2-->

<a href="<%next_month_link>"><%next_year> <%next_month></a>
</div>
<!--▲ 横カレンダー ▲-->


<table style="margin: 1em" border="0" cellspacing="0">

<tr>

<!--▼▼▼ 左側ブロック ▼▼▼-->



【lightframeの場合】

<!--▲▲ ヘッダー ▲▲-->

<!--▼ 横カレンダー ▼-->
<div class="line_calendar">
<a href="<%prev_month_link>"><%prev_year> <%prev_month></a>

<!--calender2-->
<span class="line_cal_day"><%days></span>
<!--/calender2-->

<a href="<%next_month_link>"><%next_year> <%next_month></a>
</div>
<!--▲ 横カレンダー ▲-->


<div id="center-left">

<div id="center">

<!--▼▼ プラグイン カテゴリー3 ▼▼-->



次にスタイルシートを編集します。
standard,lightframe共に何処でもいいので下記記述を加えます。

/* 横カレンダー */
.line_calendar {
font-size:10pt; /* 文字の大きさ */
color:#cccccc; /* 文字の色 */
margin-bottom:10px; /* カレンダー下の間隔 */
text-align:center;
}
.line_cal_day {
margin-left:3px; /* 日付の間隔(左) */
margin-right:3px; /* 日付の間隔(右) */
}


文字の色や大きさ、文字間の間隔はお好みに設定してください。

【2009/10/21 追記】記事のある日付の背景に画像を設定したいときは、スタイルシートの末尾に以下を加えてください。

.line_cal_day a {
background-image: url("画像URL");
padding:2px; /* 余白 */
}


横カレンダーの両脇には、前月、翌月へのリンクが表示されます。翌月が未来だった場合リンクを表示させたくない場合は、HTMLに以下の赤い部分を加えてください。

<!--▼ 横カレンダー ▼-->
<div class="line_calendar" id="line_calendar">
<a href="<%prev_month_link>"><%prev_year> <%prev_month></a>

<!--calender2-->
<span class="line_cal_day"><%days></span>
<!--/calender2-->
<!--not_index_area-->

<a href="<%next_month_link>"><%next_year> <%next_month></a>
<!--/not_index_area-->
</div>
<!--▲ 横カレンダー ▲-->


ただしこれには欠点があり、過去月からリンクを辿ると未来の月へのリンクも表示されてしまうのでご了承ください。
関連記事



以上の内容はhttp://10plate.blog44.fc2.com/blog-entry-113.htmlより取得しました。
このページはhttp://font.textar.tv/のウェブフォントを使用してます

不具合報告/要望等はこちらへお願いします。
モバイルやる夫Viewer Ver0.13