月別アーカイブ

タグ

twitter 2カラム(右) グリーン 3カラム スマートフォン    ブラウン ベージュ ピンク ブルー 2カラム(左) イエロー    ホワイト グレー 写真   観覧車 ミントグリーン ゴールド  リボン ブラック ドット パール 水玉  パープル  lomo オレンジ ハロウィン ディープブルー ネイビー  2カラム クローバー 植物  和風 フレンチ ノート カラフル 

記事検索

FC2ブログとは?

わたしが作成しているテンプレートは「FC2ブログ」というサービスで利用できます。
無料のブログサービスはいくつもありますが、1GBの大容量ということとギラギラした広告がなくデザインの自由度が高いという点でおすすめです!
オリジナリティが出せるので、個人はもちろんショップやサークルのオフィシャルブログとしても十分活用できると思います。
PCの他、携帯やスマートフォンからも閲覧・投稿ができるところもポイント。 これからはじめてみたい方はぜひ。
そして、このブログで紹介しているデザインは共有テンプレートとして配布(もちろん無料)していますので見てみてくださいね。

プロフィール

うららん

管理人:うららん
自作のブログテンプレートやツイッター背景を配布しています。
心がけているのは、記事やつぶやきが主役になるよう、邪魔しない、かつ居心地がいいデザインであること。よって、かなりシンプルです。
よろしければ、ご自由にお使いください。
ただの物好きがつくっていますので、至らない点が多々あると思いますが、大目にみてくださいね。


タイトルの由来は、日々、麗らかであるようにとの願いから。

うら-らか【麗らか】
1 空が晴れて、日が柔らかくのどかに照っているさま。
2 声などが晴れ晴れとして楽しそうなさま。
3 心にわだかまりがなく、おっとりしているさま。
(大辞林より引用)

My twitter

My facebook

お問い合わせ

名前:
メール:
件名:
本文:

フリーエリア

お休みのお知らせ

2013年9月以降、コメントやご質問、お問い合わせへのお返事をお休みしております。
どうぞご了承ください。

ブログで紹介しているテンプレートはFC2ブログ用です。ログイン後、管理画面の共有テンプレート追加からダウンロードしてご自由にご利用いただけます。商用利用もどうぞ。

※再配布不可との記載のは、テンプレートや使われている画像をご自分のものとして他の人に配布したり掲載したりを禁止しているだけですので、カスタマイズ中の不具合などで再度ダウンロードしていただくのは何回でもOKです!

PR

ブログテンプレ『white blog』『black blog』アクセントカラー変更方法

2010.11.06 18:48|カスタマイズ
ダウンロードしてくださったみなさん、ご検討中のみなさん、
ありがとうございますm(_ _)m

テンプレート名「12_whiteblog」「13_blackblog」の簡単カスタマイズ(2)!!
「アクセントカラー変更」方法についてご説明します。

投稿日時部分のデザインですが、
共有テンプレートでは「12_whiteblog」がオレンジ、
「13_blackblog」はウッド調になっています。
その他に、イエローグリーン、ライトブルーの差し替え画像をご用意していますので、
お好みのものがありましたら変更してみてくださいね。

■「12_whiteblog」用差し替え画像ファイル名

12_tag_or.png
12_tag_or.png(初期)

12_tag_yg.png
12_tag_yg.png
12_tag_lb.png
12_tag_lb.png
12_tag_wood.png
12_tag_wood.png



■「13_blackblog」用差し替え画像ファイル名

13_tag_wood.png
13_tag_wood.png(初期)

13_tag_yg.png
13_tag_yg.png
13_tag_lb.png
13_tag_lb.png
13_tag_or.png
13_tag_or.png


変更方法はいたって簡単!
変更はテンプレートのスタイルシート編集になります。
スタイルシートの記述中には */ コメント /* がついています。

/* メインコンテンツ
------------------------------------------------------------ */
の中の以下の部分を探してください。

#main td.kizi_sub {
width: 65px;
vertical-align: top;
background: url(http://blog-imgs-46.fc2.com/u/r/a/uraraka01/12_tag_or.png) no-repeat;
/* ◎投稿日時部分の色変更はココ。オレンジ→12_tag_or.png。イエローグリーン→12_tag_yg.png。ライトブルー→12_tag_lb.png。詳しくはhttp://uraraka01.blog27.fc2.com/にて◎ */
}



赤字の部分を変更したい画像のファイル名に書き換えてくださいね。

どうせなら、CMやTB、カレンダーやリンク文字も
同色のアクセントカラーに変更していただきましょう!
スタイルシートを上からたどっていただくと、

