Richtiger Weg, um jquery-ui in die Warteschlange zu stellen

Es fällt mir schwer, JQuery-UI-Skripte und -Stile in mein Plugin aufzunehmen. Es scheint, dass meine wp_enqueue_scriptAnrufe einfach ignoriert werden.

Es gibt bereits viele ähnliche Fragen, aber alle Antworten, die ich bisher gefunden habe, laufen darauf hinaus, wp_enqueue_scriptinnerhalb des wp_enqueue_scriptsAction-Hooks anzurufen , was ich bereits tue.

Im Konstruktor meiner Klasse rufe ich auf:

add_action( 'wp_enqueue_scripts', array($this, 'enqueue_scripts') );

und dann unten:

public function enqueue_scripts()
{    
  wp_enqueue_script( 'jquery-ui-core', false, array('jquery') );
  wp_enqueue_script( 'jquery-ui-widget', false, array('jquery') );
  wp_enqueue_script( 'jquery-ui-mouse', false, array('jquery') );
  wp_enqueue_script( 'jquery-ui-accordion', false, array('jquery') );
  wp_enqueue_script( 'jquery-ui-autocomplete', false, array('jquery'));
  wp_enqueue_script( 'jquery-ui-slider', false, array('jquery'));

Ich habe überprüft, ob der Code tatsächlich bei jedem Laden der Seite ausgeführt wird. Auf den Seiten fehlen jedoch die <link>Tags für die jquery-ui-Bibliothek. Ich habe es bereits mit und ohne die jqueryim dritten Argument der wp_enqueue_scriptAufrufe explizit angegebene Abhängigkeit versucht .

Ich habe es auch mit einer einfachen WP 4.8-Installation versucht, bei der keine anderen Plugins als meine installiert wurden, und nur mit dem Standardthema 17. Kein Würfel.

Was ist los mit meinem Code?

Zunächst registriert WordPress die jQuery-Benutzeroberfläche über wp_default_scripts(). Abhängigkeiten sind bereits festgelegt, sodass Sie nur das Skript in die Warteschlange stellen müssen, das Sie wirklich benötigen (und nicht den Kern). Da Sie die Versionsnummer oder etwas anderes nicht ändern, ist es in Ordnung, nur das Handle zu verwenden.

// no need to enqueue -core, because dependancies are set
wp_enqueue_script( 'jquery-ui-widget' );
wp_enqueue_script( 'jquery-ui-mouse' );
wp_enqueue_script( 'jquery-ui-accordion' );
wp_enqueue_script( 'jquery-ui-autocomplete' );
wp_enqueue_script( 'jquery-ui-slider' );

Was die Stylesheets betrifft : WordPress registriert standardmäßig keine jQuery UI-Stile!

In den Kommentaren wies Butlerblog darauf hin, dass gemäß den Plugin-Richtlinien

Das Ausführen von externem Code innerhalb eines Plugins, wenn es nicht als Dienst fungiert, ist nicht zulässig, zum Beispiel:

• Aufrufen von CDNs von Drittanbietern aus anderen Gründen als zum Einschließen von Schriftarten; Alle nicht dienstbezogenen JavaScript- und CSS-Dateien müssen lokal enthalten sein

Dies bedeutet, dass das Laden der Stile über CDN nicht zulässig ist und immer lokal erfolgen sollte. Sie können dies mit verwenden wp_enqueue_style().

Wenn Sie Ihr eigenes Skript in die Warteschlange stellen, können Sie 'jquery-ui-accordion'beispielsweise nur die Liste der Abhängigkeiten hinzufügen . Alle erforderlichen Abhängigkeiten werden automatisch hinzugefügt. Beispiel:

wp_enqueue_script( 'my-theme', get_stylesheet_directory_uri() . '/js/theme.js', array( 'jquery', 'jquery-ui-accordion' ) );

Wird diesen Code generieren:

<script type='text/javascript' src='/wp-includes/js/jquery/ui/core.min.js'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/widget.min.js'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/accordion.min.js'></script>
<script type='text/javascript' src='/wp-content/themes/theme/js/theme.js'></script>

Ich habe dein Skript geändert. versuchen Sie es damit, es funktioniert.

add_action( 'wp_enqueue_scripts', array($this, 'enqueue_scripts') );
public function enqueue_scripts()
{    
  wp_enqueue_script( 'jquery-ui-core');
  wp_enqueue_script( 'jquery-ui-widget');
  wp_enqueue_script( 'jquery-ui-mouse');
  wp_enqueue_script( 'jquery-ui-accordion' );
  wp_enqueue_script( 'jquery-ui-autocomplete');
  wp_enqueue_script( 'jquery-ui-slider');
}