17
21

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

WordPressを使ったサイト制作標準フロー

Last updated at Posted at 2019-06-06

こちらの記事は5年以上前の内容で特に開発環境構築まわりは、昨今の事情にあわないものとなりました。
2024年時点の考えを下記にまとめなおしましたので、こちらを御覧ください。
WordPress標準制作フロー2024


WordPressを使ったサイト制作案件が多く手がけるようになって、この1年だけで10サイト以上WordPress案件に携わってきました。
色々と試行錯誤しながらやってきたなかで、ある程度WordPressをつかったサイト制作のフローが標準化してきたのでまとめていきたいと思います。

前提事項

  • Web制作会社などでいちからサイトを制作することを想定
    (汎用テーマなどを使って簡易に構築するとかではなく、ガッツリとそのサイト専用のテーマを作成する)
  • それぞれのツールのインストール方法などは記載しない
    (Qiita内で丁寧に手順を記載している記事があるので検索してみてください)

Web制作にWordPressを導入した際の課題

  1. 環境構築が手間。
  2. 新規テーマ作成時の初期テンプレートの準備が大変。
  3. サイトの引っ越しが生じる都度、DBの書き換えが必要となる。
  4. 各操作がWeb画面のGUIベースで作業を自動化やコード化しにくい

対応策

1. 環境構築が手間。

VCCWで環境構築の手間を解決する

LAMP環境をホストOSに構築したり、VirtualBoxでゲストOSに構築したりしてWordPressをインストールしている時期もありましたが、VCCWの存在を知ってからはWordPress案件はすべてVCCWを使用しています。

VCCWを使えばコマンドひとつでWordPress開発環境をVagrant上に構築可能。
PHP_CodeSnifferやWP-CLI、WordMoveなどの便利なWordPress関連ツールもついてきて非常に便利です。

2. 新規テーマ作成時の初期テンプレートの準備が大変。

Iemotoで骨組みとなるテーマファイルを一括生成

WordPressのオリジナルテーマをつくる際は、既存のデフォルトテーマを元にコピーして作成する方法などもありますが、コード内の名前を置換したり不要な記述を削除するが手間です。

Iemotoを使用するといくつかの質問に答えるだけで、WordPressの基本的なテーマファイル構成とSassのコンパイルなどを行なうタスクランナーの設定まで自動でやってくれます。
(後述する、WP-CLIでもテーマの雛形を作成できますが、タスクランナーがついている分、Iemotoのほうが便利です。)

Use gulp? (y/N)y でGruntではなく、Gulpのほうが動作が早いのでオススメ。
タスクランナーの実行はゲストOS側でも良いですが、ホストOSから実行したほうが楽だし早いので私はホスト側から実行しています。

3. サイトの引っ越しが生じる都度、DBの書き換えが必要となる。

WordMoveでデプロイや他環境との同期を効率化

WordPressはパスをすべて絶対パスで記述するような方針のため、ローカルの内容をテスト環境へアップしたり、テスト環境の内容を本番に反映したりする際にDB書き換えが必要となり非常に手間です。

以前は自分でドメイン部分を変換して適用するようなコマンドラインツールを作成していましたが、やはり自分が困っていることは他の人も困っていて、すでに WordMoveという一般的な解決策がありました。

WordMoveを使えば、簡単にプラグイン、テーマ、DB、メディアなどを指定しそれぞれの環境と同期することが可能です。

よくあるケース

途中で参加したプロジェクトメンバーがステージング環境のデータを開発環境に同期する。
wordmove pull -e staging -t -d -u -p

DBやメディア(アップロード画像)はGitなどで管理しないことが多いと思いますが、VCCWの設定ファイルなどをGitで管理している場合、新しくプロジェクトに参加する人はリポジトリをクローンした後はVagarntを立ち上げて、WordMoveで上記のようにステージングのデータを取ってくるだけですぐに作業を開始できます。

本番環境に修正したテーマを適用する。
wordmove push -e production -t

テーマファイルの修正をステージングにアップ後に本番環境へ反映するには上記のようにコマンドひとつで簡単に実行できます。

4. 各操作がWeb画面のGUIベースで作業を自動化やコード化しにくい

WP-CLIで作業をショートカット、シェルスクリプト化など

WP-CLIを使うとWordPressに関わる様々な作業がコマンドラインから簡単に行えます。
コマンドラインから行えるということは社内wikiで手順を共有しやすく、シェルスクリプト化も容易です。

よく使うコマンド例:

# WordPressのアップデート
wp core update
# プラグインをインストールして有効化
wp plugin install classic-editor --activate
# DBバックアップ
wp db export ~/backup.sql
# DBをリセットしてからインポート
wp db reset && wp db import ~/backup.sql

パーミッションや設定の問題で管理画面からプラグイン追加や更新が出来ない場合でも、SSHでサーバー接続可能な場合はWP-CLIから対応できますし、ログインアカウントが不明な場合もWP-CLIからアカウントを追加することが出来ます。

カテゴリ情報や固定ページなど初期データが大量にある場合もWP-CLIをつかったシェルスクリプトで一括で登録できるようにすると便利です。

まとめ

  • WordPressを使ったサイト制作ではまずはVCCWを使う
  • テーマ作成はコピーではなく、Iemotoをつかって生成するのが吉
  • 各環境間のデータ連携はWordMoveを使う
  • 必要な作業はコマンドライン(WP-CLI)から行えないか検討する
17
21
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
17
21

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?