2005年07月01日

スクロールバーの色を変える

☆スクロールバーの色変更☆

1))マイブログ→デザイン→スタイルシート→自分が使っているテンプレート名をクリックすると そのテンプレートのスタイルシートが表示されます。その一番上に↓を貼り付けます。色は自分の好きな色に変更してくださいね
下記は↓ ここのblogのスクロールバーの色です 

html, body {
scrollbar-arrow-color: #FF9999; / ←矢印の色
scrollbar-track-color: #FFE4E1; /←トラックの色
scrollbar-face-color: #FFFFFF; /←表面全体の色
scrollbar-shadow-color: #FFFFFF; /←右端・下端の明るい色
scrollbar-darkshadow-color: #FF9999; /←右端・下端の暗い色
scrollbar-highlight-color: #FF9999; /←スライド部分の色
scrollbar-3dlight-color: #FFFFFF; /←上端・左端の色
}


色見本はこちらを参考に〜↓
http://orange-e.net/help/bbs/colorsample.html



ニックネーム cocoamilk at 00:00| カスタマイズ | このブログの読者になる | 更新情報をチェックする

好みの背景をつける

☆お好みの壁紙に替える☆

※ 壁紙は自作のものでも、素材屋さんのものでも何でもOK〜ですよ 
※ テンプレートは背景がある物の方が直しやすいです
  「ペアチワワ」「ふわふわピンク」「ふわふわブルー」など
  ↓は「ふわふわピンク」のテンプレートを使って説明してます

1)まず フリーの素材屋さんなどで背景にしたい壁紙を自分のPCに保存します
  保存の仕方・・・欲しい壁紙の上で右クリック→「名前をつけて画像を保存」を左クリック
  半角英数でファイル名をつけて保存します

2)マイブログで 写真をアップロードするのと同じ方法で 保存した壁紙をアップロードします。
  ※自分の借りているサーバーがあればそこにファイル転送してもOK


3)アップロードしたファイル一覧からその壁紙のファイル名をクリックすると
  「ファイルマネージャ」の画面になり 元画像 サムネイル画像 の壁紙がありますが 
   元画像の壁紙の上で右クリック→プロパティを左クリック→
  すると壁紙のアドレス(URL)が出てくるので それをコピーしてメモ帳か何かに貼り付けしておいてください
4)マイブログ→デザイン→スタイルシート→自分が使っているテンプレート名をクリックすると
  そのテンプレートのスタイルシートが表示されます。その中から↓のタグを探し

body {
font-family: Arial, Helvetica, sans-serif;
text-align:center;
margin:0px;
padding:0px;
background-image:url(http://a-thera.com/img/bg/fuwafuwachiwawa_a/bg.gif);
}



http://a-thera.com/img/bg/fuwafuwachiwawa_a/bg.gif の部分を先ほどメモ帳に貼り付けておいたURLと置き換え スタイルシートを変更するをクリックした後 再構築してください

これで壁紙が替わったはずですが どうでしょうか?


ニックネーム cocoamilk at 00:00| カスタマイズ | このブログの読者になる | 更新情報をチェックする

TOPのプレート替え 

ペアチワワのテンプレートの場合で説明

まず、ここに書いてあるやり方で自作のプレートを作りましょう〜

1)マイブログで 写真をアップロードするのと同じ方法で 保存したプレートをアップロードします。
※自分の借りているサーバーがあればそこにファイル転送してもOK

2)アップロードしたファイル一覧からそのプレートのファイル名をクリックすると「ファイルマネージャ」の画面になり 元画像 サムネイル画像 のプレートがありますが 元画像のプレートの上で右クリック→プロパティを左クリック→するとプレートのアドレス(URL)が出てくるので それをコピーしてメモ帳か何かに貼り付けしておいてください

3)マイブログ→デザイン→スタイルシート→自分が使っているテンプレート名をクリックすると そのテンプレートのスタイルシートが表示されます。その中から65行目ぐらいに↓があるので この中の


#banner{
background-image:url(http://a-thera.com/img/bg/a-thera_chiwawa/header.gif);
background-repeat:no-repeat;
height:199px;
font-family:arial, Helvetica;
margin:0px;
text-align:left;
margin-bottom:10px;
padding-left:100px;
}


http://a-thera.com/img/bg/a-thera_chiwawa/header.gif
の部分を先ほどメモ帳に貼り付けておいたURLと置き換え スタイルシートを変更するをクリックした後 再構築してください

これで自分だけのblogに変わっているはず?

※ 付け足し・・・

そのプレートの上にブログ名、説明が残っていると思います
削除は↓のやり方で〜

デザイン→コンテンツでブログ説明 ブログ名を削除し再構築してください


ニックネーム cocoamilk at 00:00| カスタマイズ | このブログの読者になる | 更新情報をチェックする

タイトルの部分にgifアニメを挿入する

今までと同じやり方で 挿入したいgifアニメをアップロードしておきます
説明の「topのプレート替え」の 1)2)まで 同じやり方です
URLを メモ帳に貼り付けておきましょう〜

スタイルシートの変更をします

※テンプレートが ペアチワワの場合
このテンプレートには123.gifが最初から入っているので これを置き換えるだけでOKです

