こんばんは。ひろあきです。
先日ブログをカスタマイズしてみましたのでその報告をしたいと思います。
ソーシャルボタンをおしゃれに
まずは一番気になっていたソーシャルボタンをカスタマイズしてみました。因みにソーシャルボタンっていうのは、ブログの記事の下にあるはてなブックマークやらFacebookやらTwitterに記事をシェアしてくれるボタンのことです。
カスタマイズするにあたって、参考にというかコードを丸パクリさせていただいた記事がこちら。
はてなブログ標準のソーシャルボタンってデザインに統一感が無く、前のブログの時から気に入らなくて、前のブログでも別のデザインでカスタマイズしてました。このカスタマイズしたソーシャルボタンは統一感があってとってもおしゃれです。
更にこのソーシャルボタンはスマホ版もあって、スマホの方のソーシャルボタンにはLINEでシェアするボタンもあります。
スマートフォン表示から不要なものを削除する
今やホームページのアクセス数の約半分がスマホからと言われており、実際自分の前のブログのアクセスの半分以上がスマホからでした。でも、はてなブログのスマホ表示って余計な物が多いんですよね。
そこでこちらの記事のコードをまたもやコピペして、不要なものを削除してみました。
消したのは、
- はてなブログ勧誘・記事を書く・記事の管理の削除
- はてなブログ開発ブログなどへのリンクの削除
の2ヶ所。これを消すだけでもスマホ表示がかなりすっきりします。しかも、これは消すためのコードもシンプルでわかりやすいです。スマホ時代の今、ちょっとした手間でかなり見栄えが違いますので、はてなブログをやってる人みんなにおすすめしたいです。
パンくずリストを設置する
パンくずリストというのは、このブログの記事タイトルの下にあるカテゴリのことです。これを付けるとSEO的に有利になると書かれていたので、1年後には月間10万PVを狙う自分としては付けなくちゃと思い、付けてみました。
実は前のブログにもパンくずリストのコードは貼っていたのですが、パンくずリストに表示するためのカテゴリの設定をちゃんとしていなかったので、無意味でした。今回コードをコピペさせていただいたこちらの記事はその辺がわかりやすく書かれていたので良かったです。
サイドバーにTwitterウィジェットを設置
このブログを始めるのと前後して、もう一度Twitterにも力を入れようということを実は決意してました。そんな訳で自分のツイートをブログで表示することにしました。参考にした記事はこちらです。
このウィジェットを設置するにあたっては、表示が遅くなったら嫌だなあと思っていたのですが、設置してもほとんど表示速度は変わらなかったので一安心です。
関連記事を表示する「あわせて読みたいG」を設置
同カテゴリーに関する他の記事を表示してくれる、「あわせて読みたいG」というのを設置してみました。こちらの記事からコードをコピペさせていただきました。
これは結構使ってる人が多くて、自分もいつか導入しようと思っていたのですが、今回ようやく導入することができました。で、コードを貼り付けてみたところ…。
あれ？何も表示されない…。ああ、記事が少なすぎるからですね（爆）。なんて、思ってたらしばらくしたら表示されました。良かった良かった。
まとめ
今回のカスタマイズですが、大体1時間半くらいかかりました。それにしても、はてなブログには親切な方が多いですね。もし、このブログを読んでいる方でブログをこれから始めようと思われてる方は絶対はてなブログをおすすめしますよ。
自分のようにHTMLやCSSの知識が全く無い人間でも、先人たちの知恵を借りてブログをカスタマイズできるのだからほんとはてなブログって最高ですね。はてなブログ万歳！