FC2ブログのテンプレート工房

HTMLを編集します。

<!--▼コメント投稿▼-->
～
<textarea id="comment" cols="55" rows="8" name="comment[body]"></textarea><br />
～
<!--▲コメント投稿▲-->

<!--▼コメント編集▼-->
～
<textarea id="comment" cols="55" rows="8" name="edit[body]"><%edit_body></textarea><br />
～
<!--▲コメント編集▲-->

cols="55"の数値をお好みのサイズになるように設定してください。

まずプラグインタイトルの背景を画像にする方法を紹介します。
プラグインタイトルの背景に使う画像を用意してください。
初期値のままだとサイズは高さ22px,幅217px程です。

画像をアップロードしたらスタイルシートを編集します。

.plugin1_title {
～
background-image: url(http://～画像URL～);
}

.plugin2_title {
～
background-image: url(http://～画像URL～);
}

これでプラグインタイトル背景が画像になります。


次にプラグイン本文の背景を画像にする方法を紹介します。
本文の場合は高さが可変なので、背景画像を繰り返し表示させずに右下に表示する方法を紹介します。

画像をアップロードしたらスタイルシートを編集します。

.plugin1_body {
～
background-image: url(http://～画像URL～);
background-repeat: no-repeat;
background-position: right bottom;
}

.plugin2_body {
～
background-image: url(http://～画像URL～);
background-repeat: no-repeat;
background-position: right bottom;
}

これでプラグイン本文の右下に画像が表示されます。

HTMLを編集します。

<!--▼▼ カテゴリ、月別、検索結果ナビゲーション ▼▼-->

<!--▼カテゴリー別記事ナビゲーション▼-->
～
<!--▲カテゴリー別記事ナビゲーション▲-->

<!--▼月別記事ナビゲーション▼-->
～
<!--▲月別記事ナビゲーション▲-->

<!--▼検索結果ナビゲーション▼-->
～
<!--▲検索結果ナビゲーション▲-->

<!--▲▲ カテゴリ、月別、検索結果ナビゲーション ▲▲-->

カテゴリページのページ上部に表示される記事一覧を取り外したい場合は
<!--▼カテゴリー別記事ナビゲーション▼-->から
<!--▲カテゴリー別記事ナビゲーション▲-->で囲まれた部分を削除して下さい。

同様に月別、検索結果の一覧表示も取り外すことが出来ます。

スタイルシートを編集します。

/*************************** ▼ 上部メニュー(プラグイン３) ▼ */
.plugin3_outline {
border-top: #e0e0e0 2px solid; /* 個別枠(上) */
border-right: #e0e0e0 2px solid; /* 個別枠(右) */
border-bottom:#e0e0e0 2px solid; /* 個別枠(下) */
border-left: #e0e0e0 2px solid; /* 個別枠(左) */
margin-bottom:20px;
}
.plugin3_title {
font-size:10pt; /* 文字サイズ(タイトル) */
font-weight:bold; /* 太字 (タイトル) */
color:#555555; /* 文字色 (タイトル) */
background-color:#f0f0f0; /* 背景色 (タイトル) */
border: #666666 1px solid; /* 枠 (タイトル) */
padding:5px 20px;
}
.plugin3_body {
font-size:10pt; /* 文字サイズ(本体) */
color:#000000; /* 文字色 (本体) */
background-color:#ffffff; /* 背景色 (本体) */
border-top: #e0e0e0 1px solid; /* 枠(上) (本体) */
border-left: #666666 1px solid; /* 枠(左) (本体) */
border-right: #666666 1px solid; /* 枠(右) (本体) */
border-bottom:#666666 1px solid; /* 枠(下) (本体) */
padding:5px 20px;
line-height: 1.3; /* 行間 (本体) */
}
/*************************** ▲ 上部メニュー(プラグイン３) ▲ */

上記各項目の値を変えるとプラグイン３のみデザインを変えることが出来ます。line-heightは行間を変えたいときに加えてください。

HTMLを編集します。

<!--▼コメント編集▼-->
～
<label for="comment">COMMENT:</label><br />

<script type="text/javascript" src="<%server_url>load.js"></script><br />

<textarea id="comment" cols="55" rows="8" name="edit[body]"><%edit_body></textarea><br />
～
<!--▲コメント編集▲-->

<script type="text/javascript" src="<%server_url>load.js"></script><br />を上記箇所に挿入するとコメント編集時にも絵文字を挿入する機能をつけることが出来ます。

この機能は本来標準装備させるべきものを私が付け忘れてしまったものです。申し訳ありません。


【2009/07/14 追記】
サーバーの負荷分散のため、記事中の
src="http://blog44.fc2.com/load.js"となっていたところを
src="<%server_url>load.js"に書き換えました。

【2009/07/22 追記】
このカスタマイズは 2009年07月22日以降にダウンロードされたテンプレート(lightframe_ver.04)では実装されています。
バージョンはHTMLかCSSの一番下を見ると確認できます。

スタイルシートに何処でもいいので次の記述を加えます。

【standardの場合】

.article a:link {color:#0000ff; text-decoration:none;} /* 通常 */
.article a:active {color:#0000ff; text-decoration:none;} /*実行中*/
.article a:visited {color:#0000ff; text-decoration:none;} /*訪問済*/
.article a:hover {color:#0000ff; text-decoration:underline;} /*マウス*/

※作りの違いからstandardは中央カラムのリンク全てにこの設定が影響してしまいます。

【lightframeの場合】

.ently_text a:link {color:#0000ff; text-decoration:none;} /* 通常 */
.ently_text a:active {color:#0000ff; text-decoration:none;} /*実行中*/
.ently_text a:visited {color:#0000ff; text-decoration:none;} /*訪問済*/
.ently_text a:hover {color:#0000ff; text-decoration:underline;} /*マウス*/

これでstandardは中央カラムのリンクを、lightframeは記事内リンクのみを設定することができます。

HTMLを編集します。

<!--▼ エントリー（記事）▼-->
～
<!--more--><br /><%topentry_more><!--/more-->
～
<!--▲ エントリー（記事）▲-->

上記箇所に <br /> を加えてください。これで追記部分が自動的に改行されます。

【2007/01/09 追記】
standardシリーズを2007/01/09以降にダウンロードされた方(Ver.08以降)は<br />の部分が<hr color=#dddddd size=1 noshade />として標準装備されています。