SCSSは便利。SCSSは絶対やった方がいい。
ウェブ制作の業務効率化を調べると、そればかり出てきます。
しかしCSSをコンパイル・・・とは・・・? その方法だけ調べてもよくわからない人が多数だと思います。
もしあなたがワードプレスを使っているなら、もうコンパイルの方法云々は一度忘れて、すぐにSCSSを導入することができます!!
以下、手順です。
『WP-SCSS』をインストール
ワードプレスのプラグイン新規追加画面から、『WP-SCSS』を検索して有効化してください。
Scss Location、Scss Locationの設定
『WP-SCSS』の設定画面へ行くと、上の方に「Scss Location」、「Scss Location」の項目があるかと思います。
「Scss Location」にはScssファイルのある場所を指定。
「Css Location」にはコンパイルしたCSSファイルを置く場所を指定してください。
ドメイン以下のパス指定で大丈夫ですので、例えば(テーマのルートディレクトリ)/library/scss/であれば、「/library/scss/」になります。
もしScss用のディレクトリを用意していなければ、新規で作成しておいてください。
設定画面の「Compiling Mode」を「compressed」にして、設定完了です。
最後に「変更を保存」をしましょう。
自動的にScssフォルダのファイルをコンパイル!
すると自動的に指定したScssフォルダの中にあるScssファイルをコンパイルして、指定したcssフォルダに新規cssファイルを作成してくれます。
後は、htmlのheadからコンパイルされたcssファイルを読み込めばOK。
cssの編集はScssファイルを書き換えれば、プラグインが勝手にcssも更新してくれます。
コメントを残す