見出しのカスタマイズ２

前回に続いてワードプレスのcssについての話の２回目
前回のようにテーマのcssを書き換えてしまうと全てに影響します。それでいい場合は構わないけれど、一部分のみ変更したり、ページによって変えたい場合はちがった方法をとります。
cssのclass名を使って登録する方法です。例えばh4の設定で以下のように書きます。

この設定をテーマのcssに追記して、保存し、記事中に「テキスト」で以下のように書けばいいわけです。

しかし、これでは面倒ですね。そこでこうしたcssのclassをエディタにスタイルとして登録します。
そのためにはまずエディタの拡張プラグインであるTinyMCEをインストールしておきます。このプラグインはまず入れるべきものですから使っている人が多いでしょう。
設定→TinyMCE Advansed　で以下のように設定しておきます。

要するにエディタのcssを読み込むようにチェックをいれ、ツールバーに「スタイル」アイコンを入れておきます。
その上でエディタのcssに自分が書いたclassを追記します。

editor-style.cssはwp/wp-content/themes/テーマ名/cssにあります。これを一旦DLして、追記し、UPします。こうすると「スタイル」に登録されます。

文字列を選択し、「スタイル」からこれを選択すればこのスタイルが適応されるというわけです。

これはh4の見出しです。