/* ◎~の色変更はココ。オレンジ→#ff7f43。イエローグリーン→#a3ef00。ライトブルー→#00d7f1。詳しくはhttp://uraraka01.blog27.fc2.com/にて◎ */

という記述が何カ所か出てきます。
コメントどおりに、その直前のカラーの記述(#~)を変更してみてください。
ウッド調の場合は、3色からお好きな色をどうぞ。


わたし、うまくご説明できていますでしょうか?
ご不明な点がありましたら、コメントでもメールフォームからでも
お気軽にお問い合わせくださいませ。
関連記事

コメント

No title

こんにちは。ここで質問しても良いのかは分かりませんが、疑問点があったのでコメントします。

テンプレート「12_whiteblog」を利用させてもらっています。
リンク色の変更等はこちらを見てだいぶ変更できるようになりましたが、エントリ本文の文字サイズのほうはどのあたりを変更すれば変えられるのでしょうか?
探してみるとfont size=x-smallという部分があるのでここを変えればいいのかな、と思ったのですが、11pxほどの文字サイズの場合はどのように表記すれば変更可能でしょうか。

初心者的な質問の上にお忙しいとは思いますがよろしくお願いいたします。
テンプレはとても気に入っています。更新や作成頑張ってください^^♪

Re: No title

gunsoo 様

コメントありがとうございます。

「12_whiteblog」の文字サイズですが、
現在は12pxほどになっています。
が、ユーザビリティの観点から相対サイズで指定しています。

詳しくご説明しますと、
body(全体)にsmallと指定(x-smallはIE5用の指定です)、
エントリー本文にはその90%と指定しています。
smallは標準meduim=16pxの一段階下で、13.333…pxです。
13.333…×0.9でほぼ12pxというわけです。

エントリー本文のみを約11pxにするには
スタイルシートを以下のようにしてみてください。

/* メインコンテンツ
------------------------------------------------------------ */
の下をたどり、

div.entry_body {
font-size: 90%; ←11pxまたは83%に変更
margin: 30px 15px 20px 15px;
line-height: 1.8em;
letter-spacing: 0.1em;
}

ページ全体的に変更する場合は
bodyの基準フォントサイズ自体を替えてしまってもいいかと思います。
私は基準はキーワードでざっくり設定し、個別に%で調整していますがなかなか大変ですものね。
bodyで一段階低いx-smallとすると、その90%で本文は10pxほどになってしまいますので、
パーセントで75%(=12px)と設定し、その90%=10.8pxとしていただくのはいかがでしょうか?

/* 全体
------------------------------------------------------------ */
の下、

body {
background: url(http://blog-imgs-46.fc2.com/u/r/a/uraraka01/12_bg.jpg) repeat-x fixed #ffffff;
color: #666666;
font-family: sans-serif;
font-size: x-small; ←75%に変更
voice-family: "\"}\"";
voice-family: inherit;
font-size: small; ←75%に変更
}

html>body {
font-size: small; ←75%に変更
}

方法はいろいろです。
バグもいろいろあるようですが、
試してみてくださいね!

今後ともよろしくお願いいたします。

No title

詳しい解説を非常に分かりやすくしていただき、ありがとうございます。
なるほどパーセント表記で変更することも可能なのですね。ブログ全体のフォントサイズを変更するのもプレビューを見た限りでは問題なさそうだったので、今回は全体を変更してみました。
無事に目的のサイズに変更できたようです。感謝しますm(._.*)m

クリスマスレイアウトのテンプレ公開予定とのことで、楽しみにしております!
それでは^^♪

No title

おはようございます
「12_whiteblog 」を利用させていただいているイトコトと申します
素敵なテンプレートに出会えて 感謝しています!

カスタマイズについて質問させてください

「12_whiteblog 」を月別・カテゴリ別アーカイブのドロップダウンリスト化は可能でしょうか?
FC2のヘルプを見て 試みましたが 上手くいきませんでした。
 
お忙しい所、恐縮ですが よろしくお願いいたします

Re: No title

イトコト 様

お返事が大変遅れて申し訳ありません。
ご利用ありがとうございます。
リンクからブログ拝見しました。
とても素敵ですね。

ご質問については、申し訳ありませんが、個別のカスタマイズにあたりますのでお許し下さい。
どうしても線引きしないとやっていけないのでご了承下さいね。
ヒントとしては、サイドはプラグインに対応していますので、
環境設定/プラグインの設定 から個別にHTMLを編集していくことなります。
ご存知かと思いますが、リストの代わりに<select>タグ<option>タグを使うとプルダウンにできるはずですよ。

よろしくお願いいたします。

No title

うららん様

ご多忙の所 お返事いただきまして
ありがとうございます

手さぐりではありますが
少しづつ ブログを進めていこうと思います

ありがとうございました!
非公開コメント