Consejo rápido Incluir condicionalmente JS y CSS con get_current_screen

Como muchos dijeron antes: "Un buen ciudadano de WordPress solo carga sus archivos donde se necesitan". Este principio se aplica tanto al front-end como al back-end (admin). No hay justificación para cargar archivos CSS y JS en cada página de administración cuando solo los necesita en una sola página que creó. Afortunadamente, hacer las cosas de la manera correcta está a solo una función de distancia.

"Nunca incluya archivos CSS o JS en todas las páginas de administración. Esto causará conflictos con otros complementos".

Hay una función de WordPress para todo

Dado que casi todas las páginas de administración tienen una URL única, no es realmente difícil detectar cuándo se carga una determinada página y luego (y solo entonces) incluir los archivos JS y CSS que necesitamos. Nosotros podemos usar $ _SERVER ['REQUEST_URI'], o en muchos casos, la $ _GET ['action'] variable. Sin embargo, hay una forma mucho más fácil, limpia y estandarizada de hacerlo. Saluda a la get_current_screen función.

Cosas que debes saber sobre el get_current_screen función:

• Se introdujo en WordPress v3.1, por lo que si intenta usarlo en versiones anteriores, obtendrá un error de "llamada a función no definida". Utilizando la exista función La función para verificarlo es una buena idea si desea proporcionar una alternativa.
• No está disponible en el admin_init o en eso ganchos porque se inicializa después de que se llaman los ganchos.
• La función devuelve un WP_Screen Objeto con mucha información, pero estará interesado principalmente en el carné de identidad propiedad del objeto.
• No está disponible en el front-end (porque no sirve para nada).

Algunas líneas de código hacen toda la diferencia

Supongamos que su complemento tiene una página de opciones en el menú de configuración que creó con:

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

Necesita un poco de CSS y JavaScript extra en esa página, así que también agrega este código:

 // ¡Código incorrecto abajo! ¡No copie / pegue! add_action ('admin_enqueue_scripts', 'my_plugin_scripts'); function my_plugin_scripts () wp_enqueue_style ('farbtastic'); wp_enqueue_script ('farbtastic'); 

¡Eso es malo! ¡No hagas eso! El fragmento anterior incluirá CSS y JS para el selector de color Farbtastic en cada página de administración. Si otros complementos desean deshacerse de tus archivos incluidos en sus páginas, deben utilizarlos. wp_dequeue_ * Funciones para encolarlos. Eso es realmente innecesario y grosero de nosotros porque podemos escribir mejor código!

 add_action ('admin_enqueue_scripts', 'my_plugin_scripts'); function my_plugin_scripts () // Incluya JS / CSS solo si estamos en nuestra página de opciones si (is_my_plugin_screen ()) wp_enqueue_style ('farbtastic'); wp_enqueue_script ('farbtastic');  // Comprueba si estamos en nuestra página de opciones. La función es_my_plugin_screen () $ screen = get_current_screen (); if (is_object ($ screen) && $ screen-> id == 'settings_page_my_plugin') return true;  else devolver falso; 

Es realmente facil

Si echa un vistazo a nuestro código mejorado, puede ver que solo agregamos uno Si declaración y una función simple - is_my_plugin_screen que comprueba si estamos en la página de opciones de nuestro plugin. La variable $ pantalla sostiene el WP_Screen objeto que tiene muchas propiedades pero solo estamos interesados ​​en el carné de identidad uno. Ese carné de identidad consiste en un prefijo "settings_page_", que es el mismo para todas las páginas de configuración, y una cadena"mi_plugin"que es exclusivo de nuestro complemento porque lo definimos como el cuarto parámetro en el add_options_page Llamada de función.

El código es muy simple y fácilmente adaptable a cualquier pantalla de administración. Para ver qué es el ID de la pantalla actual, simplemente descargue el contenido de $ pantalla con:

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

Cosas para llevar a casa:

• Nunca incluya archivos CSS o JS en todas las páginas de administración; causará conflictos con otros complementos.
• Utilizar get_current_screen después en eso para saber cuándo está visible la pantalla de administración y solo así incluir archivos adicionales.
• Puede encontrar una lista de los ID de pantalla de administración principales en el Codex en Referencia de pantalla de administrador.
• Nunca hacer eco > o