Modalitatea corectă de a încărca jquery-ui

20 iul. 2017, 11:46:57
Vizualizări: 42.1K
Voturi: 16

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?

0
Toate răspunsurile la întrebare 3
3
40

Î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().

20 iul. 2017 12:28:25
Comentarii

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

birgire birgire
20 iul. 2017 13:09:05

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

butlerblog butlerblog
25 feb. 2020 14:39:03

@butlerblog Mulțumesc pentru sugestie, am actualizat răspunsul.

kero kero
25 feb. 2020 14:45:31
0

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>
14 iun. 2018 20:29:05
2

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');
}
20 iul. 2017 12:21:20
Comentarii

Din păcate, în cazul meu nu funcționează.

Lucio Crusca Lucio Crusca
20 iul. 2017 12:36:37

@LucioCrusca Te rog să vezi răspunsul meu. În timp ce WordPress înregistrează scripturile jQuery UI, același lucru nu se întâmplă și cu stilurile, trebuie să faci asta manual așa cum am arătat

kero kero
20 iul. 2017 12:40:32