Che cos'è WP Enqueue e come si usa?

Quando impari per la prima volta l'HTML, l'unico modo in cui sai come inserire qualsiasi tipo di interattività è utilizzare i tag di script nell'intestazione o nel piè di pagina della pagina per impostare il tipo e l'origine di un file JavaScript esterno. (Oppure, se siete davvero solo l'apprendimento, l'intera funzione JS tra i tag di script proprio lì nel corpo stesso. Questo va bene per l'apprendimento, ma è abbastanza cattiva pratica una volta che ci si sposta nello sviluppo di WordPress avanzata. Inserire la funzione di accodamento.

Una volta passati oltre semplici siti Web di una pagina, quelle pratiche per principianti possono creare alcune situazioni davvero difficili. Man mano che inizi ad aggiungere sempre più JavaScript, il tuo sito web diventa sempre più lento. L'aggiornamento richiede più tempo. Alla fine, hai creato una grande pila di JavaScript-getti e non importa quanto ci provi, quella pila di noodles non si districherà.

Per fortuna, puoi utilizzare la funzione di accodamento in WordPress per aggiungere stili e script di cui il CMS si prende cura per te. Tutto il disordine è gestito per te. Sebbene non sia semplice come incollare direttamente lo script o gli stili desiderati nell'intestazione o nel piè di pagina di ogni pagina, è il modo giusto per gestirlo. WordPress non è molto supponente, c'è sicuramente una serie di best practice che dovresti conoscere

E wp_enqueue_scripts è in prima linea in queste pratiche.

Qual è il grosso problema?

Il motivo principale per cui vorrai utilizzare wp_enqueue è mantenere il tuo sito in esecuzione senza intoppi e rapidamente. La velocità della pagina è importante e l'utilizzo degli stessi script e stili più e più volte non aiuta. Affatto.

Fortunatamente, wp_enqueue è un esempio di programmazione funzionale. Tutto ciò significa che scrivi un singolo pezzo di codice da eseguire (il tuo frammento JavaScript) e usi wp_enqueue per chiamarlo invece di dover riscrivere/incollare l'intera cosa ogni volta che ne hai bisogno.

Quello è. Stupendo.

Ancora più fantastico, l'utilizzo del metodo di accodamento fa sì che WordPress stesso inserisca automaticamente i tag _script_ nell'intestazione e nel piè di pagina a cui appartengono, caricandoli senza doverli inserire separatamente in ciascuna pagina.

Sintassi e parametri di accodamento di WP

Accodare gli script in realtà non è così difficile. Se sei abbastanza esperto da lavorare con JavaScript in primo luogo, le funzioni PHP che utilizzi per l'accodamento saranno un gioco da ragazzi.

In un tipico tag di script , importerai direttamente il file .js esterno o incollerai l'intero lungo frammento di codice tra i tag stessi. (Questo è anche ciò che stai facendo se incolli qualcosa nel modulo del codice Divi o nei widget WP Custom HTML o Text).

Hai solo bisogno di conoscere alcuni parametri di base e la sintassi.

Il Codex fornisce questo come codice di coda di base:

wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );

Tutto sommato, è abbastanza semplice scomporre in bit utilizzabili per parametri.

• wp_enqueue_script() è la funzione all che metterà tutto il codice nella pagina dove va.
• $handle è un nome univoco per lo script stesso.
• $src rappresenta l'URL del file .js effettivo che stai accodando.
• $deps sono i $handle di tutte le dipendenze richieste da questo.
• $ver sarà il numero di versione. Se non viene specificato nessuno, viene aggiunta automaticamente la versione di installazione di WP.
• $in_footer o $in_header dice a WordPress dove mettere il tuo script.

La documentazione completa per accodare gli script può essere vista nel Codex.

Attenzione, studenti: la registrazione al WP inizia ora!

Oltre a _wp_enqueue__, WP ha anche un pratico metodo chiamato _wp_register__. Entrambi i metodi utilizzano gli stessi parametri e la stessa sintassi, quindi ottieni davvero un accordo di due a uno con la coppia di essi. In sostanza, registrare uno script equivale a nominare una funzione in JavaScript.

Sebbene non sia necessario, registrare i tuoi script può semplificarti la vita perché non dovrai dichiararli come dipendenze in seguito. Saranno già registrati. Quindi…_wp_register__. Una volta che uno script è stato registrato, puoi richiamarlo tramite il suo $handle , come vedrai nell'esempio seguente.

Registrerai il tuo codice in questo modo:

wp_register_script( 'jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js', false, null, $in_footer);

Quindi, ogni volta che ne avrai bisogno di nuovo, puoi sempre richiamarlo in questo modo:

wp_enqueue_script( 'jquery' ); 

Inoltre, la registrazione significa che non è necessario caricare uno script anche quando non è necessario. WPMU ha un fantastico esempio di creazione di shortcode: se registri lo script su uno shortcode che utilizza _wp_enqueue__, verrà utilizzato solo quando lo shortcode lo è. Tuttavia, se lo chiami solo accodandolo, verrà caricato anche quando lo shortcode non viene utilizzato.

Puoi leggere tutto sul metodo nel Codex.

Inoltre, gli autori dei plugin sono tenuti ad accodare gli script se vogliono essere inclusi nel repository di WordPress.org, quindi se questo è nel tuo piatto... è meglio mettersi in coda.

Metterlo insieme

L'implementazione del codice è facile. Basta inserire uno snippet come quello qui sotto nel tuo functions.php . e WordPress gestisce il resto. Voglio dire, questo è uno snippet di base per chiamare jQuery, ma puoi vedere come funzionano le cose insieme.

Normalmente useresti qualcosa che assomiglia a questo:

<script type="text/javascript" src="jquery.js"></script>

Una volta appreso come utilizzare enqueue_scripts_ , vedrai qualcosa di più simile a questo:

add_action('wp_enqueue_scripts', 'add_scripts');
function add_scripts(){
    wp_register_script( 'jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js', false, null, true);
    wp_enqueue_script( 'jquery' ); 
}

Ora, nota nel codice sopra come utilizza la funzione add_scripts()_ che fa già parte di WordPress per delineare l'ordine dei prossimi passaggi. Innanzitutto, la funzione wp_register_ ottiene tutti i dettagli specificati e inserisce lo script nel piè di pagina, quindi utilizza wp_enqueue per chiamarlo infine una volta che tutto è stato impostato.

Avvolgendo

Questo è davvero tutto quello che c'è da fare. Beh, non è vero: l'accodamento è una parte piuttosto radicata di WP. Ma queste sono le basi che ti portano a fare di più con WordPress di quanto potresti avere prima.

Le basi che tutti abbiamo imparato a inserire negli script quando abbiamo iniziato lo sviluppo web funzionano ancora, ma non sono sempre il modo migliore per fare le cose. Parte della bellezza di WordPress costruito su PHP è che puoi portare questo tipo di logica nel tuo lavoro pur mantenendo la stessa struttura di base e il flusso di lavoro che avresti comunque avuto.

Immagine in miniatura dell'articolo di hanss / shutterstock.com