前回からの続き。とは言え、チマチマと自作テーマをカスタマイズしていたくらいで新しい展開はないのだけれど、久々にCSSを修正していたら予想外に苦戦してしまいました。昨年末に購入した新しいiPad Pro 10.5インチモデルで、ポートレイト表示とランドスケープ表示の切り替え時にレイアウトが崩れないようにするだけで一苦労(Safariの開発メニューにある「レスポンシブ・デザイン・モードにする」は便利だった ↑)。いろんな事を忘れてしまっていて思い出すのにも時間がかかり、完全にはほど遠い7割程度の状態で一旦サーバーにアップし、MacとiPad Proでの表示を確認しながら修正作業を続けることにしました。iPhone用テーマにはまだ手を付けていないけれど、基本的には現在flipflipflip.comとflfl.meで使用しているものを流用予定。
昨年までflipflipflip.comとflfl.meという2つのサイトにおいて、それぞれ Mac用、iPad用、iPhone用と3つ分のテーマをメインテナンスすることにもホトホト疲れたというか、飽き飽きしてしまったので、今回はMac用とiPad Proの横置きは共通テーマにしてしまい、iPad Proを縦置きにした場合のみ、必要な箇所はCSSで「@media screen」を用い切り替え表示させることにしました。しかも以前の9.7インチ型iPadの表示の事は何も考えていない(だって手元に無いから)という手抜きっぷりです。
@media screen and (orientation: portrait) { #post h4 { margin: 70px auto -50px 80px; border: solid 0px blue; } }
1行目:@media screenで表示切り替え
これでflipflipflip.comとflfl.meを2つとも巧くロリポップ!レンタルサーバーに引っ越しさせることが出来、それらの更新をストップしてしまえば、それ以降は新しい低更新頻度日記ブログだけを気にかけていれば良いだけになります。テーマのメンテも基本的にはMac用とiPhone用の2つだけで済ませられる…はず。
次回からはいよいよ、そのflipflipflip.comとflfl.meの「ドメインの移管申請」というとても面倒臭そうな事務的なアレコレの備忘録となる…ハズ。
2018-03-21 > VPS&WordPress引っ越しメモ