mimizukuってなぁに?
モンキーレンチが公開したwordpressのテーマフレームワークです。
Mimizuku Child を使ってMimizuku による子テーマ開発環境を構築する
テンプレを使うまでの事前の環境構築をメインに自分用メモの記事です。
モンキーレンチさんにはいつもお世話になりっぱなしで
(smart custom fields/habakiri使わせていただいています!)
blogとアドベントカンレンダーを拝見してましたー。
脱bootstrapを常々感じていたので記事を見て、これは!!
これこそが! ということで早速カッとなり開発環境をビルドしてみました。
前提環境
OS: CentOS 6.8 minimalインストール
Bluemix Infrastructure (SoftLayer)のVMware仮想マシンで今回もお試しです。
1. 環境の構築
1-1. yum レポジトリの設定
EPELとRemiを使ってPHPを導入
# yum install -y epel-release
# yum localinstall -y http://rpms.famillecollet.com/enterprise/remi-release-6.rpm
1-2. httpdの導入
# yum install -y httpd
# chkconfig httpd on
# service httpd start
1-3. PHP 5.6の導入
# yum install --enablerepo=remi,remi-php56 php php-devel php-mbstring php-pdo php-gd php-xml php-mysql
1-4. composerの導入
composerをダウンロードして、導入します。
# curl -sS https://getcomposer.org/installer | php
# mv composer.phar /usr/local/bin/composer
1-5. wp-cliの導入
ダウンロードと導入
# curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar
# chmod +x wp-cli.phar
# mv wp-cli.phar /usr/local/bin/wp
動作確認方法
# wp cli version
1-6. mysqlの導入
# yum install -y mysql-server
# service mysqld start
# chkconfig mysqld on
# /usr/bin/mysql_secure_installation
(Y/nはすべてYで、rootのPWを設定する)
1-7. wordpress用DBの作成
# mysql -u root -p
mysql> create database wp_test;
Query OK, 1 row affected (0.00 sec)
mysql> grant all on wp_test.* to wp_testlocalhost;
Query OK, 0 rows affected (0.00 sec)
mysql> flush privileges;
Query OK, 0 rows affected (0.00 sec)
mysql> set password for wp_test@localhost=password('XXXXXXXXXXXXXX');
Query OK, 0 rows affected (0.00 sec)
1-8. wordpressのダウンロード
/var/www/html直下にwordpressをダウンロードします。
場所は適宜指定を変えてください。
以下のパターンは固定パスを指定していないのでカレントにでダウンロードします
参考 WP-CLI
# cd /var/www/html/
# wp core download --locale=ja
1-9. wordpress設定
wp-cliコマンドをやっと使うようになったので・・・
まずはコンフィグ作成
# wp core config --dbname=wp_test --dbuser=wp_test --dbpass=XXXXXXXXXXXXXX --dbhost=localhost --dbprefix=wp_
Success: Generated 'wp-config.php' file.
セットアップウィザード分
# wp core install --url={wordpressURL} --title=maturity --admin_user={wordpress管理画面ログインID} --admin_password='{wordpress管理画面パスワード}' --admin_email={mailaddress}
Success: WordPress installed successfully.
1-10. node.jsのインストール
失敗してた
じつはこの部分、一回失敗しています。
epelにnodejs/npmがあるのですが、古すぎてmimizuku-childのビルドがうまくいきません。
style.css/style.min.cssがビルド後できあがるのですが、全く無い状態でした。
# composer install
~中略~
npm ERR! Error: ENOENT, open '/var/www/html/wp-content/themes/you/node_modules/gulp/package.json'
~中略~
Script npm run gulp build handling the post-update-cmd event returned with error code 34
恥ずかしながらgithubのissueで凸してしまいました。
勉強不足というか、もっと試してから聞かねば・・・
スキルレベルが低くて恐縮です
mimizuku-child issue#2 インストールについてnpm ERR! Error: ENOENT, open ~ /gulp/package.json #2
原因はnodejsのバージョンだった
【俺用メモ】 CentOS6にNode.jsをインストールする
1-10-1. nvmのインストール
$ git clone https://github.com/creationix/nvm.git /usr/local/nvm
$ source /usr/local/nvm/nvm.sh
1-10-2. nvmインストール確認
$ nvm --version
0.32.1
1-10-3. ターミナル起動時にnvmコマンドが実行できるように設定
$ vi ~/.bash_profile
以下を追加する
if [[ -s /usr/local/nvm/nvm.sh ]];
then source /usr/local/nvm/nvm.sh
fi
1-10-4. インストール
最新stableを入れました。
# nvm install stable
1-10-5 インストール確認
$ node -v
v7.2.1
2. mimizuku-childのビルド
Mimizuku Child を使ってMimizuku による子テーマ開発環境を構築する
こちらの記事の内容そのまんまになってしまうので、実施したコマンドメモです。
# cd /var/www/html/wp-content/themes
# git clone https://github.com/inc2734/mimizuku-child.git {テーマ名}
# cd {テーマ名}
# composer install
# wp theme activate {テーマ名}
3. 今後のToDo
- stylusを勉強する