サイドバーに枠線を付けるカスタマイズ | アメブロで個人事業主が集客するための方法

サイドバーに枠線を付けるカスタマイズ


あなたのアメブロが読者を魅了するオリジナルデザインにカスタマイズできる~簡単なCSS編集方法-記事用自分


--------------------------------------------------------------------------
このカスタマイズでは、プラグインの枠線まで付けることが出来ません。
このカスタマイズの修正記事をアップしましたのでご確認ください。

ご迷惑をおかけしまして申し訳ございません。

修正記事はこちら
サイドバーのカスタマイズの修正点

---------------------------------------------------------------------------
今回は、サイドバーに枠線を付けるカスタマイズ方法をご紹介します。

まず、サイドバーの枠線とは?

アメブロをオリジナルデザインにカスタマイズ~簡単なCSS編集方法-サイドバー枠線説明 当アメブロでは、
矢印→の部分です。

これを付けると、
・全体的なバランスが良くなる
・サイドバーの視認性が良くなる

ので効果的です。

※ただ、
これはスキンによっては
しつこくなる可能性がありますので、
一度設置してプレビューで
ご確認する事をおすすめします。




では、サイドバーに枠線を付けるカスタマイズスパナ

以下のタグを【CSS編集画面】に追加します。
  !CSS編集画面でタグを追加する方法 はこちらです。

付箋(赤)『追加するタグ』はこちらから。

↓↓↓この下から↓↓↓
/*サイドバーメニュー枠線*/
.mainMenu{
border:2px solid #D3D3D3;
margin:15px 5px;
padding-top:0px;
}
/*サイドバーメニュー枠線・ここまで*/
↑↑↑この上まで↑↑↑


青文字の部分にあなたのお好みの色コードを指定してください。
 ▲色を変更する方法 はこちらです。

赤文字の部分
の数字を変えることにより、線の太さを指定します。
当アメブロでは細めに設定しておりますので2px。
太めに設定するにしても3pxもあれば十分だと思います。

プレビューで確認しながら設定してください。


<< 関連記事 >>
▲アメブロ ヘッダー画像の変更方法
▲記事内のリンクを自動で強調する方法
▲【無料素材】矢印 アイコン リストマーク用
▲【無料素材】色んな アイコン リストマーク用