【ママブログをつくろう#7】ブログ制作に着手！作業内容や使用ツールを紹介。
【いっしょにママブログをつくろう】シリーズをマガジンで更新中。
wordpressでのブログ制作過程を公開しながら、ブログをやってみたい方・運営中の方へ向けて情報を発信しています。
「がんばらなくていい」「モノづくりって楽しい！」と思ってもらえるようなシリーズを目指しています。
それでは、ブログのテーマが決まったところで、実際に作っていきましょう！
無料のブログサービスを使う場合。
アカウントを作成すれば、すぐに記事を書き始めることができます。
作業時間は、1日もあればできるかと思います。
wordpressの場合。
wordpressの場合は、いろいろとやることがあると思いますが…ざっくりとこんな感じでしょうか。
・サーバーやドメインを契約
・配布テンプレートを使用する場合は探す
・デザイン作成
・コーディング
等々
作業時間は、私の場合は発案から公開まで3ヶ月かかりました。とはいえ、毎日作業していたわけではなく、実際の作業日は2週間(1回3〜5時間)ほどかと思います。
みなさんそうかと思いますが、日々バタバタとしていて、作業日を捻出することが大変でした…。家族に協力してもらったり、夜中やお昼寝の間にやったりと試行錯誤しながら進めました。
参考までに、今回私がやった作業や使用したツールについて紹介します。
・サーバーやドメインを契約
こちらの記事に詳しく書きました。
また、契約後に実際にかかった費用を追記しました。(2023.5.21追記)
最終的には、ロリポップのベーシックプランを36ヶ月で契約(自動更新)。費用は18000円でした。
年でいうと6000円です。
・配布テンプレートを使用する場合は探す
私は自分でテンプレートを制作したので、配布されているものは使用しませんでした。
仕事でやっていたので慣れてはいましたが、しばらく見ない間に変わっている部分もありました…(浦島太郎)。それでも、今回作業をして1年分のブランクは大体取り戻せた気がします。そういった意味でも、やってみてよかったです。
・デザイン作成
デザインツールはfigmaを利用しました。仕事でもよく使っています。無料の範囲内で十分使えるのでおすすめです。
スマホのデザインはこんな感じ。
コーディングしながら変えていこうと思っていたので、時間をかけて作り込みすぎずに、ざっくりと。
・コーディング
こちらは私の専門分野でもあるので、少し技術的な話も交えようかと思います。
簡単にではありますが、こんな感じの流れです。
＜環境構築＞
まずは自分のパソコンの中でwordpressを作っていきます。(ローカル環境構築)
今回は環境構築に時間をかけたくなかったので、
・sass→cssのコンパイル
・ライブプレビュー機能
だけ設定することに。
それであれば、簡単に環境構築することができます。
使用ツール(無料)
・Local by Flywheel
・prepros
この二つの組み合わせは、初心者の方には特におすすめです。
設定方法はこちらを参考にしました。
「Local by FlywheelでWordPressローカル環境を構築してライブプレビュー」
この「ライブプレビュー」という機能がとても便利で、コーディングして保存すると即座にブラウザに反映されます。つまりブラウザの「更新ボタン」を押す手間が省けて時短に。
＜コーディング＞
環境が作れたら、いよいよコーディング。
愛用のエディタは「Visual Studio Code」です。こちらも無料で使えます。
振り返ると、サーバー費用以外はお金がかかってませんね…！
＜サーバーを契約して本番公開＞
コーディングが完了したら、サーバーを契約。使用サーバーやプランは上記に書きました。
そして本番公開して、作業は完了です。おつかれさまでした！
という感じで、さらっと流れを書きましたが、途中でつまずいて「ぁぁぁああああ」となっている時間もありました。。笑
初めてブログをつくられる方も、途中でつまずくこともあるかもしれませんが、ぜひ楽しんでやってみてほしいなと思います。
この記事が気に入ったらサポートをしてみませんか？