結論から書くと、DreamWeaver CC を使い、WordPress テーマ内にSass, Compass を使う場合は、DreamWeaver のコンパイルを切って、Ruby のコンパイルを使ったほうが時間を無駄にしないと思う。
できたこと
Dreamweaverで覚える最新Web開発ワークフロー: Sass編 を読むと、Ruby の知識がなくても、Sass, Compass が容易に使えるようになる。
ディレクトリ構造は次のような感じ
1 2 3 4 5 6 |
mysite ├config.rb //Compass の設定ファイル ├css //コンパイル後のCSSファイルを格納 ├scss //コンパイル前のSass ファイルが保存されている ├images └js |
できなかったこと
wordpress ディレクトリがルートディレクトリで、テーマ内にscss, config.rb, style.css を保存しようとした
1 2 3 4 5 6 7 8 |
wordpress └wp-content └mytheme ├config.rb ├style.css //コンパイル後のCSSファイルをテーマ直下のディレクトリに書き出したい ├scss //コンパイル前のSass ファイルが保存されている ├images └js |
コンパイルするとどうなるか?
1 2 3 4 5 |
wordpress └css └wp-content └mytheme └style.css |
こうなったり、
1 2 3 4 5 6 7 8 |
wordpress └wp-content └mytheme └wp-content └themes └mytheme └scss └style.css |
こうなる。
1 2 3 4 5 |
wordpress └wp-content └mytheme └scss └style.css |
これはましな方だが、狙ったディレクトリにCSS ファイルが書き出されない問題は残ったままだ。
Sass だけなら、「サイト設定>CSS プリプロセッサー>ソースと出力」で出力フォルダをテーマ内に指定するだけで、正しく書き出してくれる。だが、同サイト設定で、Compass>「Compass を使用する」でテーマ内のconfig.rb を指定すると、書き出し時のディレクトリ構造がおかしくなる。
まとめ
DreamWeaver CC のコーディング機能は快適で有用だが、Compass のふるまいだけは制御できなかった。