この記事は、
『アメブロカスタマイズはしたいけど、まだプロに頼むほどでもない。でも自分でできる範囲で、ちょっとやってみたい！』という方向けに、
誰でも簡単にできる、必要最低限のアメブロカスタマイズ方法をご紹介します。
※この記事はすべてパソコン上でのお話です。
※2016年3月の新CSS対応です。（プロフィール写真が丸いもの）
2種類のアメブロデザイン
アメブロのデザインには、
- カスタマイズ可能なもの
- カスタマイズできないもの
の２種類があります。
１，カスタマイズできないもの
あらかじめデザインされたものを当てはめるだけの簡単なもの。季節ごとに変えたり、気軽に設定できます。カスタマイズしていない方はこの方法でお好きなデザインを設定しています。
２，カスタマイズ可能なもの
例えば、全体のデザインは気に入っているけどヘッダーにオリジナルの画像を入れたい、色だけ変えたい・・
そんな時は、カスタマイズ可能なデザインを選んで、自分で設定することができます。
カスタマイズ可能デザイン
上記であげた２，カスタマイズ可能のデザインの中にも、2種類あります。
- 最初からデザインがついていて、CSSをいじらなくてもヘッダーや背景を変えられるもの
- 全くシンプルで、自分でCSSを編集していくもの
CSS（Cascading Style Sheets、カスケーディング・スタイル・シート）とは、ウェブページのスタイルを指定するための言語です。
まずは、一番簡単な①の方法をご紹介します。
『アメブロのヘッダーをオリジナルのものにしたい！』ぐらいでしたら、この方法が簡単なのでオススメです。
CSSをいじらないカスタマイズ
↓このデザインが・・・
↓こうできます。
さっそく方法をご紹介しますね。
①「設定」ー「デザインの変更」をクリック
②一番下にある「カスタム可能」をクリック
③一覧の中から、ベースにしたいデザインを選びます。
ここでは、「Simple Flower」を選びました。
※配置は変わる可能性があります。
④レイアウトの画面が表示されるので、お好きなカラムとメニュー配置を選び「適用する」をクリックします。
④デザインを簡単カスタマイズするをクリック
ヘッダー、タイトル、背景を変更できる画面が表示されます。
まずは、わかりやすい背景から変えてみます。
背景を変更する
「背景」の「画像をなしにする」をクリックします。
すっきりします。
背景は、オリジナルの画像にしたり、色をつけたり、テンプレートから選ぶことも可能です。
ヘッダー画像を変更する
オリジナルのヘッダー画像に変更したい方は、まずは自分で文字なしの横長の画像を用意します。
サイズは幅が980ピクセル、高さは300ピクセルまでです。
通常の写真とは縦横の比例が違うのでそのまま入れてしまうと、
こんなことになります。
横長画像の作成方法は、こちらの記事を参考にしてください
【パソコンで作る場合】
【スマホで作る場合】
①作成したヘッダー画像をアップロードします。「オリジナルの画像」をクリックして、保存した画像をアップロードしてください。
②追加された画像の上をクリックすると設定できます。
オリジナルのヘッダー画像が設定できました。
タイトル文字の位置や高さなどを変更できますので、画像に合わせて調整してみてください。
これだけで充分！という方は、
こんな感じでお好きなカスタマイズ可能デザインをベースにチャレンジしてみてくださいね。以上です。
〜その他のアメブロカスタマイズ〜
タイトル画像に文字を入れたい！
サイドバーや記事タイトルのラインや、文字を好きな色にしたい！
スマホでメニューバーを表示させたい！
まとめ
・アメブロデザインの中には、デザインを編集できるものとできないものがある。
・デザインを編集できるものの中にも、CSSを編集せずにカスタマイズできるものと、CSSの編集をしないとできないものがある。
・CSSを編集せずにカスタマイズできるものは、制限はあるが難しい知識なしで簡単にできる。
・ヘッダー画像に好きなフォントでタイトルを埋め込みたい、細かい部分の色を変えたい！といった場合には、CSS編集可能なデザインを選ぶ必要がある。
