・ヘッダーの画像を変更したい・ヘッダー画像を自分で作る場合のサイズは?・ブログタイトルの位置を調整したい・ブログタイトルを非表示にしたい・ブログタイトルの文字はどこで変更できるの?
まず、ヘッダー画像を準備したら画像をアップロードして画像の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) ヘッダータイトル、説明文」にある/* ヘッダータイトル */のプロパティを元の内容を削除し、以下を追記してください。
/* ヘッダータイトル */.skin-headerTitle {display:none;}
ブログタイトル・ブログ説明はアメブロの基本設定から行えます。
ブログ管理→[設定・管理]→[基本設定]
このページの先頭に戻るFAQ一覧に戻る