アメブロには、もともとかわいいテンプレートが用意されてますが、自分でオシャレにカスタマイズができたらなぁ~って思いませんか?
アメブロは多くの人たちが利用しており、素敵にカスタマイズしている方も多く憧れますよね。
カスタマイズされたブログは、訪れた人にとって忘れがたい印象を残し、何度も訪れたくなる魅力的な場所になり得るのです。
この記事では、アメブロをただ「使う」のではなく、アメブロのデザインを自分好みのおしゃれなデザインにカスタマイズする楽しさと自分でカスタマイズする方法を解説しています。
アメブロをオシャレにカスタマイズするための初期設定
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women-150x150.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women-150x150.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women-150x150.jpg)
カスタマイズって難しいですか?
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
まずは、初期設定からしていきましょう!
アメブロカスタマイズをしていくためには、まず「CSS編集可能なデザイン」に変更していきます。
アメブロにログインし、「ブログ管理」をクリック。
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h18_44-1024x665.png)
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h18_44-1024x665.png)
「設定管理」をクリック。
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h26_03-1024x657.png)
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h26_03-1024x657.png)
「デザインの変更」の画面になります。
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h28_42.jpg)
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h28_42.jpg)
スクロールしていくと↓のような画面になります。「カスタム可能」をクリック。
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h29_11.png)
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h29_11.png)
赤枠のCSS編集用デザインから、お好きなデザインを選択します。
![](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h31_51.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h31_51.jpg)
CSS編集用デザイン 3タイプの違い
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
CSS編集用デザインは3タイプあります。
1.リスト表示
タイトル・日付・画像・冒頭文が表示されます。
クリックしないと本文記事を読むことはできません。
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
スマホと同じような表示になります。
2.スタンダード表示
一般的なブログの表示です。
すぐに記事が読めます。
3.タイル表示
画像とタイトルが表示されます。
リスト表示と同様、クリックしないと記事を読むことができません。
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
Instagramに近いイメージでしょうか。
どの種類を選択するかは、好みの問題もありますが・・・
もっとも記事を読んでもらいやすいのは、スタンダード表示なります。
リスト表示やタイル表示は、クリックしないと記事が読めないため、画像やタイトルから読んでみたいと思わなければ、興味をもたれずにスルーされてしまうことも。。。
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
スタンダード表示がオススメです。
新デザインと旧デザイン
アメブロには『新デザイン』と『旧デザイン』2種類のデザインがあります。
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women-150x150.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women-150x150.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women-150x150.jpg)
新デザインと旧デザイン、何が違うんですか?
旧デザイン
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_14h30_13.png)
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_14h30_13.png)
新デザイン
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_14h28_30.png)
![アメブロ](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_14h28_30.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
一番わかりやすいのはプロフィール欄でしょうか。
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women-150x150.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women-150x150.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women-150x150.jpg)
旧デザインを使いたい場合は、どうしたらよいですか?
↓青枠のCSS編集用デザインが旧デザインになります。
![](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h32_52.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/04/2023-04-07_13h32_52.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
わたしはヘッダーの横幅が広い新デザインを使ってます!
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women1-150x150.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women1-150x150.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/women1-150x150.jpg)
画像が大きい方が素敵ですよね♪
新デザインのスタンダード表示にしてみたいです!
初期設定が終わったら、それぞれのパーツごとに設定を行っていきます。
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
![](https://ekubo-blog.com/wp-content/uploads/2023/07/ekubo-3-150x150.png)
デザイン作製にはCanvaがおすすめです!
![](https://ekubo-blog.com/wp-content/uploads/2022/09/2edd81d03337177364f1f3554c649d2c-3-300x158.jpg)
![](https://ekubo-blog.com/wp-content/uploads/2022/09/2edd81d03337177364f1f3554c649d2c-3-300x158.jpg)