wordpressでオリジナルテーマを作ってみよう⑤~SCSSのはじめのはじめ~

今回の記事ではscssのテンプレートです。
htmlにもだいたいいつも同じ記述をする部分があるのと同じようにcssにもそういう記述があります。

これは以下のサイトの1つ目のコードの「CSSをリセット」を少しだけ改良したものです。
打ち込むより簡単!保存しておくと便利なCSSスニペット18選|ferret [フェレット]
まだ僕は試せていないのですがこのサイトには色々な場面で役立ちそうなスニペットが掲載されているので、重宝しそうです。
タイトルにもある通りcssのメタ言語であるscssで書いてあります。
scssで書くことにより、より効率的にcssを書くことができます。
コンパイルとか環境を整えるのが少し面倒なのですが、wordpressにはWP-SCSSという自動コンパイルしてくれるプラグインがあったりするし、scss自体は全然難しくないのでまだ触ったことない人は試してみても良いかなと思います。

こんな感じでテンプレートの最初の最初が完成しました。
今こんな感じです。

う、、非常に見にくくて醜いですね。
というわけでこれからhtml,cssともに編集していって①で作ったようなサイトデザインに近づけていこうと思います。

コメントを残す