アメブロデザインテンプレートFAQ（ヘッダー）｜アメブロテンプレ購入者専用ページ

Frequently Asked Questions

        <h1>魅せるアメブロデザインテンプレートFAQ</h1>
        <h3>ヘッダーについて</h3>
    ・<a href="#1">ヘッダーの画像を変更したい</a><br />・<a href="#2">ヘッダー画像を自分で作る場合のサイズは？</a><br />・<a href="#3">ブログタイトルの位置を調整したい</a><br />・<a href="#4">ブログタイトルを非表示にしたい</a><br />・<a href="#5">ブログタイトルの文字はどこで変更できるの？</a></p>
        <a href="">ヘッダーの画像を変更したい</a>
    <p>まず、ヘッダー画像を準備したら画像をアップロードして<br />画像のURLを取得しておいてください。

次にCSS編集を開き、

background-image: url(画像URL);

の赤字部分に新しい画像のURLを入力してください。

※（かっこ）は残す

【参照】
画像をアップロードしてURLを確認する方法

/* ヘッダー背景 /
.skin-bgHeader {
background: no-repeat scroll center top;
background-image: url(画像URL);
background-size: 1120px 400px;
height: 400px; / ヘッダーの高さ */
}

▶︎ブログタイトルや説明を非表示する場合はこちら

ヘッダー画像を自分で作る場合のサイズは？

アメブロのヘッダーサイズは「横幅1120px、縦幅400px」が最適です。

Canvaで作成する場合は、［デザインを作成］からカスタムサイズで作成しましょう。

ブログタイトルの位置を調整したい

CSS編集を開き、「(2-2) ヘッダータイトル、説明文」にある
/* ブログタイトル /、/ ヘッダータイトル */の数字を動かしたい位置に変更します。

ピンクの設定では
・タイトルと説明文の間10px
・上から80px
・下から80px
・文字は中央揃え

/* ブログタイトル */
.skin-blogMainTitle {
color: #333333;
margin-bottom: 10px;
font-size: 27px;
}

/* ブログ説明文 */
.skin-blogSubTitle {
color: #999999;
font-size: 16px;
}

/* ヘッダータイトル /
.skin-headerTitle {
padding-top: 80px;
padding-bottom: 80px;
text-align: center;
}

ブログタイトルを非表示にしたい

CSS編集を開き、「(2-2) ヘッダータイトル、説明文」にある
/ ヘッダータイトル */のプロパティを元の内容を削除し、以下を追記してください。