こんにちは、方法はいろいろあると思いますが、
ビジュアルエディタでの話ですよね
例えば、tinymce advanced というプラグインで可能です
https://wordpress.org/plugins/tinymce-advanced/
インストールしたら、エディタ設定画面で、
高度なオプション CSS クラスメニューの作成 にチェックを入れます。
次に、editor-style.css がテーマの中にあると思いますので（ないのもあります）
.my-test{
color:red;
font-size:30px;
}
みたいに、クラスとスタイル指定を記述します。
投稿の編集画面で、エディタメニュー フォーマット / スタイルを選択すると
ドロップダウンリストの中に、my-testクラスが表示されるので、
適用する範囲を選択して、my-testクラスを選択すると適用されます。
が、li要素などには、追加できると思いますが、親要素に適用できるかどうかは解かりません。
そういった場合は、PHPを使った記述が必要になるかもしれないです。
TinyMCE Advancedというプラグインを有効化して、エディタで「スタイル」というプルダウンが表示されるようにしてください。
それとfunctions.phpに以下のようなstyle_formatsを指定しておくと、先のプルダウンから選択できるようになります。
function _my_tinymce($initArray) {
$style_formats = array(
array(
'title' => '表組1',
'selector' => 'table',
'classes' => 'table1'
),
array(
'title' => '表組2',
'selector' => 'table',
'classes' => 'table2'
),
);
$initArray['style_formats'] = json_encode($style_formats);
return $initArray;
}
//TinyMCE Advancedより後に実行されるように、10000番ぐらいにフック登録
add_filter('tiny_mce_before_init', '_my_tinymce', 10000);
参考ページ
http://takahashifumiki.com/web/programing/1667/
TinyMCE公式ページ
View sourceでstyle_formatsのサンプルが分かるかと思います。
http://archive.tinymce.com/tryit/custom_formats.php
さっそくご回答ありがとうございます！
TinyMCE Advancedを使えば独自のスタイルを追加できるのは分かったのですが、WPのデフォルトのボタンで追加されるulやtableにクラスを追加するのは難しいのでしょうか？
それだったらラッパー要素からルール指定したらどうでしょうか。
.entry-content tableとか.entry-content ulなんかでやるのか簡単かと思います。
お返事ありがとうございます！
.entry-content ulですと、違うulを使いたいときにいったんクラスなしのulにかけたスタイルを上書きで消さないといけないですよね？それが嫌なので、できればデフォルトの要素にもクラスがつけれたら嬉しいんですよね。
例えば下記のような感じです。
<div class="entry-content">
<ul class="nav">
<li><a href="kudamono">果物</a><li>
<li><a href="yasai">野菜</a><li>
</ul>
<ul>
<li>りんご</li>
<li>なし</li>
</ul>
</div>
とここまで書いて、もしかしてCSSで何とかできるかもと思い調べてみたら否定擬似クラスというのがありました。これを使えばクラスなしとありを管理できそうです。
http://zero.css-happylife.com/selectors/not.shtml
なるほど、ブラウザ要件がクリアできるのであればそれも選択肢になりますね。
私ならnavの方をolとかdivで置き換えるとかするかなと思いました。
