読者です 読者をやめる 読者になる 読者になる

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

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

ブログカスタマイズ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