アメブロのカスタム

アメブロのカスタムをやってみました。

「CSS編集用デザイン」対応のテーマを選ぶことで、TOPのヘッダー画像や、見出しタグのカスタム、グローバルメニューの追加や、プロフィールの余分なところをカットなど、色々できるようです。

カスタム用テーマ

下のリンク先の「カスタム可能」デザインの中から、CSS編集用デザインを選ぶことで、CSSを編集することで、細かいところまでカスタム可能。

CSS編集用URL

フリースペース編集URL

CSSの「.skin-bgHeader」の項目を変更

.skin-bgHeader {
background:url(画像URL) #ffffff center no-repeat;
height: 400px; /*画像の高さ*/
}

今回は、実験的に雑に作ったので、TOP画像は変更するかもしれません。

プロフィールの丸い画像を、角丸に変更して、影をつける

.skin-profileAvatar img{
border-radius: 20px;
box-shadow: 5px 5px 5px #999999;
}

20pxの値を変更すると、微調整できます。

「.skin-blogHeaderNav 」の項目を探して以下に変更。

.skin-blogHeaderNav {
display: none;
}

アメブロにはお問い合わせフォーム機能がないようなので、フォームメーラーというサービスを利用。

無料版は、５個までで、フォーム内容の変更追加やデザインのカスタマイズも可能。

以下のサイトを参考にさせていただきました。