アメブロのヘッダー画像を設置する方法（ＣＳＳ編集用デザイン以外の場合）

こんにちは。
『やさしいブログの作り方』の松田です。

アメブロのカスタマイズは基本的に「ＣＳＳ編集用デザイン」というデザインスキンを選択した場合のみ、細かなカスタマイズが可能になります。

ただ、それ以外の「カスタム可能」のカテゴリに分類されているデザインスキンは、ヘッダー画像を簡単に設置する機能が用意されています。

今回は、ＣＳＳ編集用デザイン以外のカスタム可能デザインスキンの場合に、ヘッダー画像を設置する方法をご紹介します。




まず、デザインの変更→カスタム可能をクリックします。




カスタム可能の中の「ＣＳＳ編集用デザイン」以外のものを選択して下さい。




カラムのパターン（サイドバーの配置）は好みのものを選択して、「適用する」をクリックします。




適用できたら、「簡単カスタマイズ」をクリックします。




左側のヘッダー画像欄の「オリジナル画像を使う」をクリックします。




ファイルを選択から、アップロードしたいヘッダー画像を選択し、アップロードします。

無事アップロードできたら、その画像をクリックし、プレビューに反映されたら×ボタンを押して閉じます。

・ヘッダー画像は５つまでしかアップロード出来ないので、すでに５つ登録されている場合は、不要なものを削除してから再アップしてみてください。

・時折png形式の画像がアップロード出来ない場合があるようです。その場合は画像を一旦コピーして、名前をつけて保存→ファイル形式をpngからjpgに変えたものを再アップしてみてください。

画像がアップ出来たら、

・画像の配置位置を中央に。
・画像の高さを３００ｐｘに。
・ブログタイトルと説明文の表示位置を９９９ｐｘに。

して保存します。




これで無事完成です。＾＾


あとはオプションとして、ヘッダー画像をクリックするとブログトップへリンクするカスタマイズをご紹介します。

サイドバーのフリースペース編集を開いて、以下の記述をコピペして保存して下さい。

<style>.skinBlogHeadingGroupArea {padding-top:0px;}.skinBlogHeadingGroupArea,.skinTitleArea{margin:0;padding:0;}h1.skinTitleArea a{width:980px;height:300px;display:block;position:absolute;text-indent:-9999px;}h2.skinDescriptionArea{display:none;}</style>

ＣＳＳ編集用デザイン以外のカスタム可能デザインは、背景やサイドバーのデザインがすでにされているので、細かい設定が苦手な方はこちらの方法をオススメします。＾＾


最後までお読みいただきありがとうございました。

４つの無料メール講座配信中

これからブログを頑張っていきたい！ まずは基本から。
やさしいブログづくりのための、やさしいメール講座（全１０回）

「来てよかったです！」と言われるイベントにするために。
少人数イベント実施のための５つのステップ＋αが学べる無料メール講座（全１０回）

メルマガ、やってみたいけどどうすれば？という方へ
初めてでも安心して始められる、ステップメールの作り方メール講座（全１０回）

パソコンワーク、もっと時短できますよ。
ブロガーさんのための、パソコンワーク時短術１０の技メール講座

２０１６年１月１１日、出版しました！

ブログでビジネスを軌道に乗せるための行動術

ブログを続けていてよかった、そんな気持ちを一人でも多くの人と共有したいと思っています。＾＾