1more!

+1 Lifestyle Blog. 趣味を多方面に愉しむブログ。

【Ï】ブログ改造記4~ヘッダ周りを修正しました~

スポンサーリンク

photo credit: Hadock via photopin

どうも!Hayabusa(@hayabusa_823z)です。今回は不定期で毎回お送りしている当ブログのカスタマイズ備忘録です。

今回の修正内容

  • ヘッダメニューのカテゴリー表示の修正
    CSSヘッダメニューを活用して、展開式のメニューを設置していましたが、記事リンクなどと被り正しく表示できなかったため、記事リストページを新たに作成しました。今後はヘッダメニューの「カテゴリー」を選択するとカテゴリーページに移動します。

  • ヘッダメニューの背景色・ページ全体の背景色微調整
    背景色をインディゴブルーから、明るめの青系の配色に変更しました。 また、背景色においては、薄めの青に変更し、デザインを微調整しています。

  • 「おすすめ記事」欄の追加
    ヘッダメニューの下に設置。忍者ツールズを活用し、おすすめ記事を6件表示するようにしました。

  • ヘッダメニューに「Contact」の項目追加
    いわゆるお問い合わせフォームを設置しました。当ブログへのご意見やご指摘などございましたら、フォームから連絡を頂けると幸いです。

  • 記事の見出しデザインを調整
    以下のサイト様から、コードを拝借させて頂きました。 h2見出しタグに適用しています。

CSSの擬似要素を使った見出しデザイン|Webpark

今回の更新内容は以上になります。
次回移行は、もうすこしCSSやJQueryを活用したレイアウトのカスタマイズに挑戦していきたいと思います。