こちらの記事を参考にして、当ブログのスマートフォンデザインをカスタマイズしました。
※当記事ははてなブログネタであり、しかもPro限定です。
目次
スマホ版はサイト内巡回しづらい
ＰＣ版のデザインにはサイドバーがあって、カテゴリーや人気記事などへ移行する動線（訪問者がサイト内を巡回するライン）が充実してますよね。ですが、スマートフォンはサイトの末に行かなければそれらに辿り着けなかったのです。
設定前の画像。アプリではなくsafariで自ブログを表示してみました。まずは最新記事がずらりと表示されます。
７記事ほど表示されて「次のページ」「読者になる」「管理人の連絡先」「プロフィール」「検索」欄と続き...
ここからようやく注目記事です。定期的に訪れてくれる方は、「ポジ熊の人生記」が１日５記事更新なのをご存知でしょうから、最新記事５記事を見たら去っていくような気がします。
ここまでたどり着いてくれる方が、果たしてどれほどいるでしょうか(´Д｀)
というわけで、スマートフォンでサイトを表示した際に、別の記事へ行けるような工夫をしてみました。
タイトル下にメニューを入れた
こんな感じです。良く見ますね、「メニューバー」的な。こうやって配置してたなんて知らなかった(-_-;)
メニューは任意の数を表示できますが、「自己紹介」を始め、当ブログで推したいカテゴリー５つを配置してみましたよ。ごちゃごちゃ置くよりもスッキリしてて好きです。
ここで「何の日」をタップすると
ズラリと「何の日シリーズ」カテゴリーが表示されるようになります。これは気持ち良いですね。
このようにスマホ版で表示したＴＯＰにカテゴリーがあれば、興味を持った読者が飛んできてくれるに違いありません。
このメニュー内にはカテゴリーへのリンクだけじゃなく、urlを貼りつけてどこでも誘導することができるので、使い方は無限でしょう。
しかしこうやって改めて動線を作ると、「自己紹介」を始め、適当な記事作りはできませんね（笑）自己紹介、きっちり書き直そう...
はてなブログ設定場所を箇条書きで
- デザイン
- スマートフォン
- タイトル下（Pro）
ここに冒頭で言及した記事様のテンプレートを貼りつけて、自分の好きなようにカスタマイズしましょう！
困った（１）
この空白を埋められないのです。ド素人の悩み。恐らく見る人が見れば埃を「ふっ」と吹き飛ばすような問題なのでしょうが...
コードです。色々やってみましたが、ちょっといじくると変な文字列になってアベシ状態になります。ご存知の方がいればご教授願います(´；ω；｀)
困った（２）
ＰＣ表記の悩みです。この水色のラインが消せなくて困ってるのですよ。スマホ版だと無いのですが。
「デザイン」「カスタマイズ」「ヘッダ」「タイトル下」内の記述です。これに何かを書き加えるか、消すかで解消するのかな(´・ω・｀)