FasionHasion // 北欧インテリア

1カラムのミニマルデザインテンプレート。カラムのサイズは簡単に変更できます。
プレビュー | Valid CSS

brpについてのお問い合わせはこの記事のコメント、又はメールにてお願いします。

【取扱説明書】
・公式プラグイン「カテゴリ」は、(カスタマイズ向け)を使用してください。
・カラム幅の調節
　「スタイルシート編集」より、①の数値を調節

・プラグイン3を追加し、メニューを3カラムにする場合
　1. 「HTML編集」より、<!– plug_second_end –> を以下のコードに置換えます。

<div class="plug_col">
<!-- plugin -->
<!--plugin_third-->
<div class="plug-title"><%plugin_third_title></div>
<%plugin_third_description>
<%plugin_third_content>
<%plugin_third_description2>
<!--/plugin_third-->
<!-- /plugin -->
</div>

　2. 「スタイルシート編集」より、①の数値を760pxに変更します。

【更新履歴】
2月17日 公開 (CSS ver1.0)

はじめに
このカスタマイズは、FC2ブログの数字で表記される日付(月)を
jQueryを用いて英語表記に変換するカスタマイズです。

以下はFC2ブログにおいての手順ですが、手順3の <%topentry_month> を各ブログの独自タグに変更することによりFC2以外のブログでも実現出来ると思われます。

【カスタマイズ手順】

1. jQueryをダウンロードし、拡張子をjsにした後「ファイルアップロード」よりアップロード

2. 「htmlの編集」より </head>の直前に以下のコードを挿入

<script type="text/javascript" src="アップロードしたjquery.jsのURL"></script>
<script type="text/javascript">
$(document).ready(function(){
$("span.m01").replaceWith("<span>January</span>")
$("span.m02").replaceWith("<span>February</span>")
$("span.m03").replaceWith("<span>March</span>")
$("span.m04").replaceWith("<span>April</span>")
$("span.m05").replaceWith("<span>May</span>")
$("span.m06").replaceWith("<span>June</span>")
$("span.m07").replaceWith("<span>July</span>")
$("span.m08").replaceWith("<span>August</span>")
$("span.m09").replaceWith("<span>September</span>")
$("span.m10").replaceWith("<span>October</span>")
$("span.m11").replaceWith("<span>November</span>")
$("span.m12").replaceWith("<span>December</span>");
});
</script>

3. 英語表記にしたい箇所の <%topentry_month> を以下に置換

<span class="m<%topentry_month>"><%topentry_month></span>

以上です。

jQueryを使った場合ソースがすっきりするのですが、ブログの内容によっては英語表記に変換されるまでに若干のタイムラグがあります。（月の部分に注目してリロードしてみると分かると思います）

逆に、以前の方法ではソースはごちゃごちゃするのですがサクっと瞬時に表示されます。
お好きな方をお選び下さい

