Blogger用テンプレートVaster2のカスタマイズ記事です。
この記事は、ブログの一番上の部分（ヘッダー、ブログの名前の部分）の背景を画像にする方法を解説しています。
修正前後の見本
修正前
ブログ名「あかりlog」の背景が真っ白です。
（真っ白すぎてどこが記事の背景との境かわかりにくいですね…）
修正後
ブログのヘッダー画像が設定できました。
それ以外にも、全体のバランスを見て、ヘッダー部分を少し縦に長く、ブログ名を少し下に調整しています。
修正方法
1. Vaster2のテンプレートから以下の部分を探します。
#header-inner{……}
注意：2か所ありますが上のほうです
2. ｛｝の中に以下を付け加えます。
background-image: url(“画像のURL”);
”画像のURL”には、背景にしたい画像をアップロードしたURLを書いてください。
bloggerにアップした写真（Googleのアルバムに保管された写真）ももちろん使えます。
3. 画像が変形していて気になる方は以下を付け加えます。
background-size:cover;
画像の縦横比を変えずに、縦か横どちらかが100％になるようにトリミングします。
このほかに以下のものが使えます（それぞれcoverの部分に置き換えてください）。
contain: 画像全体が入るように変形する（画像の縦横比は変化しない）
コメント
こんにちは。別の記事（サイドバーのカテゴリ並び替えについて）でも質問をさせて頂いた者です。
再度すみませんが、こちらの記事でも伺いたいことがあります。
背景を画像にするにあたって、私は、「ページヘッダー」のガジェットで、背景を画像にしてみました。そうしたら、画像があまりに大きく表示されてしまいます。
あかりさんの記事にあるように、#header-innerの部分を探してみましたが、私の場合、innerではなく、outerと記述されています。このouterをinnerに変更し、以下、background…を記述するのでしょうか。
お手数おかけしますが、ご回答いただければ幸いです。
こちらのご質問に関してはかなり自信がないので、私が実際に記述している方法をお伝えしますね。
Vaster2を使われているなら、基本的なレイアウトは同じはずなので、これをそのままコピペして使っていただいたら大丈夫なはずです。
この辺りの変更は私もかなり記憶が怪しく、もしかしたら#header-outerをいじったのかもしれませんが、もう思い出す方法がありません…。
【記述している部分】
/* ヘッダー
————————————— */
の下部分に書いています。
【記述している内容】
#header-inner{
width:1040px;
height:150px;
margin:0 auto;
padding-top:45px;
background-image: url("表示したい画像のアドレス");
background-repeat: no-repeat;
background-size:cover;
}
もし#header-inner自体がない場合、まるごと書き加えてみてください。
迅速なお返事、ありがとうございます！はい、Vaster2を使い始めて、そのカスタマイズの仕方を探っていて、こちらのサイトに出会いました。
やってみます。で、またご報告しますね。
とりあえず、御礼まで。
やってみました。
#header-outerに置き換えると、エラーになります。で、あかりさんの記述#header-innerを足すと、変化がありません。CSSとHTMLの配置の問題？ 今は、どのように質問してよいやら、わかりません。ほんとに、超初心者なので。せっかく教えていただいたのに、対応できない自分が悲しいです（泣）もうちょっと、頑張ってみます。結果、できなくても、こうして教えて頂いたことに対しては、とても嬉しく思っています。ありがとうございます。
お役に立てずに申し訳ないです…！
私の方でも調べてみますので、もし解決策が見つかりましたら追記しておきますね。
ただ、先の回答が私の精一杯なので、あまりご期待はしないでください…。
Akariさん、
申し訳ないなんて、とんでもないですよ！こうして、個人的な質問に、素早くお返事いただけて、嬉しく思っています。というか、カスタマイズの仕方を公開してくれているAkariさんのブログがあること自体、助かっていますから。重ね重ね、ありがとうございます。頑張りまーす！
はじめまして。
ブログ歴は長いのですがコンピューターに関しては全くの無知です。
説明が難しいのでお手数ですが実際にご覧になっていただければと思うのですが。
わたしのブログ、背景に画像を入れたのですが、ヘッダー周辺が白くてここをなんとかできないかと思っています
https://amanwithapast.blogspot.jp/
できれば
http://dolorosa-reveries.blogspot.jp/
このようにして、画像の周りに背景を配したいのです。
うまく説明できずに申し訳ありませんが、ヘッダー周囲を何とかしたいということです(汗）
もしよろしければまたわたしの説明がご理解いただければ、アドバイスをいただければ幸いです。
突然失礼いたしました。
Takeoさん
はじめまして。
せっかくいただいた質問なのですが、私のカスタマイズの記事は、「vaster2を実際に書き換えてみる」→「この方法でうまくいった！」という方法ですべて作成しているので、別のテンプレートはまったくわからないのです…。
（質問の意図はよくわかったのですが…！）
大変申し訳ないのですが、他の詳しい方にあたってみてください！