web-dev-qa-db-ja.com

add_editor_styleはフロントエンドでロードされていません。何か解決策はありますか?

これはデフォルトのwordpress add_editor_style関数です。

function add_editor_style( $stylesheet = 'editor-style.css' ) {

    add_theme_support( 'editor-style' );

    if ( ! is_admin() )
        return;

    global $editor_styles;
    $editor_styles = (array) $editor_styles;
    $stylesheet    = (array) $stylesheet;
    if ( is_rtl() ) {
        $rtl_stylesheet = str_replace('.css', '-rtl.css', $stylesheet[0]);
        $stylesheet[] = $rtl_stylesheet;
    }

    $editor_styles = array_merge( $editor_styles, $stylesheet );
}

ご覧のとおりif ( ! is_admin() ) return;があり、基本的にはフロントエンドのwp_editorにカスタムスタイルを追加することはできません。それに対する適切な解決策は何ですか?

3
Ünsal Korkmaz

これが私の解決策です:

add_filter('the_editor_content', "firmasite_tinymce_style");
function firmasite_tinymce_style($content) {
    add_editor_style('assets/css/custom.css');

    // This is for front-end tinymce customization
    if ( ! is_admin() ) {
        global $editor_styles;
        $editor_styles = (array) $editor_styles;
        $stylesheet    = (array) $stylesheet;

        $stylesheet[] = 'assets/css/custom.css';

        $editor_styles = array_merge( $editor_styles, $stylesheet );

    }
    return $content;
}

ライブ例: http://unsalkorkmaz.com/firmasite-social-buddypress-bbpress-theme-based-on-bootstrap/ コメントの確認wp_editor ..その読み込みbootstrap.cssとグーグルのフォントなど。

このコードは余分です:

// Removing wordpress version from script and styles
add_action("wp_head", "firmasite_remove_version_from_assets",1);
function firmasite_remove_version_from_assets(){
    function remove_cssjs_ver( $src ) {
        if( strpos( $src, '?ver=' ) )
            $src = remove_query_arg( 'ver', $src );
        return $src;
    }
    add_filter( 'style_loader_src', 'remove_cssjs_ver', 999 );
    add_filter( 'script_loader_src', 'remove_cssjs_ver', 999 );
}

そのスタイルとスクリプトからの削除バージョン。そのため、ブラウザは同じスタイルを2回ロードしません。

6
Ünsal Korkmaz

add_editor_style は、フロントエンドにスタイルシートをロードするためのものではありません。これは、サイトのバックエンドにビジュアルエディタを表示することを、フロントエンドの投稿の最終版のように見せるためのものです。あなたがその振る舞いを変えることを可能にするフィルタ(あなたは関数のソースを見つけた)はありません。

フロントエンドにエディタがある場合は、フロントエンドで他のものと同じようにスタイルを設定します - style.cssを編集するか、 wp_register_stylewp_enqueue_style 、および wp_enqueue_scripts

function load_front_editor_style_wpse_87256() {
  if (!is_page_template('editor.php')) return false;
  wp_register_style( 'fedstyle', get_stylesheet_directory().'/path/to/stylesheet', false, null, 'all' );
  wp_enqueue_style( 'fedstyle' );
}
add_action( 'wp_enqueue_scripts', 'load_front_editor_style_wpse_87256' ); 

私はあなたのエディタがどのように動くのかわかりませんが、私はeditor.phpという名前のテンプレートにのみエディタをロードするべき条件を含めました。私はそれが間違っていると確信していますが、実例となるべきです。

警告:あなたのフロントエンドエディタが何であるか、あるいはどのように動作するのかわかりません。私はそれがあなたが正面にロードしたコアエディタだと思います。 adminスタイルシートを直接編集すると(適切かどうかにかかわらず)、バックエンドエディタの外観が変わることを私は知っています。正面についても同じことが言えます。

http://codex.wordpress.org/Function_Reference/get_stylesheet_directory
http://codex.wordpress.org/Function_Reference/is_page_template

2
s_ha_dum