どうも、虎之助です。
前々からずーっとブログのカスタマイズをするといいつつ早半年、よーやく重い腰を上げてスマホ画面のカスタマイズから行いました！
誰かの参考に慣ればと思い、紹介したいと思います。
PCレイアウトとの連動はしていません。
当ブログは開設初期はレスポンシブルでPCの表示と同じにしていたのですが、どうもうまくいかないことが多かったので、何時からだったかスマホ単独でカスタマイズすることにしています。
自由が効く分、スマホとPCを別々にカスタマイズしなければならないので労力は2倍です。片方終わってももう片方残ってます。絶望！
スマホレイアウトにはテーマが無い
スマホレイアウトの特徴として、PCの用にテーマが無いためインストールすれば見栄えがよくなるってもんでもないです。一つずつ設定していく必要があるのですが、ネット上の有志がそのままコピペ可なテーマチックなHTMLを公開してますのでありがたく使わせてもらいましょう。
今回というか、いままで使用していたメインのレイアウトは変えずにそのまま使わせてもらいます。いつ俺さんのシンプルなレイアウトをそのまま使用しています。
カテゴリー一覧の自動生成
今回のカスタマイズで一番大きな変化がこれかもしれない。
トップにカテゴリーの一覧選択を導入
右の青バックの矢印を選択すると
カテゴリ一覧が表示される。
因みにこのカテゴリー一覧は自動生成されるため、増やしたり減らしたりした時でも勝手に更新される優れもの。
とはいえ、全てのカテゴリーが表示されるため、ちょっと見づらくなっている。カテゴリーを整理するか、手動のカテゴリー一覧を導入するか考える必要がある。
またもやいつ俺さんである。
シェアボタンと関連記事
シェアボタンをおしゃれな感じに記事上と下に配置。
その下に更に関連記事をいれた。ちょっと言葉を変えてみたんですけどどうですかね？
関連記事にはMilliardをリストで使っている。スマホからはこっちのほうが見やすいのではないかとおもった。
Milliard関連ページプラグインについて | シスウ株式会社
シェアボタンはどこからデザインひっぱってきたのか失念してしまった！再現できないので割とヤバイ。探せばすぐでるかな？
忘れちゃいけない読者ボタン
はてな村に欠かせない読者ボタン。なぜかスマホレイアウトだと消えているので追加。結構他所様のサイトでもスマホから見ると読者ボタンがわからなかったりする。
参考にさせていただいたのはこちら。ツイッターボタンは悩んだけど保留。
スマホレイアウトをいじる際の注意点
スマホレイアウトに限った話じゃないが、カスタマイズの際大切な注意点がある。
必ずバックアップを取ること
超重要
メモ帳でもなんでもいいから、HTMLやCSSを弄る前にかならずコピーをとっておくこと。変なことになって泣きを見るのは自分だぞ！
自分でどこが悪いか判断がつかない人は絶対に行おう。
サブブログで実験！
念には念を入れではないが、非公開のサブブログを立ち上げ、そこでカスタマイズを試してから本ブログへ適応するのが良いかと思う。物によっては思い通りにならなかったり、デザインが干渉し合ったりする。
そんな時本ブログでやるとレイアウトがずれたまま反映されてしまい思ったより厄介になるぞ！
完璧を求めない！
こんな中途半端なレイアウトじゃいや！こんな少ししかいじってないのに公開できない！そんなことを言ってるといつまでも完成できないぞ。
そもそもブログカスタマイズにおわりはないのだ。コツコツと少しずつ改良を続けていくのが一番！当ブログも色々やってみたいことはあったが、少しずつ進化させていこうと思う。
次はPC版をカスタマイズ！
なんとか手を付けられたスマホレイアウトまだまだ色々とやりたい所はあるけどひとまずここまでにしてPC版のレイアウトに移りたいと思う。
なんか良いテーマないかなぁ・・・・
御礼とお願い
今回スマホ版レイアウトはうぃるさんのブログを参考にさせていただきました。ありがとうございました！
また、読者の方々でなんかレイアウトおかしくね？と気づかれた方はご一報いただけるとうれしいです。
それでわ！