こんにちは、
サイト開設から早一ヶ月半ほど経ちました。
wordpressテーマの改善については常日頃頭の片隅に置いてますが、まだ本格的に動くことはしばらくできなさそうです。
しかし今週は、一週間学校が休みだったのでこの時間を生かして、モバイル向けテーマをひとまず仮完成させることができました。
実際数週間前からちまちまコード書いてたのですが、メディアクエリを使ったレスポンシブデザインではサイドバー（ウィジェット）や要素のずれが目に付き、どの要素がどの要素に影響与えているかがしっかり把握できていなかったので、モバイル用のテーマを新規作ることにしました。
基本的な構造はいままでのテーマを受け継いでいますが、なにぶん無理やり完成させた初期テーマはコードが非常に汚く、というのも手伝ってもらった箇所での各要素がどういう意図で存在しているのかが理解できていないのが原因としてあったので、よくわかってない部分はすべて削除し、細かなcssでの指示はほぼ新規で作り直しました。
初期の表示で
before:
after:
デバイスの幅に合わせるように文章を表示することが第一の目的で、PC版だとズームして左右スライドしなければならなかった部分が、すんなりと画面に収まるように調整しました。
上部の固定バーとサイドバーも全て別のものをネット上で探してきて置き換えました。
before:(ズームすればちゃんとつかえるが、枠のずれが心配で変更)
after:
デザインもモバイル専用に見やすくしました。
次回のテーマ改善はPC、モバイル兼用できるようなまた一から構造を作る予定なのでまたまた期間空くかと思います。
bootstrapを用いて綺麗なレスポンシブデザインになるようにしたいと思っています。
モバイルテーマ作成時に壁となったこと、解決したエラーなどもここにメモしておきたかったのですが、別の記事にします。
では