劇的ブログ変身! | オリジナルヘッダー画像作成屋 -2ページ目

ヘッダー画像の設置方法1

07
Sep 2011



ホームページの制作もやったりしてます★Blacklion★です。
ですのでブログの更新が疎かになってしまっています。(はい、言い訳です)

本日は、「ヘッダー画像」についてとても初歩的というか、
これを知っておかないと使えないぜ!って事を書きたいと思います。

それでいて、結構お問い合わせでも頂く内容です。

ヘッダー画像の設置方法」です。

順を追って説明しますが、使っているテンプレートや他のブログサービスなど
仕様や要素名(これは後で説明します)などが違う事がありますが、
基本的には同じですので、参考にして頂ければと思います。

まず今から説明する条件についてですが、

・「ヘッダー画像」については既に画像を準備している物とします。
・アメーバブログの「css編集用デザイン」テンプレートを使用します。
・長くなりますので2回に分けて説明します。

それでは説明していきます。

使用するテンプレートを選択する。

アメーバブログの管理画面より
「ブログを書く」→「デザインの変更」と進みます。
するとブログデザインを探すという所に「カスタム可能」というジャンルがありますので
それを選択します。

「カスタム可能」デザインの中から今回は「CSS編集用デザイン」というのを選択します。
カーソルを持って行くと「表示を確認する」と出ますのでそのままクリックします。



すると画面が切り替わり「ブログデザインの表示確認・レイアウト変更」と出ます。



下にプレビューが出ていますのでそれを参考にお好みのレイアウトを選択して
「適用する」ボタンをクリックします。

すると「ブログデザイン適用完了」というページに画面が切り替わります。
一度自分のブログを見てみて下さい。適用されていますか??


次の画面では実際に「CSS」の編集を行いますが、
その前に「CSS」について少し説明します。(知ってるよって方は飛ばして下さい。)

CSSの説明を見る


ほとんどのホームページやブログサービスなどWEB上で見られるページは
「HTML」という言語で構成されている事がほとんどです。

難しい事は抜きにして「HTML」では細部まで一括してデザインを指定する事が困難なため、
「CSS」という別ファイルを読み込んで適用させています。

そうする事で「HTML」の簡素化と複数ページにおけるデザインの統一が簡単に可能となります。

「HTML」には「要素」と呼ばれるマークアップが行われています。
「ヘッダー画像を表示する場所ですよ」とか
「サイドバーを表示する範囲ですよ」などという目印を付けています。

その目印の事を「要素」と呼んでいて、
その「要素」に対してデザインを加えていく方法がほぼ主流だと思います。

つまり、「HTML」という家があるとすれば「CSS」は内装の役割ですね。

例えば、マンションを建設したが骨組みだけで内装が出来ていないとう時、
「玄関」や「キッチン」、「和室」などという「目印」がある事で、
マンション全体でその「目印」ごとに決められた内装工事が出来ます。

この「目印」が無いと全体を通して統一性のある内装には決してならないでしょう。

少しご理解頂けましたでしょうか??


それでは実際の「CSSの編集」は次の記事で。

次の記事へ


★Blacklion @ LionworksJapan★