無題で行こう

気の向くままに書きたいことを書いていきます。とりあえず無題でいきましょう。毎日いろいろありますよね♪

MENU

はてなブログの簡単カスタマイズ技まとめ

f:id:kay72234:20151115130329j:plain

■はじめに

筆者がはてなブログで自分のブログを立ち上げてから、あれこれとデザインのカスタマイズを行ってきました。基本はスタイルシートのコピペとわずかな修正ですが、けっこう多様なカスタマイズが可能だということが分かりました。
これまで、筆者が実際に行ってきたカスタマイズをそれぞれ記事にしてきましたが、記事の数が増えてきたので、インデックス代わりにまとめることにしました。前提としては、全て無料版のはてなブログでもできるものばかりです。

■①レスポンシブデザインの適用

はてなブログは、PC向けのデザインと別にスマホ向けのデザインが準備されており、スマホからアクセスすると、自動的にスマホ向けのデザインを表示してくれます。したがって、デザインのカスタマイズはPC向けとスマホ向けそれぞれに対して行う必要があります。また、無料版のはてなブログでは、スマホ向けのデザインを変更することができません。
しかし、レスポンシブデザインを適用すると、スマホに対してPC向けのデザインを表示することができるようになります。


■②見出しの変更

普段何気なく使っている見出しですが、見出しのデザインやカラーリングを変えるだけで、ブログの印象がぐっと変わります。方法は簡単、スタイルシートにコードをコピペしたら、後は自分の好みに合わせて修正するだけです。


■③本文の変更

ブログの記事本文の文字サイズは、人によっては気になるポイントだと思います。選んだデザインテーマによっては、デフォルトの文字サイズがしっくりこないこともありますので、そんな時は自由に変更してみましょう。


■④ブログタイトルの変更

ブログのタイトルは、アクセスしてくれた人の目に常に触れる箇所です。ブログの玄関とも言えるブログタイトルには、特にこだわりを持ってカスタマイズしてみると良いですね。


■⑤引用文の変更

引用文のデザインも、スタイルシートを使って簡単に変更することができます。ブログ全体のイメージやカラーリングに合わせて、引用文のデザインも変更すると効果的です。


■⑥サイドバーのデザイン変更

本文や見出しのデザインを変えると、サイドバーのデザインも合わせたくなってくると思います。カスタマイズは、基本的に見出しの変更と同じ方法になりますので、ブログ全体のデザインを統一してみましょう。


■⑦ページャーのカスタマイズ

ページャーとは、次の記事・前の記事にページ送りするリンクのことです。この部分の表示がいまいちだったので、少し改善しました。その際の手法をまとめたものです。


■⑧グローバルメニューを配置する

タイトル下にグローバルメニューを配置すると、そのブログではどんなジャンルを扱っているのかが分かりやすくなり、ブログ内での回遊率アップにもつながります。


■さいごに

スタイルシートの修正などは一見すると難しそうなので、敬遠してしまう方が多いかもしれません。しかし、実際にやってみると案外簡単にできてしまうものです。紹介させていただいた中から、一つでも試してみられると良いかと思いますので、ぜひお試しください。


スポンサーリンク