Edited at

[ようやく見つけたかもしれない]WordpressサイトをGit管理する方法[メモ]

More than 1 year has passed since last update.

Wordpressってどうやってソース管理するのが正解なんでしょうか。

皆様いろいろ工夫しているようですが、あまりピンとくるものがなかったので、Wordpressはソース管理できないものと諦めておりました。

でも、WP-CLIなんてものを知ってからちょこちょこ試してみたところ、もしかしたらようやく見つけたかもしれないのでメモっておきます。


はじめに


  • エンジニア目線です

  • 全てのカスタマイズはthemes/mywebsiteフォルダにまとまっていると仮定します

  • DBとuploadsフォルダは管理しません

  • その他、faviconやgoogleのトラッキングコード?は適宜管理に追加します


準備


WP-CLIをインストール


WP-CLIとは

Wordpressの諸々の設定をコマンドラインから行えるツールです。

詳しい事はこのあたりを参考に。


WP-CLIの使い方 - Qiita



インストール


インストール

curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar

sudo chmod +x wp-cli.phar
sudo mv wp-cli.phar /usr/bin/wp


確認

$ wp cli version

WP-CLI 0.22.0
$ wp --info
PHP binary: /usr/bin/php
PHP version: 5.4.45
php.ini used: /etc/php.ini
WP-CLI root dir: phar://wp-cli.phar
WP-CLI global config:
WP-CLI project config:
WP-CLI version: 0.22.0

WP-CLIがインストール出来ました。


Gitリポジトリを設定


初期化

cd /var/www

git init

Wordpressをインストールするディレクトリに移動して、

Gitリポジトリを作成します。


.gitignore


.gitignore

*~

*.bak
*.org
Thumbs.db
desktop.ini
.DS_Store
.buildpath
.project
.settings
*.tmproj
build
.idea

