wordpressにcssの追加するとき、この狭い『追加CSS』に頑張って入力していませんか?
うまく保存されない、入力しにくいなど、何かと使いにくい。。と感じていませんか?
実は、the thorでは、”style-user.css” を使用することで、『追加CSS』と同様にcssの編集ができます。
比較的書きやすく、保存されないトラブルも少ないので、この方法でのCSSの編集を紹介します。
style-user.cssの編集方法
Point!
- 子テーマ(the thor child)を編集すること
- style.cssではなく、style-user.cssを編集すること
style-user.cssの場所
スタイルシート編集用のファイルがthe thor内にあります。
外観 ⇒⇒ テーマファイルエディター を選択。
次に編集するテーマを選択。今回の ”The thor child” を選択。
間違って親テーマを選択しないように注意してください。
The thor childの、”styele-user.css” を選択。間違って、”style.css”を選択しないようにしてください。
style.cssにも注意書きで以下のように書いてあります。
独自のスタイル(CSS)を追加する場合は、
現在開いている「style.css」ではなく、
style-user.cssを編集してください。
styele-user.cssは、何もcssを追加していいなければ、コードが何も書かれていないファイルが表示されると思います。
以下で、このstyele-user.cssにコードを追加していきます。
style-user.cssにcssの追加
後は、基本的に『追加CSS』の使い方と同じです。
一部のtagにcssを追加する場合は、タグ名.class名{}で記述します。
その後、各ブロックの『追加 CSS クラス』にclass名を書いて、更新します。
私の例で行くと、<h2>と<h3>にcss を追加するためにstyle-user.cssに以下のように記載しています。
以下のようにcssを追加したいブロックの高度な設定の『追加CSSクラス』にclass名を記述すると、cssが追加されます。
まとめ
あんな狭いところにひたすら打ち込むより遥かに楽だと思います。笑
ぜひこの方法でのcss追加してみてください。