名誉社畜ブログ

けっこうな社畜ですが、いろんなことやってます

【HTML・CSS】 スマホ版はてなブログで月別アーカイブを表示する

スポンサードリンク

つい先日、「まずはカスタマイズより記事を書く!」と宣言したばかりですが、早速信念を曲げましてCSS・HTMLに手を出してしまいました。

といっても、まずはすごく簡単なものから。

http://www.flickr.com/photos/34247648@N02/4298911131

photo by racheocity

 

月別アーカイブ使ってる?

みなさんは他の人のブログを見る際、『月別アーカイブ』を利用したことありますか?

私は結構使います。

 

例えば検索やリンクで、とあるブログに到達したとします。

面白い文章を書く人だったり、趣味がドンピシャだったりすると、その人の他の記事を読みたくなっちゃいますよね。

そこで『おすすめ記事』とか『注目記事』から2~3個読んでみて、「あ、この人のこと好きだわ」ってなると、時間をかけて全部読んでやろうと思います。

そんなときに私はまず『月別アーカイブ』を探します。

 

「ははーん、ブログ初めて半年で40記事ね。一番古いのから順番に読んでやろ。」

「ほう、もう5年もやってるやん。とりあえず2016年の記事を読んでみるか。」

とか作戦を立てられるわけです。

逆に月別アーカイブが無いと、全体像がわからない不安のまま、ただひたすら注目記事に踊らされるか、最新記事から順に辿っていくしかないんですよね。

はてなブログはどうなの?

そうなんです。

はてなブログの場合、PC版にはデフォルトで月別アーカイブがあるのですが、スマホ版にはありません。

設定項目にもなく、残念ながら頑張ってカスタマイズをしないと表示することは出来ません。

月別アーカイブフリークとしてはとても見逃せない事案です。

いまやWEBページのアクセスは7~8割スマホ経由です。

質の高いブログとは、スマホユーザに快適に閲覧してもらってこそだと思います。 

 

導入すればきっと回遊率もアップして、直帰率も下がるはず!

ということで練習がてら作ってみました。

 

※自己責任でお願いします。必ずバックアップは取っておいてください。

URLが2箇所ありどちらも

http://○○/archive

となっていますが、この○○のところを自分のブログのトップページのアドレスに変更してください。

つまり私のブログの場合は

http://www.shachikuman.com/archive

になるわけです。

 

これをスマートフォンのフッタ部分に貼り付けます。

f:id:meiyoshachiku:20160203150759j:plain

 

これでスマホページのフッタ部分に月別アーカイブが表示されました。

こんな感じです。

f:id:meiyoshachiku:20160203151428j:plain

 

いかがでしょうか。

是非お試しください。

これでブログの回遊率もアップして、直帰率も下がるかもしれませんね。

 

もし気に入った使ってみた使ってみようという方がいらっしゃいましたらコメント・スター・ブックマークなどいただけると嬉しいです!

同時に何かバグとかあればご報告ください・・・

 

今回は簡単なカスタマイズでしたが、反響あればもっと色々作って公開してみようかなと思います。