ブログのカスタマイズ 

ブログのカスタマイズについて


おおまかですが重要な部分の

ブログのカスタマイズ方法をお伝えします



ブログのデザインを固定したまま、文字の大きさや

色を変えるにはスタイルシートを変更すれば

OKです。

まずはご自分スタイルシートを見てください


一見すると、わけのわからないアルファベットの

羅列に見えますが一つ一つにちゃんと

意味があります。


例えば、これ↓は記事のタイトルを

つかさどるスタイルシート。

・title{
margin:0px;
font-size:15px
color:#0000FF;
}

これ↓はリンクに関するスタイルシート。

a{
color:#0000FF:
text-decoration:under;
}

このように、ブログのスタイルシートは
小さなスタイルシートをいくつも組み合わせて
1つの大きなスタイルシートを構成しています。


そして良く見るとわかりますが、
それぞれのスタイルシートは
{ }というカッコに囲まれていて、
その前にスタイルシートの項目名が書かれています。


この{ }の中に、文字の色や大きさなど様々な条件を
付け足していくことでスタイルシートを編集することが
出来るんです。



全てのスタイルシートの意味を覚える必要は無いので、
必要最低限のブログ編集に必要なことだけを
覚えていきましょう。


覚えるべきは下記の7点です。

■文字の大きさを表す項目
font-size : ●●px;


※この●●のところを任意の数字に変えることで
文字の大きさを調整できます。


■色をあらわす項目。
color:# ●●●●●●;


※この●●●●●●のところを任意のカラーコードに変えることで
文字や背景の色を調整できます。


※カラーコードとは色を表す6桁文字列のことです。
代表的なカラーコード↓


白 #FFFFFF
赤 #FF0000
青 #0000FF
黒 #000000

その他のカラーコードは下記をご参照下さい↓

http://www.tagindex.com/color/safe_color.html

■背景色をあらわす項目
background-color:#●●●●●●;
※上記と同様にカラーコードで編集が可能です。


■記事の枠を司る項目
.blogbody { }

■記事の文字を司る項目
.text{ }

■リンク文字を司る項目
a{ }

■記事タイトルを司る項目
title{ }

これだけ分かれば、あとは

組み合わせで文字色と大きさの調整が

できるようになります。

それでは実際に、

■記事背景色の変更

■記事文字色の変更

■記事の文字の大きさの変更

■リンク文字の変更

■タイトル文字の変更

について、手順を御解説しますね。


■記事背景色の変更

記事背景色の編集をするには

.blogbody { } というところを編集します。


・blogbody{
font-weight:normal;
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
border-left:1px solid #cccc4;
border-right:1px solid #cccc4;
background-color:#FFFFFF; ←ココ
}

{}の中は、各デザインによって異なりますので
図と違っても気にしないで下さい。
この中のbackground-colorを編集します。

この中のbackground-colorを編集します。

既にbackground-colorが書かれている場合は

カラーコードを#FFFFFFに変更してください。

background-colorが書かれていない場合は

図のように、background-color:#FFFFFF;

を書き加えてください。


これで記事の背景色が白色になりました。



■記事文字色の変更

■記事の文字の大きさの変更

文字色を変更するには.text{ }という箇所を編集します。


.text{
padding:0px;
font-size:15px; ←ココ
margin-top:0px;
line-height:1.8em;
font-family:Verdana;
}


font-sizeが文字の大きさで、

colorが文字の色ですね。

一般的には14~15pxくらいが

見やすい大きさと言えるでしょう。

黒のカラーコードは#000000です。

.text{}の中に、font-sizeや

colorが無い場合は

図のように付け足してください。


■リンク文字の変更

リンク文字を変更するにはa{ }という

箇所を編集します。

a {
color#69F; ←ココ
}

カッコの中を下記のように変更してください。

該当項目が無い場合は書き加えてください。



■記事タイトル文字の変更

記事タイトルの編集は.title{}の

箇所で編集します。

ここも文字の色は青がいいので

カラーコードは#0000FFです。

文字の大きさは16~17pxくらいが

いいでしょう。

.title{
margin-top:0px;
font-size:15px; ←ココ
color:#0000FF; ←ココ

該当項目が無い場合は

書き加えてください。

以上で必要最低限の

ブログのカスタマイズ編集は完了です。

参考になさってくださいね


>>優良アフィリエイト商材レビュー一覧



私のお奨め情報商材レビュー一覧です。

貴方に、ぴったりな情報が見つかると思います。

参考にされてください。


お悩みはご遠慮なくどうぞ



ジェームス・スキナーの成功の秘訣に

ご興味ありましたらビジネス成功の

秘訣のCDがもらえます

参考になると思います。

ジェームス・スキナーの成功の9ステップCD無料プレゼント!


ランキングにも参加しています。

新しい、学べる話題たっぷり!!

応援してもえたらうれしいです^^




f9b59d70-s.jpg


Yahoo!ブックマークに登録












コメント

こんにちは!てつやです。
はじめまして。

直美さんはカスタマイズに詳しいの
ですね。初心者の方には喜ばれる
記事だと思います。

応援ポチッ!
  • [2009/02/11 13:31]
  • URL |
  • ブログアフィリエイトで副業!@てつや
  • [ 編集 ]
  • TOP ▲

直美さん、
こんにちは!

マニスです(^-^)

必ず必要になってくる知識ですよね^^

コピベ必須項目です!!

真心込めて応援ポチポチ♪
  • [2009/02/11 15:56]
  • URL |
  • マニス(つじまろさんのNBワールドマップ・レビューしました】
  • [ 編集 ]
  • TOP ▲

コメントの投稿















管理者にだけ表示を許可する

★情報満載、当ブログの目次です。参考になれば幸いです

↓当ブログ参考になりましたら下記に1票クリックお願いします^^

★ブログランキング

ブックマークに登録

トラックバック

この記事のトラックバックURL
http://from1778.blog65.fc2.com/tb.php/91-6ae94865

キャッシング