このコラムは連載コラムです。過去の記事は上記のアメブロカスタマイズガイドまたは、以下の記事をご覧ください。前回の記事はこちらです。まだ見ていない方はこちらから見ていただくとより理解が深まるかと思います。

ヘッダーに画像を挿入する方法を解説

では早速はじめましょう。今回も前回に引き続きCSS編集用画面の(3) エリアのスタイルブロックの中の、「(3-2) ブログヘッダー」のを解説します。第5段となります。今回からは前回までの解説を総括し、ヘッダーに画像を挿入する方法を解説します。

これであなたのブログは一層華やかになることでしょう。

目を惹くブログに一歩近づけるようにがんばりましょうね☆

ヘッダーに画像を挿入する方法

では早速ヘッダー画像を挿入しましょう！！！といいたいところなのですが・・・

今回はまずはヘッダーに画像を挿入する際に確認するべきことをまず解説します。

設置は次回に解説します。すみません・・・

あたりまえの確認事項ですが、早速簡単に2点解説します。

その１　そもそもヘッダー画像がない・・・

ヘッダー画像がない場合は作らなければいけませんが、一番簡単なのはご自分の好きな写真をヘッダーにすることです。そしてそれもないという方の為にこのコラムでは緑の葉っぱの画像をご用意しています。これからの解説ではこの画像を使っていきますので、よろしければそちらもダウンロードして使ってください。そしてご自分で作りたという方の為に優良なサイトもご紹介いたしますのでそちらもご確認くださいね♪

 その２　画像が用意できたらヘッダー画像の大きさをチェックしましょう

画像配置をする際はどんな画像でもそうなのですが、まずあなたが設置したい画像の大きさは縦の寸法と横の寸法がいくつなのかを把握する必要があります。

この大きさを把握していないと画像の配置はうまくいきません。アメブロカスタマイズで使う画像は縦方向はいくらでも構いません（あまり高すぎるとブログが見ずらいです・・・）が、横方向は最大980px（設定でいくらでもかえられるがこの幅以内が望ましい）までです。

ですので、もしその幅よりも大きければ、修正をする必要があります。上で紹介したサイトの画像編集ソフトでサイズ調整をするか、ウィンドウズの場合付属のペイントのソフトがありますので、そちらで拡大縮小を行ったり、切り取りをして画像の調整をしてみてください。

画像の大きさはどうやって確認するの？

以下の方法で確認してみてください。パソコンによって若干画面が異なります（わたしのパソコンはウィンドウズ７ですので・・・）

①画像の上にマウスを置くと大きさが表示される

②画像の上で右クリックし、「プロパティ」をクリック「詳細」タブで確認できます。

これでヘッダー画像を挿入する準備が整いました。

今回はここまでとします。

次回はこのブログでダウンロードできる葉っぱの画像（あなたの用意した画像があればそれを使ってください）を使ってヘッダーに画像を挿入する方法を紹介します。

画像はzip形式の圧縮ファイルになっていますので解凍してお使いください。