.blogbody {
background-image:url(http://a-thera.com/img/bg/a-thera_chiwawa/blog_body.gif);
background-repeat:no-repeat;
background-position:top left;
border-left:5px solid #E8FFB1;
border-right:5px solid #E8FFB1;
border-bottom:5px solid #E8FFB1;
background-color:#FFF;
}

↑を探しhttp://a-thera.com/img/bg/a-thera_chiwawa/blog_body.gif
をアップロードしたものと置き換えます
あまり大きなものだと テキストとかぶってしまうので小さめがお勧め123.gifの場合 65×84サイズ

background-position:top left; ← 真ん中にしたい場合 center 左側は left 右側は right

このままだと テキストの書き始めの部分とかぶってしまうので
↓を探します

.text{
font-size: 12px;
color:#707070;
margin-top:50px;
padding-left:20px;
padding-bottom:0px;
}

テキストの書き込みの始めを下にずらしたい場合
margin-top:50px; ← 50の数値をかえます  0が一番上です 下に行くごとに数値を大きくします

そしてスタイルシートを変更するをクリックした後 再構築してください

※テンプレートが パズルチワワの場合
パズルチワワの場合は テンプレートにこのような表示がないので

.blogbody {
★★★
border-bottom:2px solid #DBD6D7;
}

を探し★★★の部分に

background-image:url(http://a-thera.com/img/bg/a-thera_chiwawa/blog_body.gif);
background-repeat:no-repeat;
background-position:top left;

を追加し 上と同じようにhttp://a-thera.com/img/bg/a-thera_chiwawa/blog_body.gif
の部分を置き換えます


テキストの書き込みの始めの位置は

.text{
font-size: 12px;
padding:5px 10px 5px 10px;
}
を探し

padding:5px 10px 5px 10px;を削除し
↓を追加します

margin-top:70px;
padding-left:20px;
padding-bottom:0px;

上と同じようにmargin-top:70px; の数値を変えます

そしてスタイルシートを変更するをクリックした後 再構築してください

※ タイトル名が長いとgifアニメと重なってしまってます
  暫くお待ちください・・・調べてみます(*'-')o(*,",)oぺこり

かわいい このやり方は 自分なりにいじって変更したものですので このやり方が正しいかどうかは謎です(^_^;)

ニックネーム cocoamilk at 00:00| カスタマイズ | このブログの読者になる | 更新情報をチェックする

サイドタイトルバナー替え

サイドタイトルバナー替え


※ペアチワワのテンプレートの場合で説明

まず、ここに書いてあるやり方で自作のバナーを作りましょう〜


1)マイブログで 写真をアップロードするのと同じ方法で 保存したバナーをアップロードします。
※自分の借りているサーバーがあればそこにファイル転送してもOK

2)アップロードしたファイル一覧からそのバナーのファイル名をクリックすると
「ファイルマネージャ」の画面になり 元画像 サムネイル画像 のバナーがありますが 
元画像のバナーの上で右クリック→プロパティを左クリック→するとバナーのアドレス(URL)が出てくるので 
それをコピーしてメモ帳か何かに貼り付けしておいてください

3)マイブログ→デザイン→スタイルシート→自分が使っているテンプレート名をクリックすると 
そのテンプレートのスタイルシートが表示されます。その中に↓があるので 

.calendarhead {
background-image:url(http://a-thera.com/img/bg/a-thera_chiwawa/side_title.gif);
color:#70705A;
font-size:12px;
padding:10px 10px 9px 40px;
font-weight:bold;
text-align:left;
}

.sidetitle {
background-image:url(http://a-thera.com/img/bg/a-thera_chiwawa/side_title.gif);
color:#70705A;
font-size:12px;
padding:10px 10px 9px 40px;
font-weight:bold;
}

この中の
http://a-thera.com/img/bg/a-thera_chiwawa/side_title.gifの部分を先ほどメモ帳に貼り付けておいたURLと置き換え 
スタイルシートを変更するをクリックした後 再構築してください



ニックネーム cocoamilk at 00:00| カスタマイズ | このブログの読者になる | 更新情報をチェックする

カーソルを替える

まず、自分のお好みのカーソルを無料で配布している素材屋さんで探して DLします。
圧縮されている場合が多いので解凍してください

通常のカーソル待ち状態のカーソル
が必要です


1)マイブログで 写真をアップロードするのと同じ方法で 保存したカーソルをアップロードします。
※自分の借りているサーバーがあればそこにファイル転送してもOK

2)アップロードしたファイル一覧からそのカーソルのファイル名をクリックすると 元ファイルに URLが表示されていますので それを
コピーしてメモ帳か何かに貼り付けしておいてください(二つ共)

これをスタイルシートで変更します

ちなみに・・・母は「ぴ〜はうす」さんを参考にさせて頂きました
見てもらえばわかると思いますが一応・・・

下記のタグの中に ○○○○○の部分は 通常のカーソルのURL △△△△△の部分は 待ち状態のカーソルのURLを入れます  
これをスタイルシートに貼り付ければOK〜手(チョキ)です
場所は・・・スタイルシートの一番上で大丈夫だと思います
それと 必ず今までのスタイルシートをコピペしておいてから 変更作業を行ってくださいね

body{ cursor:url('○○○○○'); }
a { cursor:url('△△△△△'); }




   ココミル母


ニックネーム cocoamilk at 00:00| カスタマイズ | このブログの読者になる | 更新情報をチェックする