雪が凄い(；ﾟдﾟ)

雪がヤバいね。

さっき買い物しにコンビニ行ったらこけたw

これから冷えて凍ったらもっと危険なので皆さんも注意して下さいな(；ﾟдﾟ)

そろそろ成人式

どうも、ゆうぢです。

そろそろ成人式ですね。今年も荒れるんでしょうかw

成人式で楽しみなのは中学、小学などの地元の友達に久しぶりに会うことでしょう。

ぼくは19歳で地元を離れてたので久しぶりに会う友人達と公認でw飲めるのを楽しみにしてました。

まぁ飲みに飲んで最後は記憶が曖昧になりましたがw

でも楽しいですよね。今年、成人式の皆さん。多いに楽しんで下さい(´∀｀)

ヘッダーエリアに画像を表示。【アメブロ】

どうも、ゆうぢです(´∀｀)ノ

初期設定のアメブロのCSSカスタマイズ可能スキンだと、ヘッダ部分に画像が無くて殺風景ですよね。
ここはブログを見に来てくれた人に一番目立つ所なので、オリジナリティのある画像などにして凝りたいところです。

これね。色々とやり方書かれてるんですが、CSSの詳しい説明までしてなかったので、一つ一つを調べて詳しくまとめてみました。

僕がやっている方法です。（このブログでは設定してません）

1. まず、ヘッダー画像を用意します。新デザインになってから、横幅が980pxになったので、横幅は980pxに設定するとデザイン的にスッキリします。
   高さはお好みで構いませんが、あまり高くするとブログの記事までスクロールがたくさん必要になって見に来てくれた人が不便です。


2. 次に画像をアップするのですが、アメブロの画像フォルダだと横幅が980pxは対応してません。なので、デザインの変更→CSSの編集　の中にある「ブログデザインヘッダ・背景用画像の追加」のところに画像をアップします。アップされると下にプレビュー画像と画像のパスが出ます。ここまでで画像の準備が完了です。


3. 次にCSSをいじくります。
   先ほどのCSSの編集の中にある「現在使用中のブログデザインCSS」の一番下に
   /*
   ＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊
   
   
   (4) その他、拡張
   
   
   ＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊
   */
   ってところがあると思います。この下に以下のCSSを貼って下さい。
   
   
   /* ヘッダー画像設定 */
   .skinHeaderArea {
   background-color: transparent;/* 背景色を透明にする */
   background-image: url(ここに先ほどアップした画像のパスを入れる);
   height:400px;/* 使用する画像の高さと同じ値を入力する */
   margin-top:10px;/* ヘッダー画像の上の余白 */
   background-repeat: no-repeat;/* ヘッダー画像を繰り返し表示しない設定 */
   }
   
   この上まで。
   /* から */ に囲まれているところはCSSコードの説明や自分で後から見て解りやすくする為につけられるコメントです。CSSには関係ないので、慣れて来たら消してもオッケーです。
   今回は一つ一つのコードが何の役割をしてるか解るように一つ一つに説明を乗せてあります。


4. そこまで出来たら、その下の保存ボタンを押して保存します。
   ちゃんと表示されているか確認をしてみて下さい。

以上っす！お疲れ様でした(´∀｀)ノ
とりあえずテキストだけで書いてしまいましたが、後日、画像も合わせてもっと解りやすくまとめてみようと思います。

※注意！CSSをすでにいじってる方は最初にCSSのバックアップを取ってから作業をする事をオススメします。
表示が崩れたりしても、こちらでは一切の苦情は受け付けません。