アメブロカスタマイズ ① | ~植物に夢中~ 木花mocca 植物のレンタル・販売・施工 
おはようございます。屋形です。

最近、アメブロのカスタマイズにすっかりはまっております。

一時はCSS編集で作ったものを全部消しちゃったなんてこともあり、

がっくり。挫折?かと思いましたが。


だいぶいろいろとできてきました。

一番最初はやっぱり

ブログヘッダーの画像をオリジナルにする。

これです!まずはこれが変わるのが楽しい。



今回は、980ピクセル×387ピクセルで作りました。

普段、フライヤーや名刺を作っているので、今回もイラストレーターで作成。

前職はデザイン会社だったので~~ぼーこういうの好きなんです。

作ったものをGIFで保存、配置しましたきらきら


今回、参考にさせていただいたサイトはこちら音符
ありがとうございます。


弊社のカスタマイズ用のCSSタグです↓↓↓

/* skinHeaderArea ブログヘッダー980pxエリア */
.skinHeaderArea{
background:url(http://stat.blogskin.ameba.jp/blogskin_images/20150421/09/07/rI/g/o09800387webmocca1429576288422.gif) left top no-repeat; /* 背景 */
height:387px; /* 高さ */
margin-bottom:10px; /* 記事エリアまでのスペース */
}/* ←ブログヘッダーに背景画像を敷きたいとき */


/* ヘッダー画像にリンクを張る */
h1.skinTitleArea a{
  width:980px;/* 画像の横幅 */
  height:387px;/* 画像の高さ */
  display:block;/* ブロック要素とする */
  position:absolute;/* 位置を固定 */
  text-indent:-9999px; /* テキストを範囲外へ移動 */
}

/* 説明文を非表示 */
.skinDescriptionArea{
  display:none; /* 非表示にする */
}

↑↑↑↑↑↑↑ここまで。


上記全部、CSS編集の一番下にコピペして、

赤字の部分をご自身の画像保存場所のURLにするだけで、

ヘッダー画像がオリジナルになり、

ヘッダー画像を押すとTOPに戻り、

ブログタイトル、ブログの説明などのテキストが非表示になりますなっ・・・なんと!


オリジナル画像は、ご希望がありましたら制作します。

サイズは980×300 または 980×387で、3,500円(外税)~

画像などはご用意いただいたものを使います。

商業利用の画像のご紹介もいたします。

ご興味がありましたら、メールフォームからお願いします。


*-*-*-*-*-*-*-*-*-*
植物レンタルは木花に。
配達地域は東京都、埼玉県、千葉・神奈川の一部
ご贈答品は全国に配送いたします。
お見積もり、ご相談無料です。
048-462-0308