Suggerimento rapido include condizionatamente JS e CSS con get_current_screen

Come molti hanno affermato prima di me: "Un buon cittadino di WordPress carica solo i propri file dove sono necessari". Questo principio si applica sia al front-end che al back-end (admin). Non c'è alcuna giustificazione per il caricamento di file CSS e JS su ogni pagina di amministrazione quando ne hai solo bisogno su una singola pagina che hai creato. Per fortuna, fare le cose nel modo giusto è solo una chiamata chiamata via.

"Non includere mai file CSS o JS su tutte le pagine di amministrazione, causando conflitti con altri plugin."

C'è una funzione WordPress per tutto

Poiché quasi tutte le pagine di amministrazione hanno un URL univoco, non è difficile rilevare quando viene caricata una determinata pagina e quindi (e solo successivamente) includere i file JS e CSS di cui abbiamo bisogno. Possiamo usare $ _SERVER [ 'REQUEST_URI'], o in molti casi, il $ _GET [ 'action'] variabile. Tuttavia c'è un modo molto più semplice, più pulito e più standardizzato per farlo. Saluta il get_current_screen funzione.

Cose da sapere sul get_current_screen funzione:

• È stato introdotto in WordPress v3.1, quindi se provi ad usarlo nelle versioni precedenti riceverai un errore di "chiamata alla funzione non definita". Usando il function_exists la funzione da verificare è una buona idea se si desidera fornire un'alternativa.
• Non è disponibile nel admin_init o dentro ganci perché vengono inizializzati dopo la chiamata di questi hook.
• La funzione restituisce a WP_Screen oggetto con molte informazioni ma ti interesserà principalmente il id proprietà dell'oggetto.
• Non è disponibile sul front-end (perché non serve a nulla lì).

Alcune linee di codice fanno la differenza

Supponiamo che il tuo plugin abbia una pagina delle opzioni sotto il menu Impostazioni che hai creato con:

add_options_page ('My Plugin', 'My Plugin', 'manage_options', 'my_plugin', 'my_plugin_options');

Hai bisogno di un po 'di CSS e JavaScript in più su quella pagina, quindi aggiungi anche questo codice:

 // codice errato qui sotto! Non copiare / incollare! add_action ('admin_enqueue_scripts', 'my_plugin_scripts'); function my_plugin_scripts () wp_enqueue_style ('farbtastic'); wp_enqueue_script ( 'farbtastic'); 

Questo è male! Non farlo! Lo snippet qui sopra includerà CSS e JS per il selettore di colori Farbtastic su ogni singola pagina di amministrazione. Se altri plugin vogliono sbarazzarsi dei tuoi include sulle loro pagine che devono usare wp_dequeue_ * funzioni per rimuoverli. Questo è davvero superfluo e noioso perché possiamo scrivere un codice migliore!

 add_action ('admin_enqueue_scripts', 'my_plugin_scripts'); function my_plugin_scripts () // Include JS / CSS solo se siamo nella nostra pagina delle opzioni if ​​(is_my_plugin_screen ()) wp_enqueue_style ('farbtastic'); wp_enqueue_script ( 'farbtastic');  // Controlla se siamo nella nostra pagina delle opzioni function is_my_plugin_screen () $ screen = get_current_screen (); if (is_object ($ screen) && $ screen-> id == 'settings_page_my_plugin') return true;  else return false; 

È davvero facile

Se dai un'occhiata al nostro codice migliorato puoi vedere che ne abbiamo aggiunto solo uno Se dichiarazione e una semplice funzione - is_my_plugin_screen che controlla se siamo nella pagina delle opzioni del nostro plugin. La variabile $ schermo detiene il WP_Screen oggetto che ha molte proprietà ma a noi interessa solo il id uno. Quello id consiste in un prefisso "settings_page_", che è lo stesso per tutte le pagine delle impostazioni e una stringa"my_plugin"che è unico per il nostro plugin perché lo abbiamo definito come il 4 ° parametro nel add_options_page chiamata di funzione.

Il codice è molto semplice e facilmente adattabile a qualsiasi schermata di amministrazione. Per vedere qual è l'id dello schermo corrente, basta semplicemente scaricare il contenuto di $ schermo con:

eco '
'. print_r (get_current_screen (), true). '
';

Cose da portare a casa:

• Non includere mai file CSS o JS su tutte le pagine di amministrazione; causerà conflitti con altri plugin.
• Uso get_current_screen dopo dentro per scoprire quando la schermata di amministrazione è visibile e solo successivamente includere file aggiuntivi.
• È possibile trovare un elenco degli ID della schermata di amministrazione principale nel Codex sotto Riferimento della schermata di amministrazione.
• Non echeggiare mai > o