Modo corretto per accodare jquery-ui

Sto attraversando un periodo difficile, inclusi script e stili jquery-ui nel mio plugin. Sembra che le mie wp_enqueue_scriptchiamate vengano semplicemente ignorate.

Ci sono già molte domande simili a questa, ma tutte le risposte che ho trovato finora si riducono a chiamare wp_enqueue_scriptall'interno wp_enqueue_scriptsdell'hook dell'azione, che sto già facendo.

Nel costruttore della mia classe chiamo:

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

e poi, di seguito:

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

Ho verificato che il codice venga effettivamente eseguito ad ogni caricamento della pagina. Tuttavia, nelle pagine mancano i <link>tag per la libreria jquery-ui. Ho già provato con e senza la jquerydipendenza esplicitamente specificata nel terzo argomento delle wp_enqueue_scriptchiamate.

Ho anche provato con una semplice installazione di WP 4.8 senza plugin installati diversi dal mio e solo con il tema predefinito ventisette diciassette. Niente da fare.

Cosa c'è che non va nel mio codice?

Prima di tutto, WordPress registra l'interfaccia utente di jQuery tramite wp_default_scripts(). Le dipendenze sono già impostate, quindi devi solo accodare lo script di cui hai veramente bisogno (e non il core). Dal momento che non stai modificando il numero di versione o altro, puoi usare solo l'handle.

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

Per quanto riguarda i fogli di stile: WordPress non registra gli stili dell'interfaccia utente jQuery per impostazione predefinita!

Nei commenti, butlerblog ha sottolineato che secondo le Linee guida per i plugin

L'esecuzione di codice esterno all'interno di un plug-in quando non agisce come servizio non è consentita, ad esempio:

• Chiamata a CDN di terze parti per motivi diversi dalle inclusioni di caratteri; tutti i JavaScript e CSS non correlati al servizio devono essere inclusi localmente

Ciò significa che il caricamento degli stili tramite CDN non è consentito e deve essere sempre eseguito localmente. Puoi farlo usando wp_enqueue_style().

Se stai accodando il tuo script, puoi semplicemente aggiungere 'jquery-ui-accordion', ad esempio, all'elenco delle dipendenze. Tutte le dipendenze richieste verranno aggiunte automaticamente. Esempio:

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

Genererà questo codice:

<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>

Ho modificato la tua sceneggiatura. prova con questo, sta funzionando.

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