アメブロカスタマイズ記事をまとめていきます。
コピペするだけでできるものがほとんどなので「Webとか全然わかんない！」という方も簡単にマネできます。
- アメブロのカスタマイズ方法
- 【やりたいこと別】コピペでできるアメブロカスタマイズ
参考になれば幸いです。
アメブロのデザインをカスタマイズする方法
アメブロカスタマイズの前提となる「CSS編集可能なデザイン」の設定方法について説明します。「もう知ってるよ」という方は読み飛ばしてください。
アメブロには次の3種類のデザインがあります。
- カスタマイズできないデザイン
- 簡単カスタマイズできるデザイン
- 詳細カスタマイズできるデザイン
カスタマイズ可能なデザイン（CSS編集用）を選ぶ
「ブログ管理」＞「デザインの設定」と選択します。一番したまでスクロールするとデザインカテゴリの一覧があります。
カスタマイズをする場合は「カスタム可能」カテゴリのデザインを選びましょう。
簡単カスタマイズ用とCSSカスタマイズ用
Cascading Style Sheets（カスケーディング・スタイル・シート）の略。
ウェブページのスタイルを担っているマークアップ言語。
デザインを決めるおまじないの認識でOK。
カスタム可能デザインにも2種類あり、簡単カスタマイズ用とCSSカスタマイズ用のものがあります。
- CSS編集用デザイン：詳細カスタマイズが可能なデザイン
- それ以外：簡単カスタマイズ用のデザイン
今使っているデザインがどっちかというのは「デザインの設定」画面の表示からも判別可能です。
できる範囲は決まっていますが、CSS編集用デザインならいろいろとカスタマイズできます。
簡単カスタマイズはちょろっとだけカスタマイズできる程度です。
- ヘッダー画像の設定
- ブログタイトル・説明文の配置
- 背景画像の設定
好きなデザインにカスタマイズしたい場合は「CSS編集用デザイン」を選びましょう。
基本的なアメブロのカスタマイズ方法
CSS編集用デザインを選ぶと「デザインの設定」画面から「CSSの編集」を選択することができます（上記参照）
ここにCSSを記述してカスタマイズしていきます。
【やりたいこと別】アメブロカスタマイズ
やりたいことから探せるアメブロカスタマイズの一覧です。
クリックで該当箇所にスクロールします。
フォント変更のカスタマイズ
アメブロのフォントをおしゃれに変更するカスタマイズ。
一気にブログが垢抜けて魅力的になります。
ヘッダー画像変更のカスタマイズ・ヘッダー画像作成
CSS編集用デザインでのヘッダー画像変更カスタマイズです。
標準サイズと横幅いっぱいサイズの方法を説明しています。
無料でできる簡単な画像作成方法も解説しています。これくらいのヘッダー画像なら早い人なら5分くらいで編集可能。
アメブロのヘッダー画像を変更する方法（通常Ver. / 横幅いっぱいVer.）
【無料・簡単】ヘッダー画像の作成方法
メニューバー（グローバルメニュー）を表示するカスタマイズ
アメブロにメニューバー（グローバルメニュー・グローバルナビ）を設置するカスタマイズです。
アメブロの記事やあなたに興味を持ってくれたユーザーに対して
- アメブロ内の見せたいページ
- サロンのホームページ
- ネイルギャラリー
- 予約フォーム
- あなたのInstagram
へ誘導するナビゲーションを作成できます。
CSSをコピペして、ちょっと編集したHTMLをフリースペースに追加するだけです。
サイドバーのデザイン変更カスタマイズ
CSSをコピペするだけでできるサイドバーのデザイン変更カスタマイズです。
色違い含め16種類のデザインから選べます。
色の変更方法も解説してるので、自分好みの色にカスタマイズすることも可能。
見出しのデザインカスタマイズ
準備中です。
囲み枠のカスタマイズ
準備中です。
メッセージボードのデザインカスタマイズ
アメブロのメッセージボードカスタマイズです。
CSSのコピペで実装できるデザインを21種類用意しました。
背景色や枠色、フォント色の変更方法も解説しているので、自身のブログに合わせてカラーカスタマイズも可能です。
アメブロメッセージボードのデザインカスタマイズ
色の変更方法
記事下に定型文を表示するカスタマイズ
準備中です。
アメブロカスタマイズまとめ
Webに詳しくない方でも簡単にできるカスタマイズを紹介しました。コンテンツについては随時追加予定です。
「こういうカスタマイズが知りたい！」という要望があればコメント頂ければ対応できるかも？です。
最後まで読んでいただき、ありがとうございました。
