*今回は少し長め、画像多めです。


▽ まず・・・

落書きブログを別サーバーに引っ越して1年ちょっと。


このブログも引っ越し・・・と思ってたのですが今のライブドアブログが引っ越すほど不満があるわけではないので・・・・

と思ってたら1年


コロナとかで結構時間ができたのですこし引っ越しに向けた準備を始めてみました。


▽ 作業開始


まず、今のブログのレイアウトがこんな感じ

image

 


 

引っ越し先(ワードプレス)で作ってるテーマ(外観)がこちら↓

 

image

 

スマホ対応が楽なのでBootstrapが使いたかったので最初から作ることになったのですが

とりあえず・・・

  1. ざっくりしたレイアウト・配色を紙に書き出す
  2. それを元にHTMLでベースを作る
  3. ワードプレス用の関数を(1)に入れていく
  4. ヘッダーなどを別ファイルに分割

という感じで作りました。


落書きブログのテーマを作るときにテーマの作り方は把握していたので最初ほど時間はかかってないと思います

 

ちなみにスマホ(Android+Firefox)からの表示はこんな感じです
image

 

▽ 最後に、やってて思ったこと・・・

・スマホでよく見るメニュー image(←これを押したときに出てくるメニュー)がCSSだけで作れたことにびっりした(Javascript使うものだと思ってましたw)

 

・最初にテーマ作ってるときに他のライブラリはかなりハードル高いイメージだったけど今回やってみるとそうでもなかった(ググり方が悪かったのかもしれないです(´・_・`))

 

外観はほぼ完成ですがここからブログの引っ越しが待ってます

これも1回やったことあるのでスムーズに行けるかなと思ってます