日本語を記入すると文字化けした話。ベースにやっつけてみた。Underscoresはフルカスタムしたいユーザー向けのスターターテーマで、Automatticが作ってるから超安心して使える。必要環境とインストールについては丁寧に解説してくださってる記事があるのでそちらを参照頂くとして、こちらではインストール完了後にした魔改造について適当にメモっていくつもりです。長くなりそうなので改造個所毎に記事分けます。手順通りにインストールを終えるとこんな具合になります。見慣れないファイルをざっくり紹介。gruntの設定とかするファイル。ローカル用のnodeモジュールが入っている。npmの設定ファイル。削除したらダメSass+Compassを入れるプリプロセッサが無いなんて耐えられない/(^o^)\LessでもStylusでもそう手順は変わらないと思うので何を使うかはお好みで。Grunt用のgrunt-contrib-compassを入れます。こいつはSassとCompassがインストールされていることが前提になるので、まだ入ってなければ先にオリジナルのSassとCompassをインストールしておく。--save-dev(Sassだけでいいならgrunt-contrib-sassにする)つらつら〜っとログが流れてインストールがつつがなく終わります。Sassのファイルを入れるディレクトリを用意する。assets/scssにしました。ルートにある元のstyle.cssをstyle_original.cssに名前変更しておく。assets/css/srcは使わないので消す。Gruntfile.jsの編集エディタでGruntfile.jsを開く。開いたら適当な場所にCompass使います宣言を追加する。{以下にUnderscoresが生成してくれたデフォルトのオプションが入ってますが、そこにCompassのオプションを追加する。}},assets/scssにstyle.scssを作る。comapssルートにstyle.cssが出来たらインストール完了。テーマコメント挿入style.cssにはWordpressのテーマと認識させるためのコメントが必要なので、コンパイルされる時に勝手に入れるようにしておく。名前を変えておいたstyle_original.cssを開いて先頭のブロックコメントをコピーしたら、Compassタスクのオプションにコピペして、bannerオプションとして動作するよう編集する。}},bannerオプションはspecifyオプションとセットでないと動かんので、specifyにstyle.scssを追加しておく。テンプレートタグを使ってpackage.jsonの値を流用すると便利だと思う。'*/\n',もう一度コマンドを叩けばコメントが追加される。compassのオプションでcompressedを設定していたら圧縮は不要なので、Gruntfile.jsのcssminタスクは消した。style.css以外のcssファイルが作りたくなったら作りたいファイルに応じた設定を増やせばおk。}},othersの設定でassets/scss/custom.scssをassets/css/custom.cssに生成するよう指定した。bannersオプションは入れてないので、custom.cssにはテーマコメントは入らない。watch対象にするファイルに修正があったら勝手にコンパイルさせる。これは元からあるwatchタスク内のstyles以下を改変すればおk。watchファイルの編集で勝手にコンパイルしてくれるようになる。素の状態だとheader.phpがDOCTYPE宣言しかなくてCSSすら読み込まれないので、適当に追加する。?&gt;&lt;/head&gt;functions.phpの編集wp_head関数でcssとかが読み込まれるようになると、デフォルトで設定されているcssやjsを読み込むタグがhead内に追加される。119行目くらいにあるscripts()関数を編集する。DesignWall.。