シンプルライフで楽に楽しく

小3息子・夫と暮らす主婦。毎日を楽しく暮らすために、モノを減らしたシンプルな生活を目指します。

ブログカスタマイズ5つ(パソコン版)。タブメニュー、カテゴリーデザインなど

スポンサーリンク

office by pixabay

 

2月の目標である、ブログのカスタマイズを行いました。

 

目次

  1. タブメニュー
  2. カテゴリーのデザイン
  3. シェアボタン
  4. ヘッダとフッタの非表示
  5. 続きを読むボタン

 

タブメニュー


少ないスペースで多くの記事を紹介できる便利なメニューですね。

サイドバーに設置しました。

本当は「はてブ順」も作りたかったのですが、うまくできませんでした。

サイドバーにタブメニュー

 

ゆきひーさんの記事を参考にしました。

www.yukihy.com

 

 

カテゴリーのデザイン


カテゴリーが目立つように色をつけ、タグっぽくしました。

カテゴリーデザイン変更

 

あくあのーとさんの記事を参考にしました。 

nohack-nolife.hatenablog.com

角を丸くする方法は、シェア猫さんの記事を参考にしました。

rascal0403.hatenablog.com

 

 

シェアボタン


サイドバーと記事下に設置しました。

シェアボタン(サイドバー)

シェアボタン(記事下)

 

こちらもゆきひーさんです。

www.yukihy.com

 

何種類かあるうちのかわいい丸型にし、CSSを少し変更しました。(text-align:centerをなくして左揃えに)

 

 

ヘッダとフッタを非表示


先日ブログテーマをInnocentに変更してから、ヘッダとフッタの黒い部分が気になっていたので、非表示にしました。

ヘッダ
PCヘッダー非表示前

フッタ
PCフッター非表示前

     ↓↓

変更後、スッキリしました。

PCヘッダー非表示

 

敷島久之さんの記事を参考にしました。

wepli-dot2.hatenablog.com

 

 

続きを読むボタン

 

「続きを読む」ボタンと文字色を変更しました。

続きを読むボタン変更

 

Innocent の作者である半月さんのサイトを参考にしました。

moonnote.hateblo.jp

 

カスタマイズ方法を丁寧に紹介してくださるブロガーの皆さんのおかげで、よりよいデザインにできました。いつもありがとうございます。

以上、パソコン版カスタマイズをご紹介しました。

 

スマホのカスタマイズ記事はこちらです。

rakunitanoshiku.hatenablog.com