タイトル・ヘッダー画像の変更1回目(アメブロカスタマイズ) | ショボーンなWEBディレクター目指し中!!

ショボーンなWEBディレクター目指し中!!

WEBディレクターとして毎日ショボーン(´・ω・`)としながら勉強しています。まだまだなりたてなショボーンディレクターから(`・ω・´)キリディレクターになるため日々精進中です☆


ノーマルのブログデザインにあきてきたのでちょっとデザインを変えていきます。

一気に全体を変更してしまうと時間がかかって更に途中であきらめて止める確立が高いので、少しずつカスタマイズをしていきます♪

今回はヘッダー画像・タイトルの変更です



作業自体は15分もかからずどちらかといえば説明に時間がかかってしまうので複数回に分けて説明します。

自分がこれから行うカスタマイズは本当に初歩の初歩です。
JSで何かしたりとかいうのはあまりやらないつもりです。「アメブロ カスタマイズ」で検索すれば沢山の方法がありますので僕のはあくまでもこういうやり方をする人間もいるんだ位に思ってください。

HTMLやCSSのコーディングにさまざまや方法があると同じに自分も自分流のカスタマイズをしているのでやり方が正しいか間違えているかというのは全然気にしていきません。
*備忘録という意味合いも兼ねておりますので


では、あめぶろのカスタマイズに必要なものを簡単に準備します。

・テキストエディタ


気合でメモ帳でやるのもいいですがsakuraエディタやテラパッドがいいと思います。
自分は使い慣れているのでDreamWeaverを使用していますが、、、

・ブラウザ


Firefoxを使用しています、というのもFirebugでID名、クラス名を簡単に見つけれるのでCSSのどこをいじればいいか直感的にわかるからです。
chromでもbugはありますが、自分はあまり操作性がなれないので狐愛用者です。


・根気


正直根気がない自分がこのブログを立てていき完成できるか非常に謎ですw

・Html・CSSの知識


HtmlはなくてもいいけどCSSの若干の知識は必要。
デザインをいじるのでプロパティの意味は理解している必要があります。


では、簡単にTOPの画像変更を説明します♪

とりあえず画像の作成



自分のこれからのブログの方向性を決めるために自分の職業であるWEBディレクターを入れた名前をタイトルにきめました。

画像自体はフォトショやフリーソフトでさくさくって作ってください。

$ショボーンなWEBディレクター目指し中!!


デザインは今回特に気にしませんw
3分で作成ですwww


画像のUPロード



画像のUPですが画像のUPなので

【記事の編集】→【画像フォルダ】

としそうですが、ここに置いたらダメです!
というのも画像を980PXで作っても圧縮され800PXまでしか表示できないのです・・・

デザインの変更なので今回はちゃんと適した場所に格納しましょう。

TOPの【デザインの変更】→【適用中のデザイン|CSS編集用デザイン>CSSの編集】

ここにheader,footerエリアの画像を格納する場所があります。

$ショボーンなWEBディレクター目指し中!!

ここに絶対パスが記述されているのでコピーして該当するIDにこのパスを入れればOK♪






どーやってこの画像入れればいいねん∑(´・ω・|||)



そーです。次はCSSをいじって自分が作成したオリジナルなメイン画像を入れるのです!
CSSの記述はまた次回ゆるーく書いて行きます^^


アメンバーの皆さん、このブログの主旨を変えていきます。
日常のことも書いていきますが自分の仕事柄の内容をアウトプットするような形で日記をつけていこうと思います。

ってな感じでよろしくーーー♪