アメブロカスタマイズ用スキン「CSS編集用デザイン」に変更する方法

アメブロカスタマイズ用スキン「CSS編集用デザイン」に変更する方法

アメブロカスタマイズのわざめーばです。

こんにちは。

アメブロには自由に選んでそのまま使える豊富なデザイン(スキン)が用意されていますが、自由にカスタマイズするためのものは、実は一つしか用意されていません。

それは、CSS編集用デザインというスキンです。

本ブログで紹介しているアメブロカスタマイズ方法も、多くは、このCSS編集用デザインが使用されていることが前提となっています。

そこで、本記事では、ご自分のアメブロにカスタマイズ用スキンであるCSS編集用デザインを適用する方法をご紹介します。

アメブロカスタマイズのスタート地点とも言える作業ですので、ぜひマスターして下さいね。

なお、アメブロでは、デザイン(スキン)やレイアウト(サイドバーの位置や数)を変更すると、ブログヘッダー画像の設定や背景画像の設定など、それまでのカスタマイズ内容が破棄されてしまいますのでご注意ください。

それでは、以下、実際にCSS編集用デザインを適用する手順を説明です。

アメブロのスキンを「CSS編集用デザイン」に変更する手順

まず、まず、マイページの右上の方にあるすべてのAmebaサービス一覧を開くアイコンをクリックし、開いた小窓の中にあるデザインの変更をクリックします。


デザインの変更ページが開いたら、ページの右下の方にあるカスタム可能ボタンをクリックします。


「カスタム可能」デザイン一覧ページが表示されたら、その中からCSS編集用デザインをクリックしてください。


すると、別のタブ(あるいは別ウィンドウ)が開き、ブログデザインの表示確認・レイアウト変更というページが表示されます。

ここでは、レイアウト(サイドメバーの位置や数)を5種類の中から選択できますので、お好みのレイアウトを選択して適用するボタンをクリックします。

(メニューを辿らず、直接CSS編集用デザインのレイアウト変更から始めることもできます)


デザイン適用完了ページに変わり、CSS編集用デザイン」を適用しましたと表示されれば完了です。

ここで、ブログを確認するボタンをクリックすると、ご自分のアメブロにCSS編集用デザインが適用されて、非常にシンプルなデザインになっていることが確認できます。

また、CSSの編集をするボタンをクリックして、この後すぐにユーザーCSSの編集によるアメブロのカスタマイズをすることも可能です。


以上、アメブロにカスタマイズ用スキンであるCSS編集用デザインを適用する手順をご紹介しました。

どうぞ参考になさってください。

関連記事

CSSを編集してアメブロをカスタマイズする方法
「選択されたスキンではCSSが編集できません。」と表示されたとき
アメブロカスタマイズ目次
アメブロカスタマイズで成功するブログを作ろう トップページ

2014/01/05 アメブロの仕様変更に合わせ画像と操作説明の一部を変更しました。
2012/11/18 若干の修正を加えて復活させました。
2012/08/25 アメブロカスタマイズ図書館へ移動しました。
2012/07/01 新マイページ対応に修正しました。
2012/03/06 全面修正&再アップしました。