賢威6.2 トップページ 投稿表示 箇所 影を付ける

 

賢威のトップページの各記事の投稿表示エリアは

h1タグで上下を区切られているのみで

左右に関しては何の区切りもない状態です。

 

また、

記事ページに関しても左右には区切りはありません。

 

 

シンプルなデザインなのでこのデザインに対して

アクセントを付けたいという要望は結構あります。

 

 

よって

今回は賢威トップページの投稿表示エリアと記事エリアに

枠線を付けたり、影を付ける方法を紹介していきます。

 

 

賢威トップページ投稿表示エリア、記事エリアに影の枠を付ける方法

 

ワードプレス管理画面より『外観』⇒『テーマの編集』にすすみ

『design.css』をクリックして一番下の行に

コードを追加するだけで投稿エリアや記事エリアに

枠をつけたり影を付けたりとデザインに

アクセントを付けることができます。

 

 

それでは追加するコードの紹介をしていきます。

 

 

 

投稿エリアや記事エリアに枠を付ける。

 

 

 

投稿エリアや記事エリアに枠を付け、影を付ける。

 

 

 

更に角を丸くする

 

 

 

上記コードを『design.css』に追加するだけですので、

非常に簡単にデザインを変えることができます。

 

 

現在の賢威のトップページデザインに

アクセントを付けたい。

 

 

他のブログと差別化したい。

 

 

という方は一度このデザインを

試してみることをおすすめします。

 

 

また、

賢威6.2の全パーツカスタマイズ一覧まとめページを作成しましたので、

他の箇所をカスタマイズされたい場合は一度見てみて下さいね。

 

⇒賢威6.2【全カスタマイズを一覧まとめ】ワードプレステンプレート