ブログカスタマイズやパソコン初心者の方が
パソコン1台で独立を達成
女性起業家のための集客力や
デザイン力を身につける
愛されるブログ作りのための
ブログデザイン・パソコン教室
ブログデザイナー：水本紗輝です。
お客さまの目と心をワシ掴む
魅力的なブログデザイン・
ヘッダーカスタマイズも
たったの1,0000円で承ってます
この度はご閲覧下さり、ありがとうございます。
どうぞ、よろしくお願いしますUU
-----------------------------------------------------------------------------------------
年越しそば食べるぞ～
しかし、実家鹿児島に
帰省のため、夜は電車の中なので、
朝食べました
朝からそば．．．は
うん、オススメしない
今日は、記事のヘッダーのご挨拶欄を変えて
みました
こっちの方が分かりやすいかなと
思いました
今回初めて、
無料ブログアドバイス企画を開催しましたが、
自分でもアドバイスが下手だったなと反省
現在、初心者の方にも
もっと分かるように、
かんたんにカスタマイズが
できるように新たに記事を
書いて修正をかけて、準備中！！
１月６日以降に更新していきますので、お楽しみに
本日は、
『アメブロのヘッダー画像の
カスタマイズ方法』
についてです！！
① まず、
/* skinHeaderArea ブログヘッダー980pxエリア */
.skinHeaderArea{
}/* ←ブログヘッダーに背景画像を敷きたいとき */
の部分を削除。
② 下記コードをコピーして貼り付けて保存してください。
/* ■ヘッダ画像■ */
.skinHeaderArea {
background :url(画像のURL); /* ヘッダ画像 */
background-repeat:no-repeat; /* ヘッダ画像のリピート */
width :980px;/* ヘッダ画像の幅*/
height :340px; /* ヘッダ画像の高さ (自由に変更)*/
padding-bottom :250px; /* ヘッダ画像とメインカラムとの間のスペース(自由に変更) */
}
ヘッダーのカスタマイズは、
CSS編集スタイルシートの
（３－２）欄を編集します。
ブログのヘッダーの幅は
何もいじっていない限りは、980pxです。
ヘッダーの高さ・
メインカラムとヘッダー画像の間のスペース
サイズは、ヘッダー画像の幅に合わせて、
自由に変更してください。
③ デザイン変更→CSS編集ページ→
ブログデザインヘッダ・背景用画像の追加欄から
ヘッダー画像をアップロードします！
アップするとアップロードされた画像として
画像パス（画像URL）とともに表示されます↓
④ 画像URLをコピーして、②で張り付けた赤文字部分を
画像URLに変更して、保存。
/* ■ヘッダ画像■ */
.skinHeaderArea {
background:url(http://stat.blogskin.ameba.jp/blogskin_images/
20131231/09/dd/b6/p/o09800380world-paper-craft1388449166292.png); /* ヘッダ画像 */
background-repeat:no-repeat; /* ヘッダ画像のリピート */
width :980px;/* ヘッダ画像の幅*/
height :340px; /* ヘッダ画像の高さ (自由に変更)*/
padding-bottom :250px; /* ヘッダ画像とメインカラムとの間のスペース(自由に変更) */
}
⑤ 設定が完了するとこんな感じになります！
-----------------------------------------------------------------------------------------
ご閲覧ありがとうございました！！
皆様、良いお年を～
お餅でおなかをこわさないように～（笑）