X

WordPress備忘録 SCSSを初めて知ったって話

あるテーマの編集を試した時に、とりあえず、ヘッダー部分の背景色を変えようと、スタイルシートに書き込んでみたが反応がない。そもそも、よく見ると、ダッシュボードの外観、スタイルシートにヘッダー部分の記載がほとんどない。

こりゃ、他からスタイルシートを読み込ませてるな!と、FTPソフトでテーマフォルダの中を見ると、幾つもフォルダが有ったので、ダウンロードして中味を確かめると、幾つかスタイルシートのファイルがあったので、とりあえず、片っ端から開いて見たのだ。

すると、「あ~、ここで、ヘッダーの背景色を指定してたのか!」って箇所があったので、直して、アップロードしてみたが、何も変化せず・・・。

一体、どういう事やねん!?と、再度、そのファイルを開いてよく見ると、何かおかしい・・・。スタイルシートファイルのようなのに、スタイルシートとは、何か違う・・・。

と、改めてファイル名を見てみると、拡張子がcssではなく、scssになっている。scssって何やねん?と、調べて、初めて、お恥ずかしながら、その存在を知ったのだ。(^^;

SCSSの詳しい説明は、あちこちにあるので、割愛させてもらうけど、コンパイルによってCSSを出力するメタ言語ってことらしい。変数が使えたり、ネストできたり、何かと便利なようだ。まっ、ちゃんと勉強しなくても、おおよそ分かれば、とりあえず、中味はCSSの変形版みたいな書き方だから、既存のものを修正するくらいなら、問題はなさそうだ。

で、最終的にWordpressで、修正したものを反映させる為には、コンパイルしないといけないんだけど、探したら、WP-SCSSなんていうSCSSをコンパイルしてくれるプラグインが有ったので、早速インストール。

設定も、Scss Locationの項目にSCSSファイルが入ってるフォルダを指定するのと、CSS Locationの項目にCSSファイルを吐き出すフォルダを指定するだけだ。設定を保存したら、あとは、SCSSファイルを編集してアップロードするだけで、勝手にコンパイルをやってくれるのだ。(^^)

 

 

 

矢村やすけ: 矢村やすけと申します。 僕が住む、安曇野には八面大王伝説という伝説があります。その伝説の中で、妖力の強い八面大王をうつ為の矢に使う三十三節ある山鳥の尾羽を、矢村に住んでいた弥助が坂上田村麿呂に献上します。現在、僕が住んでいる場所が、その矢村地区に近いので、矢村やすけとしました。 安曇野の地名は、この八面大王伝説由来のものが多いです。そんな伝説に彩られた安曇野の風景を主にスマホ写真で投稿していきます。(^^)

This website uses cookies.