Modalitatea corectă de a încărca jquery-ui
Am dificultăți în includerea scripturilor și stilurilor jquery-ui în plugin-ul meu. Se pare că apelurile mele wp_enqueue_script
sunt pur și simplu ignorate.
Există deja multe întrebări similare cu aceasta, dar toate răspunsurile pe care le-am găsit până acum se rezumă la apelarea wp_enqueue_script
în interiorul hook-ului de acțiune wp_enqueue_scripts
, lucru pe care îl fac deja.
În constructorul clasei mele apelez:
add_action( 'wp_enqueue_scripts', array($this, 'enqueue_scripts') );
și apoi, mai jos:
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'));
Am verificat că acest cod este executat efectiv la fiecare încărcare a paginii. Cu toate acestea, paginilor le lipsesc tag-urile <link>
pentru biblioteca jquery-ui. Am încercat deja cu și fără dependența jquery
specificată explicit în al treilea argument al apelurilor wp_enqueue_script
.
Am încercat și cu o instalare simplă de WP 4.8 fără alte plugin-uri instalate în afară de al meu, și doar cu tema implicită twenty seventeen. Fără succes.
Ce este greșit în codul meu?

În primul rând, WordPress înregistrează jQuery UI prin intermediul funcției wp_default_scripts()
. Dependințele sunt deja setate, așa că trebuie doar să încărcați scriptul de care aveți nevoie (și nu întregul nucleu). Deoarece nu schimbați numărul versiunii sau altceva, este suficient să folosiți doar handle-ul.
// nu este necesar să încărcați -core, deoarece dependințele sunt setate
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' );
În ceea ce privește foile de stil: WordPress nu înregistrează implicit stilurile jQuery UI!
În comentarii, butlerblog a menționat că conform Ghidului de Plugin-uri
Executarea de cod extern într-un plugin, atunci când nu acționează ca un serviciu, nu este permisă, de exemplu:
- Apelarea CDN-urilor terțe, cu excepția includerii fonturilor; toate fișierele JavaScript și CSS care nu sunt legate de servicii trebuie incluse local
Aceasta înseamnă că încărcarea stilurilor prin CDN nu este permisă și ar trebui să fie făcută întotdeauna local. Puteți face acest lucru folosind wp_enqueue_style()
.

ps: constructorul este nu un loc optim pentru adăugarea de hook-uri,

Dacă intenționați să trimiteți plugin-ul dvs. în depozitul wordpress.org, atunci trebuie să încărcați CSS-ul local (vezi: https://developer.wordpress.org/plugins/wordpress-org/detailed-plugin-guidelines/#8-plugins-may-not-send-executable-code-via-third-party-systems).

Dacă încărcați propriul script, puteți adăuga 'jquery-ui-accordion'
, de exemplu, în lista de dependențe. Toate dependențele necesare vor fi adăugate automat. Exemplu:
wp_enqueue_script( 'my-theme', get_stylesheet_directory_uri() . '/js/theme.js', array( 'jquery', 'jquery-ui-accordion' ) );
Va genera următorul cod:
<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>

Am modificat scriptul tău. Încearcă cu acesta, funcționează.
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');
}
