Yeomanを使ってWordPressの初期構築


以前、Composerを使ってのWordPress初期構築をやってみていましたが、YeoPressのほうが簡単便利だったので備忘録として。

### 今回使うもの

* [node.js](http://nodejs.org/)  
	Yeomanの実行環境
* [npm](https://www.npmjs.org/)  
	YeomanとYeoPressのインストールに使用
* [Yeoman](http://yeoman.io/)  
	YeoPressの動くベース
* [YeoPress](http://wesleytodd.com/2013/5/yeopress-a-yeoman-generator-for-wordpress.html)  
	WordPressのジェネレータ
* [Composer](https://getcomposer.org/)  
	今回使うテーマの初期化で使用
* [Git](http://git-scm.com/)  
	YeoPressでテーマをDLするときに使用


## Try

私の使ってるOSはUbuntuなので、別のOSの方はコマンドを適宜読み替えてやってください。  


node.jsとnpmの用意出来てない人は

- [[Mac] Node.js と npm をインストールする方法 [Homebrew]](http://codenote.net/mac/homebrew/346.html)
- [Node.js と npm のインストール方法(Windows編)](https://sites.google.com/site/nodejyuku/how_to_install_for_windows)
- [node.js と npm を Ubuntu にセットアップ - tilfin's note](http://tilfin.hatenablog.com/entry/20110923/1317009573)

とかを参考に><;  

GitとComposerをインストールしてない人はぐぐって(｀・ω・´)


<br/>
### Yeomanのインストール

Yeomanってなによ？って方は[Yeomanのあれこれ - Qiita](http://qiita.com/sys1yagi/items/4d8c2994580c274fd3fa)を見てみてね。

```sh
~$ sudo npm install -g bower grunt-cli yo
```

<br/>
### YeoPressのインストール

```sh
~$ sudo npm install -g generator-wordpress
```

<br/>
### YeoPressでジェネレート

~/workspace/yeopress-prj/src/html を公開ディレクトリとする体でいきます

```sh
$ mkdir -p ~/workspace/yeopress-prj/src/html && cd $_
$ yo wordpress --advanced
```

Languageの設定にadvancedオプションが必要なので"--advanced"を付けてます。  
コマンドを実行すると、対話形式で進みますので適宜入力してください。

```sh
                     YeoPress

                 ..::::::::::::..
             .:::   ::::::::::   ::..
           .:    :::::::::::::::    :..
         .:   :::::::::::::::::::::   :.
        .:  ::::::::::::::::::::::     :..
       .:  ::::::::::::::::::::::       ::.
      .:         :::          :::        :..
     .:       ::::::::     :::::::        :.
     :  :      :::::::      :::::::     :  :.
    .:  ::     ::::::::     :::::::    ::  :.
    :: ::::     :::::::      :::::::   ::: ::
    :: ::::     ::::::::     :::::::   ::: ::
    :: :::::     :::::::      ::::::  :::: ::
    :: :::::     ::::::       ::::::  :::: :.
    .:  :::::     :::::  ::    ::::  ::::  :.
     :  ::::::     :::   ::    ::::  ::::  :.
     .:  :::::     ::   :::     ::  ::::  :.
      .:  :::::        :::::    ::  :::  ::.
      .::  ::::       ::::::       :::  ::.
        .:  ::::     ::::::::     :::  ::.
         .:   ::    :::::::::    ::   :.
          .::      ::::::::::      ::.
            ..::    ::::::::    ::..
               ..:::..     ..:::..
                    ..:::::.. 

          A Yeoman Generator For WordPress

[?] WordPress URL: http://yeopress-prj.localhost/
[?] WordPress Version: (3.9.1) 
[?] Table prefix: (wp_) yeopress_prj__wp_ 
[?] Database host: (localhost) 
[?] Database name: any
[?] Database user: root
[?] Database password: xxxx
[?] Language: ja
[?] Use Git? (Y/n) n
[?] Would you like to install WordPress with the custom directory structure? (y/N) y
[?] WordPress install directory: (wordpress) wp
[?] WordPress content directory: (content) 
[?] Create local-config.php? (y/N) y
[?] Block external WP requests? (y/N) 
[?] Use Vagrant? (y/N) 
[?] Install a custom theme? (Y/n) 
[?] Destination directory: (yeopress) original
[?] Theme source type (git/tar) (git) 
[?] GitHub username: (wesleytodd) jhonyspicy
[?] GitHub repository name: (YeoPress) wordpress-theme-base
[?] Repository branch: (template) 
[?] Does this all look correct? (Y/n) 
```

#### 各質問の簡単な説明

<dl>
  <dt>WordPress URL</dt>
  <dd>WordPressを構築するURL</dd>

  <dt>WordPress Version: (3.9.1) </dt>
  <dd>インストールするWordPressのバージョン</dd>

  <dt>Table prefix: (wp_) </dt>
  <dd>WordPressのテーブル名prefix設定です</dd>

  <dt>Database host: (localhost) </dt>
  <dd>データベースのホスト</dd>

  <dt>Database name: </dt>
  <dd>データベースの名前</dd>

  <dt>Database user: </dt>
  <dd>データベースの接続ユーザー名前</dd>

  <dt>Database password: </dt>
  <dd>データベースの接続パスワード</dd>

  <dt>Language: </dt>
  <dd>WordPressの言語設定</dd>
  <dd>指定した言語ファイルのDLもしてくれます</dd>

  <dt>Use Git? (Y/n) </dt>
  <dd>YeoPressを実行したディレクトリをGitリポジトリとするか？</dd>

  <dt>Would you like to install WordPress with the custom directory structure? (y/N)</dt>
  <dd>WordPressをディレクトリに入れるか？</dd>
  <dd>Noだと実行ディレクトリ（今回は~/workspace/yeopress-prj/src/html）に展開されます</dd>

  <dt>WordPress install directory: (wordpress)</dt>
  <dd>WordPressをインストールするディレクトリ</dd>

  <dt>WordPress content directory: (content) </dt>
  <dd>コンテンツを配置するディレクトリ</dd>
  <dd>デフォルトの設定でWordPress使う際のwp-contentディレクトリにあたります</dd>

  <dt>Create local-config.php? (y/N)</dt>
  <dd>wp-config.phpの前にデータベースの接続情報などを書けるファイルを作成するか？</dd>
  <dd>名前の通り、ローカル実行環境の設定をすることを意図していると思います</dd>

  <dt>Block external WP requests? (y/N) </dt>
  <dd>まだよく調べてません</dd>

  <dt>Use Vagrant? (y/N) </dt>
  <dd>まだ使ってみていません</dd>
  <dd>たぶんVagrantfileを用意してくれるのだと思います</dd>

  <dt>Install a custom theme? (Y/n) </dt>
  <dd>カスタムテーマをインストールするか？</dd>

  <dt>Destination directory: (yeopress)</dt>
  <dd>カスタムテーマのインストールディレクトリ名</dd>

  <dt>Theme source type (git/tar) (git) </dt>
  <dd>カスタムテーマのDL方法　git、tarをサポート</dd>

  <dt>GitHub username: (wesleytodd)</dt>
  <dd>カスタムテーマのリポジトリ（Github）のユーザー名</dd>
  <dd>デフォルトはYeoPressの製作者</dd>

  <dt>GitHub repository name: (YeoPress)</dt>
  <dd>カスタムテーマのリポジトリ名</dd>

  <dt>Repository branch: (template) </dt>
  <dd>カスタムテーマのリポジトリのブランチ名</dd>
  <dd>上３つの質問も合わせてデフォルトのカスタムテーマは https://github.com/wesleytodd/YeoPress/tree/template/ </dd>

  <dt>Does this all look correct? (Y/n) </dt>
  <dd>今までの入力で間違いないですか？</dd>
  <dd>Noだと最初から入力し直せます</dd>
  <dd>Yesだとジェネレートが開始します</dd>
</dl>

コロンの後に括弧があるものは、未入力&#9166;で括弧内のものになります。
（"y/n"場合は大文字のほうになります。）

なお、回答によっては、ここに無いものが表示されるので、無いものは自分で調べて><;

<br/>

### Composerでカスタムテーマの依存関係解決

カスタムテーマに https://github.com/jhonyspicy/wordpress-theme-base/tree/template を指定したので、最後にComposerでPHPの依存関係を解決してお終いです。

```sh
$ cd ~/workspace/yeopress-prj/src/html/content/themes/original/
$ composer install
```

"composer install"が無事終わればWP Multibyte Patchプラグインなどがpluginsディレクトリにインストールされます。  


<br/>
以上、Yeoman使ってのWordPress初期構築でした。


<br/>
## 最後に

不満ってほどじゃないんだけど、local-config.phpをローカル用の1個だけじゃなくて https://github.com/atomita/wordpress-environment-config （手前味噌ですが）みたいに複数環境分けて持てるようにしたら、もっと使いやすいと思う。
プルリクしろって言われそうですがｗ