Share
Una delle cose migliori di WordPress è la sua vivace economia. Per molti utenti, è banalmente facile trovare temi adatti al design a cui mirano, o trovare plugin che forniscano funzionalità che vogliono introdurre nel loro sito.
Ma quanti di voi - come sviluppatori o designer - hanno ricevuto quella telefonata o quell'e-mail in cui il cliente afferma che qualcosa non va nel loro sito solo per scoprire che la console del browser mostra qualcosa su un errore relativo a JavaScript o jQuery?
Esattamente. Molto probabilmente chiunque abbia realizzato e / o gestito un sito per qualcuno ha riscontrato questo problema particolarmente se l'utente finale ha il permesso di aggiungere i propri plugin, consentire i propri aggiornamenti, ecc.
In questo post, esamineremo alcuni concetti relativi a jQuery e WordPress per assicurarci che noi, in quanto sviluppatori, non solo lavoriamo per creare correttamente i nostri prodotti, ma sappiamo anche come diagnosticare correttamente i problemi come si presentano in i siti dei nostri clienti.
Questo particolare argomento non è nuovo a Wptuts +. In effetti, abbiamo scritto un ampio articolo su di esso prima di completare con una serie di esempi di codice che dovrebbero fornire tutto ciò che è necessario per capire come lavorare con JavaScript in WordPress.
Ma mentre continuiamo ad osservare alcune pratiche in corso nella comunità che vorremmo risolvere, non ci interessa coprire più aspetti dello stesso argomento.
Quindi, prima di leggere questo articolo, assicurati di avere familiarità con come includere JavaScript e CSS nei temi e nei plugin di WordPress.
Quando si tratta di creare prodotti in WordPress, una delle cose che noi, come sviluppatori, dobbiamo provare a fare è trattare l'applicazione WordPress come una base.
In questo momento, l'API ci consente una grande quantità di flessibilità quando si tratta di creare temi, plugin e applicazioni, e questa è una buona cosa.
Ma quando iniziamo a rimuovere le librerie fornite con WordPress a nostro favore, è come se stessimo creando un "mini-fork" del progetto.
Questa non è una buona pratica da adottare.
Per quanto mi riguarda, WordPress viene fornito con il suo nucleo di funzioni e librerie che gli permettono di funzionare come fa. La modifica di parti cruciali dell'applicazione, ad esempio jQuery, non riguarda solo WordPress, ma l'intero ecosistema di prodotti su cui è basato.
Buoni temi e plugin dipendono dalla presenza di quelle librerie. Quando cambiamo tale funzionalità, potenzialmente interrompiamo ogni lavoro che dipende da loro.
Dobbiamo smettere di vedere WordPress come qualcosa che possiamo smontare e riassemblare quando ne abbiamo bisogno, e considerarlo come una base su cui costruire il nostro lavoro unico.
In generale, il problema dei conflitti JavaScript esiste per uno dei tre motivi. Uno sviluppatore ha:
In primo luogo, uno dei tre casi precedenti potrebbe essere fatto tutto in una volta, ma più spesso di quanto non sia uno dei precedenti. In secondo luogo, non penso che gli sviluppatori in genere lo facciano con malinteso.
Penso che sia più una mancanza di educazione e / o comprensione delle conseguenze.
Con questo, intendo che lo sviluppatore ha erroneamente ottenuto l'accesso alla libreria jQuery eseguendo noConflict, non restituisce correttamente la variabile al suo stato originale, o semplicemente rinomina la funzione di scorciatoia.
Più avanti in questo articolo, daremo un'occhiata alla best practice su come scrivere jQuery specifico per WordPress in modo che ci consenta di sfruttare appieno la libreria senza entrare in conflitto con altri plugin, temi o progetti.
Questo è qualcosa che viene spesso fatto con buone intenzioni: l'idea è che lo sviluppatore stia fornendo un aggiornamento alla versione di jQuery inclusa in WordPress in modo da poter scrivere nuove funzionalità o jQuery più moderni.
Il problema con questo è che i progetti precedentemente sviluppati non sono scritti con alcune delle funzionalità più recenti dell'ultima versione di jQuery. Inoltre, se jQuery ha deprecato o rimosso completamente una funzione nella nuova versione presente nella vecchia versione, impedirà il funzionamento di quel codice.
Anche se questo è un problema meno comune, è qualcosa che accade di tanto in tanto: nel tentativo di contribuire a velocizzare il caricamento di un sito, gli sviluppatori spostano l'ordine in cui jQuery viene caricato più in basso nella pagina, solitamente al piè di pagina.
Mentre caricare JavaScript nel piè di pagina è incoraggiato da numerosi siti di alto profilo, questo torna a pensare a WordPress, in modo olistico, come base per lo sviluppo di applicazioni.
Se WordPress, per impostazione predefinita, carica jQuery in una determinata posizione, quindi dobbiamo ricordarci di lasciarlo lì poiché tutte le opere che sono costruite sopra l'applicazione dipendono dal fatto che si trova in quella posizione e da nessun'altra parte.
Sebbene ci siano diversi modi per preparare i tuoi file sorgente JavaScript per usare jQuery, c'è un modo che io tendo a seguire perché protegge e incapsula completamente il $ funzione.
(function ($) "use strict"; $ (function () // Il tuo codice qui); (jQuery));
Puoi anche visualizzare l'essenza di GitHub qui.
In breve:
Questo fornisce una versione correttamente caricata di jQuery che utilizza lo standard
$riferimento alla funzione per permetterci di continuare a parlare del nostro lavoro.
Si noti che il "usare rigorosamente"la dichiarazione fornisce quanto segue:
La modalità rigorosa è una nuova funzionalità di ECMAScript 5 che consente di posizionare un programma o una funzione in un contesto operativo "rigoroso". Questo contesto rigoroso impedisce che alcune azioni vengano prese e genera più eccezioni
Per coloro che sono interessati, puoi leggere di più su questo sito.
Finalmente, il reale document.ready la funzione è facoltativa. Qui, viene utilizzato solo per mostrare come è possibile iniziare a utilizzare le funzioni standard di jQuery nel contesto del codice.
Si noti che la prossima versione di WordPress prevede di fornire una patch che renderà obsoleta questa particolare discussione, almeno per quanto riguarda il Dashboard.
Nello specifico, c'è attualmente un ticket in Trac in cui WordPress non ci permetterà di rimuovere jQuery dalla Dashboard. È una buona cosa.
In breve, i principali suggerimenti per questo articolo sono i seguenti:
Accentsconagua
$ funzione utilizzando le corrette funzionalità di JavaScriptDirei che fare qualsiasi altra cosa ti sta preparando per risultati potenzialmente cattivi.
