Because We Love Happy Coding

フリーライターからエンジニア × 講師。発信力だけあり余ってる感じ

PhpStormでWordPressテーマを開発する際のベストプラクティスを求めて

今日もまたコーディング。だって僕らはHappy Codingが大好きだから。

PhpStorm と Local by flywheelでテーマを開発する際の手順。

目次

環境

  • PhpStorm 2018.3.3
  • WordPress 5.2
  • Local by flywheel 3.3.0
  • SourceTree

現状の課題

私がまだ技術的に解決できてない課題を紹介しておく。

既存サイトをカスタマイズしたい

Local by flywheel のインストールに指定するディレクトリは空っぽでなければならない。既存のサイトをカスタマイズしたい場合は、空っぽのLocalbyflywheelを構築してから既存のソースコードを投入している。

記事などもエクスポート/インポートすればできるはずだが、今はそこまでやってない。

Local by flywheelでWordPress開発環境を立ち上げる

インストール

Local by flywheelをインストール。

サイトを追加

サイトのインストールディレクトリは、初期設定(ドライブ直下/LocalSites/some_site_name)のままでもいいが、どのように置くかは整理しておくこと。

他のPCと開発ソースを共有する場合、Githubを経由して共有するのがおすすめ(Dropboxだと難しそう)

Githubとの接続

Githubリポジトリを作成

リモートリポジトリをCloneし、Local by flywheelの中にソースを置く

テーマフォルダをCloneし、

私はGitクライアントとしてSourceTreeを使用している。PhpStormでやれたらもうちょっとスマートだろうか。

テーマのひな形ファイルや既存のソースコードがもしあれば、ぶちこんでコミット>プッシュ

さくらインターネットに開発用のWordPressを追加する

適当なサブドメインで作る。

PhpStormでプロジェクトを作成し、設定する

プロジェクト作成時のひな形としてWordPress Pluginを選ぶ

プロジェクトのパスはWordPressの全体(wp-contentの上)が推奨らしい。

  • 「Setting」の「Languages & Frameworks > PHP > Frameworks」を開く
  • 「Enable WordPress Integration」をチェック。
  • WordPress Installation path」も入力する。

参考記事