一番良いのは英語表記用の変数が追加されることなんですけどねf(”

茶色ベースのシックなデザイン。
記事、メニュー幅のサイズは簡単に変更できます。
プレビュー | Valid CSS

planeについてのお問い合わせはこの記事のコメント、又はメールにてお願いします。

【取扱説明書】
・公式プラグイン「カテゴリ」は、(カスタマイズ向け)を使用してください。
･構成 プラグイン1(150px)、プラグイン2(140px)、エントリー(520px)

・記事幅、プラグイン2幅の変更の仕方
　「テンプレートの設定」→「スタイルシート編集」より
　記事幅: ①の数値を変更
　プラグイン2幅: ①②③をそれぞれ同じ数値変更

・2カラム(プラグイン1・エントリー)として使う場合は以下の手順で修正して下さい
　1. HTMLより、<div id="menu_right"> から </div> までの全12行を削除

　2. CSSより、
　　#menu_left {float: left;width: 150px;}
　　#menu_right {padding-left: 160px;}
　の2つを削除

　3. 上記の、プラグイン2幅の変更の仕方でメニュー幅を調整
　　（この場合③の数値がそのままメニュー幅のサイズになります）

【更新履歴】
11月19日 公開 (CSS ver1.00)

目指したのは、シンプルで長く付き合えるデザインです。記事、メニュー幅のサイズは簡単に変更できます。
プレビュー | Valid CSS

記念すべき10作目ということでフォーマルなシンプルデザインに仕上げました。

はじめましての方！数あるテンプレの中から「note」を気に入って頂きありがとうございます。
こんにちはの方！10作目まで公開することが出来たのは、Designed by FasionHasion を気に入って使って頂いてる皆様がいるおかげです。心より感謝申し上げます

「note」について気軽にコメント、又はメール下さい。 ご意見ご感想もお待ちしております

【取扱説明書】
・公式プラグイン「カテゴリ」は、(カスタマイズ向け)を使用してください。
・2カラム、右メニュー（プラグイン1対応）
・デフォルトサイズ
840px – 全体
610px – 記事幅（左右30pxマージン: 実サイズ550px）
200px – メニュー幅

・記事幅、メニュー幅の変更の仕方
「テンプレートの設定」→「スタイルシート編集」より

＜記事幅＞ ①と③の数値を変更
＜メニュー幅＞ ②と③の数値を変更
※必ず ① + ② + 30px = ③ になるようにして下さい。

【更新履歴】
2011年2月6日 ver1.05 （HTML、CSS修正）
・「コメントを受け付けない」設定時にトラックバックエリアも消える問題を修正

2010年9月15日 ver1.04 （CSSのみ修正）
・記事内でリストを使用した時にリストアイコンが表示されない問題を修正

11月24日 ver1.03 （CSSのみ修正）
・メニューエリアのリンク装飾の修正

9月30日 ver1.02
・メニュー幅のサイズ変更に関する不具合を修正

9月28日 ver1.01
・ヘッダーに<%introduction>を挿入
・記事幅変更した場合に、コメントformのtextarea: widthも自動でサイズ変更されるように修正

9月27日 公開 (CSS ver1.00)

記事が読みやすく、画像が映えるデザイン。記事幅の変更は、1箇所数値を変えるだけです。ブログのスタイルに合わせて変更してください。
プレビュー | Valid CSS

前回の「Cheep」と、どこか似ているテンプレ。
夏が終わり秋へと向かう。 そんな雰囲気
涼しくなってきましたね１

「kamie」について気軽にコメント、又はメール下さい。 お待ちしております

【取扱説明書】
・公式プラグイン「カテゴリ」は、(カスタマイズ向け)を使用してください。
・2カラム左メニュー （プラグイン1対応）
・デフォルトサイズ
メニュー幅 200px 記事幅 510px 全体 800px

・記事幅の変更の仕方
「テンプレートの設定」→「スタイルシート編集」より 先頭にある

#containerbase {width: 800px;}

の値を変更してください。
実際の記事幅のサイズは、この値より290px引いたサイズになります。

・メニュー幅の変更の仕方
「テンプレートの設定」→「スタイルシート編集」より 先頭にある

#left {width: 200px;padding-left: 60px;}

の値を、2つの数値の合計が260になるように変更してください。

【更新履歴】
2011年2月6日 絵文字に関する修正 （css ver1.02）
2009年8月25日 公開 (1.01)

FasionHasion管理人のtacです。

3月からネットのない環境で生活しており、あれやこれやで5ヶ月。
本日やっと繋ぐ事ができました。

当ブログの更新を楽しみにしてくださっていた方、テンプレ関連で来てくださった方、
何も言わず突然音信不通になってしまい申し訳ございませんでした。

本日より更新を再開したいと思いますので、また時間が空いた時などにチラッと見に来て頂けると嬉しいです

細々と静かに綴っていきたい方へのテンプレート
プレビュー | Vaild CSS

3日前に登録した「Cielo」の派生テンプレート。
使い勝手はいいとは言えませんが、「好きな人は好きなサイズ」に仕上げました。
かわいがってください

「Cheep」について何かありましたらこの記事のコメント、又はメールでお願いします。

【取扱説明書】
・2カラム右メニュー （プラグイン1対応）
・デフォルトサイズ (メイン幅 250px、メニュー幅 160px)
・メニュー幅の変更の仕方

「テンプレートの設定」→「スタイルシート編集」より 先頭にある

#containerbase {width: 450px;}

の値を変更してください。
実際のメニュー幅のサイズは、この値より290px引いたサイズになります。

【更新履歴】
3月23日 更新
3月17日 公開

白と灰色を基調とした、シンプルな2カラムレイアウトデザイン。
メニュー幅の調整は、1箇所数値を変えるだけ。お気に入りのブログパーツに合わせて変更してください。
プレビュー | Vaild CSS

約1年ぶりの新作テンプレートです。
構成はいつもどーりシンプル。よかったら使ってみてください１
「Cielo」について何かありましたらこの記事のコメント、又はメールでお願いします。

【取扱説明書】
・2カラム右メニュー （プラグイン1対応）
・デフォルトサイズ (メイン幅 490px、メニュー幅 180px)
・メイン幅の変更は出来ません
・メニュー幅の変更の仕方

「テンプレートの設定」→「スタイルシート編集」より 先頭にある

#containerbase {width: 750px;}

の値を変更してください。
実際のメニュー幅のサイズは、この値より570px引いたサイズになります。

【更新履歴】
3月26日 IEでコメントのレイアウトが崩れるのを修正
3月17日 公開

共有テンプレート「rin」を気に入ってくださった方へ

公開したての時期は予期せぬ不具合が見つかったりする場合があり
更新が行われる可能性があるので落ち着くまでは頻繁にチェックしてもらえると嬉しいです。
「ここどうなってんだい！」って箇所がありましたら報告お願いします

うちのテンプレで一番人気

2008
10.7
･IEでレイアウトが崩れる箇所を修正
･特定の条件で空タグが発生するのを修正
･細かな修正、最適化
9.30 大幅更新
･デザイン若干変更
･メニュー･メイン幅の変更をしやすく
･html･CSSの再構築

2007
11.17 記事先頭にリスト(ul,li)を置いた場合レイアウトが崩れるのを修正
10.17 絵文字等にpaddingが入るのを修正
1.4 公開

2009年9月現在、FC2リクエストに月の英語表記用変数の導入へのリクエストがあります。
FC2リクエスト「月の英語表記用の変数」

アーカイブの「月」を数字表記から英語表記にするというのは、
このブログを始めた当初から思っていた「出来たらいいな。こんなカスタマイズ」の一つでした。

2009年12月更新 jQueryで"月"を英語表記にする

導入方法
まず以下のコードを</head>直前あたりに入れます。

<script type="text/javascript"><!--
month = new Array(12);
month['01'] = 'January';
month['02'] = 'February';
month['03'] = 'March';
month['04'] = 'April';
month['05'] = 'May';
month['06'] = 'June';
month['07'] = 'July';
month['08'] = 'August';
month['09'] = 'September';
month['10'] = 'October';
month['11'] = 'November';
month['12'] = 'December';
//--></script>

次に英語表記にしたい <%topentry_month> を以下のコードに置き換えます。

<script type="text/javascript"><!--
document.write (month['<%topentry_month>']);
//--></script>

公式プラグイン「月別アーカイブ」の月を英語表記にする場合は
<!–archive–> ～ <!–/archive–>の間を以下のコードに置き換えます。
(プラグイン管理 → 月別アーカイブの編集 → 【HTMLの編集】 より)

<script type="text/javascript"><!--
document.write ('<li><a href="<%archive_link>">',month['<%archive_month>'],' <%archive_year> (<%archive_count>)</a></li>');
//--></script>

動作確認、エラーチェックしましたがjavascriptは弄った事無いので少し不安です。
「ここ変！」な箇所がありましたら報告お願いします。

環境設定で変えれるようになってほしいな

共有テンプレート「momo」を気に入ってくださった方へ

公開したての時期は予期せぬ不具合が見つかったりする場合があり、
更新が行われる可能性があるので落ち着くまでは頻繁にチェックしてもらえると嬉しいです。

テンプレート第6段目でございます＞＜

今回の「momo」は、メイン･メニュー1（プラグイン1）・メニュー2（プラグイン2） の3カラム構成です。
メインの幅は500px（内、左右に10pxのpadding）
第1メニュー（プラグイン1）の幅は180px、第2メニュー（プラグイン2）の幅は160px です。
前回の「grea」に比べ、メインの幅調整はできないようになってます。
というよりメイン・メニューに限らず幅調整はしにくい作りになってしまってますm__m

カスタマイズ、何か気付いたこと等ありましたらこの記事のコメント もしくはメールでご連絡下さい。

登録情報

テンプレートのイメージ： シンプル
テンプレートのレイアウト構造： 3カラム
テンプレートの技術： 画像少な目
テンプレートのベースカラー： 中性系
テンプレートのターゲット： 初心者

末永くかわいがってやって下さい

･4/23 公開

共有テンプレート「grea」を気に入ってくださった方へ

公開したての時期は予期せぬ不具合が見つかったりする場合があり
更新が行われる可能性があるので落ち着くまでは頻繁にチェックしてもらえると嬉しいです

あと、何かありましたらこちらにお願いします

希少なfasiテンプレファンの方、お待たせしました。久しぶりの共有テンプレでございます
今回の「grea」はエントリーの幅調整が簡単にできるようにしています。
写真系ブログでも安心ですね１
[2カラム][左メニュー][プラグイン1]

※エントリー幅変更の仕方
CSS最上部にある＜エントリー幅調整項目＞の2箇所を同じ数値づつ増減してください
例:
#container {width: 680px;}
#blogcontainer {width: 440px;}
↓
#container {width: 780px;}
#blogcontainer {width: 540px;}
（この場合それぞれ+100px）

･8/06 更新（デフォルトで<%introduction>表示）
･7/16 公開
･7/11 登録（公開されるまでもう少しお待ちください）

ユーザー共有テンプレート「bglen」を気に入ってくださった方へ

ダウンロードありがとうございますm
公開したての時期は予期せぬ不具合が見つかったりする場合があり
更新が行われる可能性があるので落ち着くまでは頻繁にチェックしてもらえると嬉しいです

あと、何かありましたらこちらにお願いします

テンプレ lastupdate10/29

うわっ 思ったより公開されるのが早かったです
ちょっと見切り発車。。

【更新履歴】
2009年3月17日 HTML,CSSを色々と修正
2006年10月29日 記事タイトルが長い場合Firefoxで表示するとレイアウトが崩れるのを修正

gr_smooth_ver2を選んでいただきありがとうございます

このテンプレートは、2カラム・3カラム・左メニュー・右メニュー・両サイドメニューに
簡単に変形することができます。
あなただけのレイアウトを作ってみてください。

＜設定方法＞


＜「3カラム」 記事・メニュー・メニュー の場合＞
スタイルシートの編集一番上にある
/* レイアウトブロック */
#left {float: left;}
を
#left {float: right;}
に変えます。


＜「3カラム」 メニュー・メニュー・記事 の場合＞
スタイルシートの編集一番上にある
/* レイアウトブロック */
#container {float: left;}
を
#container {float: right;}
に変えます。


＜「2カラム」 メニュー・記事 の場合＞
HTMLの編集下部にある
!– プラグイン２エリア削除 –ここから～ここまで を
まるごと削除します。


＜「2カラム」 記事・メニュー の場合＞
HTMLの編集下部にある
!– プラグイン２エリア削除 –ここから～ここまで を
まるごと削除し、
スタイルシートの編集一番上にある
/* レイアウトブロック */
#left {float: left;}
#container {float: left;}
を
#left {float: right;}
#container {float: right;}
に変えます。

メニューの高さを変更するには
スタイルシートの編集上部にある
#left {margin-top: 150px;}
#right {margin-top: 150px;}
の150という数値を色々いじってみてください。
#leftがプラグイン1エリアで、#rightがプラグイン2エリアです。

その他質問等ありましたら気軽にどうぞ

※画像等を変えて再配布したいという方はコメントもしくはメールください

テンプレlastupdate10/20

*10/20
・文字装飾が無効になるのを修正
・あと直接は関係ないところをごにょごにょ

ユーザー共有テンプレート「gr_smooth」を気に入ってくださった方へ

ダウンロードありがとうございますm
公開したての時期は予期せぬ不具合が見つかったりする場合があり
更新が行われる可能性があるので落ち着くまでは頻繁にチェックしてもらえると嬉しいです

あと、何かありましたらこちらにお願いします

※画像等を変えて再配布したいいう方はコメントもしくはメールください

テンプレ lastupdate10/20

*10/20
・文字装飾が無効になるのを修正
・あと直接は関係ないところをごにょごにょ

*11/15
・背景拡張
body {
background: #e9e8e4;
}
を、お好みで
body {
background: #e9e8e4 url(http://blog-imgs-10.fc2.com/t/e/s/test1112/grs_bg.png) 0 0 repeat-x;
}
にしてみてください(”（コピー＆ペーストでお願いします）