アメブロのヘッダー画像を設置する

アメブロの ヘッダー画像を設置する 方法を解説します。
 
 

 

1.ブログ管理

①【デザインの変更】をクリックしてください。

 

2.デザイン変更

②【CSSの編集】をクリックしてください。

 

3.画面スクロール

③ デザインCSS画面を一番下までスクロールしてください。

 
次に、CSSタグをコピー&ペーストします。

 

4.タグをコピーする

④ 以下のCSSタグをコピーしてください。

/* ヘッダーの背景色とヘッダー画像 */
.skin-bgHeader {
background: no-repeat scroll center;
background-color: #fff;
background-image: url(【画像URL】);
}
/* ヘッダーの横幅 */
.skin-bgHeader [amb-layout=”headerInner”] {
width: ★px;
}
/* ヘッダーの高さ */
.skin-bgHeader [amb-layout=”headerInner”]>a {
height: ★px;
}
/* ブログタイトルと説明文非表示 */
.skin-headerTitle {
display: none;
}

 
 

5.タグをペーストする

⑤ CSSタグの一番最後にタグをペースト(貼り付け)してください。

※ブログタイトルと説明文を表示させたい場合は下記のタグを削除してください。
/* ブログタイトルと説明文非表示 */
.skin-headerTitle {
display: none;
}

 
次に、ヘッダーに表示する画像をアップロードします。

 

6.画像をアップロードする

⑥【ファイルを選択】から画像をアップロドしてください。

 

7.画像パスをコピーする

⑦ 枠内の画像パスをコピーしてください。

 

8.タグの編集

ステップ5でペーストしたCSSタグを編集します。

⑧ 【画像URL】に画像パスを上書きしてください。
⑨ ★に横幅のサイズを上書きしてください。
⑩ ★に高さのサイズを上書きしてください。

 

9.保存

⑪【保存】をクリックしてください。

 

10.設置完了

お疲れ様です。ヘッダー画像の設置が完了しました。