Wymuszanie przeładowania edytora-style.css

11

Czy istnieje metoda wymuszenia odświeżenia editor-style.cssprzy ręcznej zmianie arkusza stylów dla edytora TinyMCE? Modyfikacja nie pojawia się od razu, ale będą buforowane po stronie administratora zaplecza administracyjnego.

Na przykład tak:

editor-style.css?ver=3393201
keatch
źródło
Jeśli jest to do celów programistycznych, dlaczego nie po prostu przeprowadzić twardego odświeżania w przeglądarce lub wyłączyć pamięć podręczną przeglądarki?
sanchothefat
3
Miałem ten sam problem i ciężkie odświeżanie nie zawsze działa. Buforowanie wydaje się dość uparte.
Ray Gulick

Odpowiedzi:

10

Jest hak na to: 'mce_css'. Jest wywoływany, _WP_Editors::editor_settings()a wszystkie załadowane arkusze stylów są oddzielane przecinkami jako pierwszy i jedyny parametr.

Teraz jest to proste: użyj zmiennej globalnej $editor_styles(tutaj są już zapisane arkusze stylów edytora motywu i motywu nadrzędnego), dodaj czas ostatniej modyfikacji pliku jako parametr i odbuduj ciąg.

Jako wtyczka :

<?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 );
    }
fuxia
źródło
W WordPress 3.9 ta wtyczka wydaje się teraz łamać przyciski edycji obrazu. Nie miałem okazji dowiedzieć się, dlaczego.
mrwweb,
Aktualizacja 2016 : Dodanie tego kodu dokładnie tak, jak jest (ale w moim functions.phppliku zamiast wtyczki) w WP 4.6.1, działa idealnie. Wydaje się, że nie ma żadnych problemów z dodawaniem lub edycją multimediów bezpośrednio. To szalone, że nie można dodać argument add_editor_cssprzy filemtimeokazji można z wp_enqueue_stylelub nawet ciąg śmieci na końcu nazwy pliku ... ale to zupełnie działa.
indextwo
Dziękujemy za tę przydatną wtyczkę! Używam go z WP 4.9.6. Jedyny błąd, który znalazłem w tej chwili, to fakt, że wtyczka jest aktywowana, <!--more-->tag nie jest wyświetlany w TinyMCE. Wszelkie pomysły, jak mogę to rozwiązać?
pa4080
To przerywa ładowanie domyślnych stylów edytora.
xsonic
9

Nie mogłem uzyskać odpowiedzi toscho na działanie dla bieżącej wersji WordPress (4.7.2), i wydaje się, że dzieje się tak, ponieważ tablica inicjująca TinyMCE ma ustawioną wartość cache_suffix'wp-mce-' . $tinymce_version .

Zamiast tego możesz po prostu zastąpić to filtrem tiny_mce_before_init , na przykład:

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' );

Oczywiście nie jest to tak dobre filemtime(), ale przynajmniej działa to w 4.7.2.

Uwaga: powoduje to także dodanie bufora pamięci podręcznej do innych stylów edytora (takich jak skin.min.css, content.min.css, dashicons.min.css i wp-content.css)

icecold_3000
źródło
2
Jeśli trwa aktywne testowanie i programowanie, dodam numer „wersji”, który zawsze będzie inny. Jednym ze sposobów na osiągnięcie tego jest użycie sekund od Epoki Uniksa (1 stycznia 1970 r. 00:00:00 GMT) $mce_init['cache_suffix'] = "v=" . time(); lub czegoś jeszcze prostszego $mce_init['cache_suffix'] = "v=" . rand(100000000,999999999);
roberthuttinger 14.04.17.04
6

Zamiast po prostu wywoływać za add_editor_stylepomocą pliku CSS, dodaj parametr ciągu zapytania pomijania pamięci podręcznej:

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

źródło
Jest to do tej pory najłatwiejsza metoda, która działa bezbłędnie za każdym razem.
antikbd
1
Podoba mi się prostota tego podejścia i fakt, że nie dodaje ciągu zapytania do innych niepowiązanych arkuszy stylów. Połączyłem to z, filemtime()aby zautomatyzować aktualizacje pomijania pamięci podręcznej:add_editor_style(get_stylesheet_directory_uri() . '/editor-style.css?v=' . filemtime(get_stylesheet_directory() . '/editor-style.css'));
Josh Harrison
Kluczem jest tutaj, aby zawsze dołączać bezwzględną ścieżkę do danych plików css (tj. Use get_template_directory_uri()), gdy dołączasz klaster pamięci podręcznej; inaczej to nie zadziała.
Zoli Szabó
3

Miałem ten sam problem (2012, WP 3.4.2 !!). Możliwe rozwiązania tego błędu:

1) Jeśli używasz firebuga, pomaga [x] Wyłącz pamięć podręczną przeglądarki w panelu Net. Miałem nawet bardzo dziwny problem, że buforowany styl edytora na krótko pojawia się (w filtrowanym przez css) panelu sieci Firebug na ułamek sekundy, a następnie znika ponownie. Zrobiłem zrzuty ekranu, żeby się przekonać.

2) Pomaga pełne czyszczenie pamięci podręcznej przeglądarki. Z jakiegokolwiek powodu potem problem nie pojawił się ponownie.

3) Na koniec, moja preferowana rada, jeśli musisz się upewnić, to znaczy, że Twoi klienci na serwerze tymczasowym lub serwerze na żywo uzyskają twoje stopniowe ulepszenia (bez żadnych irytujących porad dotyczących czyszczenia pamięci podręcznej):

Przenieś plik i kontynuuj liczenie:

// 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');

Zuchwały, ale niezawodny.

Frank Nocke
źródło
0

Zakładam, że problem z zaakceptowaną odpowiedzią w najnowszych wersjach polega na tym, że $editor_stylestablica zawiera tylko arkusze stylów dodane przy użyciu motywu, w wyniku czego usuwa pozostałe arkusze stylów dodane przez podstawowy edytor tekstu lub wtyczki ze zwracanego ciągu.

Poniżej znajduje się rozwiązanie, które wymyśliłem po poprawieniu kodu, możesz go użyć w pliku functions.php. Moje rozwiązanie wykorzystuje zagnieżdżoną pętlę i sprawdza, czy arkusze stylów są obecne w $editor_stylestablicy, i dołącza czas ostatniej modyfikacji jako parametr do zapytania o ciąg i aktualizuje wartość w tablicy.

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);
}
Zorro Tutaj
źródło