web-dev-qa-db-ja.com

Editor-style.cssの強制リロード

TinyMCEエディタのスタイルシートを手動で変更したときにeditor-style.cssを強制的に更新する方法はありますか？変更はすぐには表示されませんが、管理バックエンドの管理側にキャッシュされます。

例えばこんな感じ：

editor-style.css?ver=3393201
csstinymceeditorcachevisual-editor
11
keatch

そのためのフックがあります：'mce_css'。これは_WP_Editors::editor_settings()内で呼び出され、ロードされたすべてのスタイルシートを最初の唯一のパラメータとしてカンマで区切って取得します。

今すぐ簡単です。グローバル変数$editor_styles（これは既に保存されているあなたのテーマと親テーマのエディタスタイルシートです）を使用して、ファイルの最後の変更の時刻をパラメータとして追加し、文字列を再構築します。

プラグインとして ：

<?php # -*- coding: utf-8 -*-
/**
 * Plugin Name: Refresh Editor Stylesheets
 * Description: Enforces fresh editor stylesheets per version parameter.
 * Version:     2012.07.21
 * Author:      Fuxia
 * Plugin URI:  http://wordpress.stackexchange.com/q/33318/73
 * Author URI:  https://fuxia.me
 * License:     MIT
 * License URI: http://www.opensource.org/licenses/mit-license.php
 */

    add_filter( 'mce_css', 't5_fresh_editor_style' );

    /**
     * Adds a parameter of the last modified time to all editor stylesheets.
     *
     * @wp-hook mce_css
     * @param  string $css Comma separated stylesheet URIs
     * @return string
     */
    function t5_fresh_editor_style( $css )
    {
        global $editor_styles;

        if ( empty ( $css ) or empty ( $editor_styles ) )
        {
            return $css;
        }

        // Modified copy of _WP_Editors::editor_settings()
        $mce_css   = array();
        $style_uri = get_stylesheet_directory_uri();
        $style_dir = get_stylesheet_directory();

        if ( is_child_theme() )
        {
            $template_uri = get_template_directory_uri();
            $template_dir = get_template_directory();

            foreach ( $editor_styles as $key => $file )
            {
                if ( $file && file_exists( "$template_dir/$file" ) )
                {
                    $mce_css[] = add_query_arg(
                        'version',
                        filemtime( "$template_dir/$file" ),
                        "$template_uri/$file"
                    );
                }
            }
        }

        foreach ( $editor_styles as $file )
        {
            if ( $file && file_exists( "$style_dir/$file" ) )
            {
                $mce_css[] = add_query_arg(
                    'version',
                    filemtime( "$style_dir/$file" ),
                    "$style_uri/$file"
                );
            }
        }

        return implode( ',', $mce_css );
    }
10
fuxia

現在のバージョンのWordPress（4.7.2）では、toschoの回答を得られませんでした。それは、TinyMCEのinit配列の cache_suffix が'wp-mce-' . $tinymce_versionに設定されているためと思われます。

その代わりに、 tiny_mce_before_init フィルタを使ってそれを上書きすることができます。

function wpse33318_tiny_mce_before_init( $mce_init ) {

    $mce_init['cache_suffix'] = 'v=123';

    return $mce_init;    
}
add_filter( 'tiny_mce_before_init', 'wpse33318_tiny_mce_before_init' );

もちろん、これはfilemtime()ほど良くはありませんが、少なくとも4.7.2ではうまくいきます。

注： これにより、他のエディタースタイル（skin.min.css、content.min.css、dashicons.min.css、およびwp-content.cssなど）にキャッシュバスターが追加されます。

9
icecold_3000

CSSファイルでadd_editor_styleを呼び出すだけでなく、キャッシュバスターのクエリ文字列パラメータを追加します。

add_action('admin_enqueue_scripts', function(){
  if(is_admin()){
    add_editor_style(get_template_directory_uri().'/assets/css/editor.css?1');
  }
});
5
user67624

私は同じ問題を抱えていました（2012、WP 3.4.2 !!）。このバグは回避されている間に考えられる解決策：

1）firebugを使用している場合、[Net]パネルの[x] Disable Browser Cacheを使用すると便利です。 私は、キャッシュされたエディタスタイルが一瞬（cssでフィルタリングされた）Firebugネットパネルに一瞬表示されるという非常に奇妙な問題を抱えていました。自分自身を証明するためにスクリーンショットを撮った。

2） ブラウザのフルキャッシュをクリアすると効果的です。 何らかの理由で、その後問題は再現しませんでした。

3）最後に、ステージングサーバーやライブサーバー上のクライアントにも段階的な改善が必要な場合は、私の推奨するアドバイス（煩わしいキャッシュクリアランスのアドバイスは不要）

ファイルを再配置して、カウントアップを続けます。 

// add_editor_style('editor-style-01.css'); bump for every deployment
// add_editor_style('editor-style-02.css');
add_editor_style('editor-style-03.css');

ハッキーだが信頼できる.

3
Frank Nocke

$editor_styles配列はテーマを使って追加されたスタイルシートしか含まないので、結果としてコアワードプレスやプラグインによって追加された残りのスタイルシートは返される文字列から取り除かれます。

以下は私がコードを微調整した後に思いついた解決策です、あなたはあなたのfunctions.phpファイルの中でそれを使うことができます。私の解決策はネストループを使用して$editor_styles配列に存在するスタイルシートをチェックし、最後に変更された時間を文字列を問い合わせるためのパラメータとして追加し、配列内の値を更新します。

add_filter('mce_css', 'fresh_editor_style');

function fresh_editor_style($mce_css_string){
    global $editor_styles;
    $mce_css_list = explode(',', $mce_css_string);

    foreach ($editor_styles as $filename){
        foreach($mce_css_list as $key => $fileurl){
            if(strstr($fileurl, '/' . $filename)){
                $filetime = filemtime(get_stylesheet_directory() . '/' . $filename);
                $mce_css_list[$key] =  add_query_arg('time', $filetime, $fileurl);
            }
        }
    }

    return implode(',', $mce_css_list);
}
0
Zorro Here