web-dev-qa-db-ja.com

WordpressのTinymceエディタに独自のCSSを含むにはどうすればいいですか？

ロード時にTinymceエディタにテキストを追加しました。
（[新規追加]をクリックするたびに、このテキストが表示されます。）

しかし問題は、デフォルトのテキストで使用されているCSSクラスを有効にする方法です。

ありがとう

customizationcsstinymceeditoradd-editor-style
4
Wordpress D

add_editor_styleを使う

例：functions.php

add_editor_style('custom-editor-style.css');

http://codex.wordpress.org/Function_Reference/add_editor_style

8
Tom J Nowell

テーマにはadd_editor_styleをお勧めします。プラグインでmce_cssフィルターできます。以下のサンプルコードは here からのものです。

function plugin_mce_css( $mce_css ) {
  if ( !empty( $mce_css ) )
    $mce_css .= ',';
    $mce_css .= plugins_url( 'editor.css', __FILE__ );
    return $mce_css;
  }
add_filter( 'mce_css', 'plugin_mce_css' );
5
a_fan

私は何もうまくいきませんでした。 Googleで半日私を連れて行ったが、ついにこのスクリプトがうまくいくことにつまずいた。

function kwh_add_editor_style( $mceInit ) {

  $custom_css = get_theme_mod( 'custom_css' );
  $styles = '.mce-content-body { EDIT YOUR CUSTOM CSS HERE ' . $custom_css . '; }';

  if ( !isset( $mceInit['content_style'] ) ) {
    $mceInit['content_style'] = $styles . ' ';
  } else {
    $mceInit['content_style'] .= ' ' . $styles . ' ';
  }
  return $mceInit;
}
add_filter( 'tiny_mce_before_init', 'kwh_add_editor_style' );

スニペットのソース .

3
AA-T