/.env
/vendor
/wordpress/*
!/wordpress/favicon.ico
!/wordpress/google*.html
!/wordpress/wp-content
/wordpress/wp-content/*
!/wordpress/wp-content/themes
/wordpress/wp-content/themes/*
!/wordpress/wp-content/themes/mywebsite


前半はお好みで。

大事なのは後半です。

wordpressディレクトリを一度全て無視に登録し、

カスタマイズに必要なディレクトリとファイルのみ無視を無視してあげます。


確認

こんな感じでカスタマイズしたとします。


カスタマイズファイル

mkdir wordpress/wp-content/themes/mywebsite -p

touch wordpress/wp-content/themes/mywebsite/index.php
touch wordpress/favicon.ico
touch wordpress/googlexxxxxx.html
git add .

確認してみます。


確認

$ git ls-files

.gitignore
wordpress/favicon.ico
wordpress/googlexxxxxx.html
wordpress/wp-content/themes/mywebsite/index.php

いい感じですね。

必要ファイルだけGit管理出来そうです。


WP-CLIの設定


環境変数を用意


.env

export DBNAME=wordpress

export DBUSER=mysql
export DBPASS=mysql
export DBHOST=localhost:3306
export DBPREFIX=wp_

開発環境と本番環境で異なる設定値はソース管理すると不便なので、

環境変数から設定できるようにします。


WP-CLIコマンドを用意

インストール用のコマンドをまとめてshファイルにしてしまいましょう。

vi install.sh


install.sh

wp core download --locale=ja --path=wordpress

cd wordpress
wp core config --dbname=$DBNAME --dbuser=$DBUSER --dbpass=$DBPASS --dbhost=$DBHOST --dbprefix=$DBPREFIX
wp core install --url=http://my-website.jp/ --title=MyWebsite --admin_user=wordpress_user --admin_password=password --admin_email=test@my-website.jp
wp plugin install contact-form-7
wp plugin install akismet


Wordpressをインストール


インストール


インストール

source .env

bash install.sh


確認

$ bash install.sh

Downloading WordPress 4.4.1 (ja)...
Using cached file '/home/projects/.wp-cli/cache/core/wordpress-4.4.1-ja.tar.gz'...
Success: WordPress downloaded.
Success: Generated wp-config.php file.
WordPress is already installed.
Installing Contact Form 7 (4.3.1)
https://downloads.wordpress.org/plugin/contact-form-7.4.3.1.zip からインストールパッケージをダウンロードしています…
Using cached file '/home/projects/.wp-cli/cache/plugin/contact-form-7-4.3.1.zip'...
パッケージを展開しています…
プラグインをインストールしています…
プラグインのインストールが完了しました。
Updating 'Japanese' translation for WordPress 4.4.1...
Downloading translation from https://downloads.wordpress.org/translation/core/4.4.1/ja.zip...
Translation updated successfully.
Updating 'Japanese' translation for Contact Form 7 4.3.1...
Downloading translation from https://downloads.wordpress.org/translation/plugin/contact-form-7/4.3.1/ja.zip...
Translation updated successfully.
Updating 'Japanese' translation for WP Multibyte Patch 2.5...
Downloading translation from https://downloads.wordpress.org/translation/plugin/wp-multibyte-patch/2.5/ja.zip...
Translation updated successfully.
Success: Updated 3/3 translations.
Warning: akismet: Plugin already installed.

いけそうです。

※ちなみに、同じコマンドをもう一度発行した場合は警告だけ出た上でスルーされるようですので、プラグインが追加になった場合等は該当行を編集してもう一度bash install.shすればOKそうです。


確認

$ ls  wordpress/

favicon.ico readme.html wp-comments-post.php wp-cron.php wp-login.php wp-trackback.php
googlexxxxxx.html wp-activate.php wp-config.php wp-includes wp-mail.php xmlrpc.php
index.php wp-admin wp-config-sample.php wp-links-opml.php wp-settings.php
license.txt wp-blog-header.php wp-content wp-load.php wp-signup.php

Wordpressがインストール出来ています!

$ git ls-files

.gitignore
install.sh
wordpress/favicon.ico
wordpress/googlexxxxxx.html
wordpress/wp-content/themes/mywebsite/index.php

カスタマイズファイルのみGit管理出来ています!


wordpress/wp-config.php(抜粋)

/** The name of the database for WordPress */

define('DB_NAME', 'wordpress');

/** MySQL database username */
define('DB_USER', 'mysql');

/** MySQL database password */
define('DB_PASSWORD', 'mysql');

/** MySQL hostname */
define('DB_HOST', 'localhost:3306');


初期設定も済んでいます。

設定内容も.envの値から読み込めています!


おわり

このくらい出来ていれば、VagrantでもDockerでもChefでも使ってどこにでも開発環境作れると思うので便利になるのではないかと。

(※DBのインポートとuploadsフォルダのアップロードはお忘れずに)


(追記)プラグインメモ

ついでなので、実際のプラグインもメモ

※入れただけで使ってないのもあるのかも


install.sh

wp plugin install contact-form-7

wp plugin install bj-lazy-load
wp plugin install crayon-syntax-highlighter
wp plugin install custom-field-template
wp plugin install custom-post-type-permalinks
wp plugin install google-sitemap-generator
wp plugin install tinymce-advanced
wp plugin install wordpress-importer
wp plugin install wp-mail-smtp
wp plugin install wp-multibyte-patch
wp plugin install wp-sitemanager
wp plugin install wp-social-bookmarking-light
wp plugin install wpx-nav-menus
wp plugin install akismet

※ちなみに、プラグインの設定などは開発環境の管理画面で行い、DBごとインポートすることを想定しています。


(追記)説明を追加しました

好評のようでしたが、説明もないただのメモだったので少し追記しました。分かりやすくなっていれば幸いです。

主にエンジニア目線ですが、デザインのフェーズに入ったら管理項目も変わってくるのかもしれません。

こうしたいといったことがあれば検証して追記いたしますので、コメント頂ければと思います。

また、デフォルトで入れた方がいいプラグインなども教えて頂ければ喜びます。