Cum să Incluzi Fișiere jQuery/Javascript Externe în WordPress

Question

Cum să Incluzi Fișiere jQuery/Javascript Externe în WordPress

17 aug. 2010, 15:04:23

Vizualizări: 22.9K

Voturi: 15

Folosesc Starkers ca bază pentru următoarea mea temă WP și am întâmpinat o mică problemă. Includeam propria versiune de jQuery în fișierul header.php, dar când am inspectat site-ul folosind Firebug am observat că jQuery era descărcat de două ori. După ce am investigat, am observat că nu doar eu includeam fișierul, ci și funcția wp_head().

Încercând să rezolv problema, am observat un comentariu în fișierul header, care provine inițial din tema Twenty Ten:

/* Întotdeauna folosește wp_head() chiar înainte de tag-ul de închidere </head>
 * al temei tale, altfel vei strica multe plugin-uri, care
 * în general folosesc acest hook pentru a adăuga elemente în <head>, cum ar fi
 * stiluri, scripturi și meta tag-uri
 */

Iată problema mea: am impresia că fișierul jQuery trebuie setat înainte de orice alt fișier care vrea să-l utilizeze și că wp_head() ar trebui să fie ultimul lucru din elementul <head>. Sunt puțin confuz acum și mă întreb dacă ar trebui să pun wp_head() la început pentru ca fișierul jQuery inclus de WP să fie folosit pentru toate plugin-urile mele, deși se specifică să nu fac asta.

Am comentat linia jQuery din funcția wp_head(), dar este necesară pentru pagina de administrare, așa că a trebuit să o pun înapoi.

De asemenea, aș dori să folosesc (cel puțin să experimentez) cu versiunea jQuery de la Google CDN, dar nu vreau să o includ de două ori!

Sper că înțelegeți ce încerc să explic. Orice sugestii despre cum pot rezolva această problemă ar fi apreciate. De asemenea, aș aprecia orice sfat despre cum gestionați fișierele JavaScript în fișierul header.

Mulțumesc!

Ben Everard

1.28K

teme personalizare dezvoltare teme jquery wp head

Comentarii

Aceasta ar trebui redenumită în ceva de genul "Cum să conectezi fișiere externe jQuery/Javascript în WordPress."

MikeSchinkel

17 aug. 2010 23:26:47

Sunt de acord, nu eram sigur cum să o numesc deoarece nu eram prea familiarizat cu problema pe care o aveam :-)

Ben Everard

18 aug. 2010 12:51:29

Toate răspunsurile la întrebare

Comentarii

Ai dreptate să crezi că adaug scripturi folosind tag-ul <script>, aceasta era alternativa pe care o căutam, mulțumesc mult! :-)

Ben Everard

17 aug. 2010 16:19:45

Dacă vrei să adaugi scriptul tău doar în partea de front end, folosește hook-ul 'template_redirect' în loc de 'init'.

John P Bloch

17 aug. 2010 17:08:29

Foarte bine, voi actualiza răspunsul meu. Aproape că am sugerat să încapsulez enqueue în is_admin().

User

17 aug. 2010 17:35:33

În general, încarc scripturile în fișierul template înainte de get_header(), făcând acest lucru în functions.php le va încărca pe fiecare pagină, ceea ce poate să nu fie necesar. Dacă am un script global, îl încarc în header.php înainte de apelarea lui wp_head(). În acest fel, scripturile încărcate vor fi acolo unde te-ai aștepta să le găsești în <head>

Joe Hoyle

17 aug. 2010 21:47:22

Uneori este mai bine să adăugați scripturile la sfârșitul paginii. Acesta este ultimul parametru al http://codex.wordpress.org/Function_Reference/wp_enqueue_script (al 5-lea, $in_footer), setați-l la true. O mică informație pentru cei care au nevoie de mai mult control.

hakre

18 aug. 2010 14:55:39

Arată celelalte 1 comentarii

Vă sugerez să aruncați o privire la 5 sfaturi pentru utilizarea jQuery cu WordPress. Printre altele, articolul arată codul necesar pentru încărcarea jQuery din biblioteca Google:

function my_init() {
    if (!is_admin()) {
        // comentează următoarele două linii pentru a încărca versiunea locală de jQuery
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js', false, '1.3.2');
        wp_enqueue_script('jquery');
    }
}
add_action('init', 'my_init');

De asemenea, puteți consulta și plugin-ul Use Google Libraries.

Travis Northcutt

3.4K

17 aug. 2010 17:01:59

Comentarii

Acesta este de fapt un răspuns mai bun, deoarece arată cum să încarci versiunea jQuery de pe CDN-ul Google. Totuși, așa cum a sugerat John în altă parte, dacă vrei să faci asta doar pe front-end, folosește hook-ul template_redirect în loc de init.

EAMann

17 aug. 2010 17:34:49

Bună observație legată de locul unde se încarcă. Deși, în realitate, zona de administrare folosește și ea jQuery, nu? Oricum, mulțumesc pentru așa cum ai arătat cum să controlezi acest lucru.

Travis Northcutt

17 aug. 2010 19:56:32

Da, tocmai am găsit postarea cu 5 sfaturi despre jQuery/WP, mulțumesc pentru răspuns :-)

Ben Everard

17 aug. 2010 20:34:21

5 sfaturi pentru utilizarea jQuery cu WordPress -- link-ul nu mai funcționează.

hakre

13 nov. 2010 00:52:31

NOTĂ: Exemplul include o versiune "mai veche" de jQuery, versiunea actuală de WP (3.0.1) rulează jQuery 1.4.2 ...

t31os

17 nov. 2010 17:06:04

Arată celelalte 1 comentarii

Deși @tnorthcutt are dreptate că ar trebui să dezactivezi corect jquery-ul nativ din WordPress dacă vrei să încarci propria versiune, vei întâmpina cu siguranță probleme când încarci o altă versiune de jquery decât cea din nucleul WP. Atât nucleul, cât și plugin-urile se bazează pe prezența acestuia. Așadar, dacă nu actualizezi tema ta cu cea mai nouă versiune de jquery de fiecare dată când WordPress este actualizat, site-ul tău poate avea probleme.

Următorul cod va asigura că tema ta încarcă întotdeauna versiunea corectă de jquery, verificând mai întâi ce versiune folosește WordPress și apoi încărcând aceeași versiune de la Google:

$wp_jquery_version = $GLOBALS['wp_scripts']->registered['jquery-core']->ver;
$jquery_version = ( $wp_jquery_version == '' ) ? '1.8.3' : $wp_jquery_version; // rezervă, pentru orice eventualitate 
wp_deregister_script('jquery');
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/'. $jquery_version .'/jquery.min.js', $jquery_version, false );
wp_enqueue_script('jquery');

cjbj

15K

31 oct. 2016 11:27:42

User 100 · Accepted Answer · 2010-08-17T15:53:01Z

Din formularea întrebării tale, probabil adaugi scripturi scriind tag-uri <script> în template. Adaugă propriile scripturi folosind wp_enqueue_script() în functions.php al template-ului tău, setând corespunzător dependențele de jQuery, iar wp_head() va adăuga scripturile pentru tine.

function my_scripts() {
    wp_enqueue_script( 'my-sweet-script', get_bloginfo('template_directory') . '/script.js', array('jquery') );
}
add_action('template_redirect', 'my_scripts');

Vezi pagina din codex pentru mai multe informații.

User

100

17 aug. 2010 15:53:01