Share
Hasta ahora, en esta serie, hemos cubierto dos formas distintas de descartar los avisos persistentes de administración de WordPress. Desarrollaremos eso en esta cuarta y última parte de la serie de tutoriales al analizar dos métodos más específicos para descartar permanentemente sus avisos de administrador. Redondearemos las cosas mostrando cómo crear sus propios tipos de avisos de administrador personalizados y agregar decoraciones como iconos.
Ya sabemos cómo mostrar un aviso de administrador que se puede descartar. Todo lo que tenemos que hacer es agregar el es-descartable Clase CSS al elemento div que contiene. Sin embargo, esto es solo temporal y solo rechazará el aviso de la página actual. Tan pronto como la página se vuelve a cargar, vuelve a aparecer..
Hacer que se pueda descartar de forma permanente implica más código del que hemos visto hasta ahora, pero no es demasiado difícil de implementar. Echemos un vistazo a lo que implica, comenzando con una visión general.
Usaremos una opción personalizada para almacenar el estado de visualización de nuestro aviso de administrador. En la activación del complemento, esta opción se creará / actualizará y se establecerá en verdadero. El aviso de administrador solo se mostrará si la opción es verdadera actualmente.
La clave de este método es usar Ajax para permitirnos configurar la opción en falso cuando se hace clic en el botón de descartar. Una vez que se haya establecido correctamente en falso, el código condicional que verifica el estado de la opción fallará y el aviso de administrador ya no se mostrará.
Comencemos agregando el aviso de administrador, que será un simple aviso para comenzar. En Gwyer_Dismissible_Admin_Notices :: init (), añadir un nuevo add_action llamada:
Accentsconagua
add_action ('admin_notices', array ($ this, 'dismiss_admin_notice'));Luego agrega el dismiss_admin_notice () Función de devolución de llamada a la misma clase:
función pública dismiss_admin_notice () $ whitelist_admin_pages = array ('settings_page_admin-notices / plugin-options'); $ admin_page = get_current_screen (); if (in_array ($ admin_page-> base, $ whitelist_admin_pages)):?> Despídeme, si puedes. Jajaja!
Esto agrega un aviso de administrador que se muestra solo en la página de administración del complemento y es muy similar a lo que hemos visto en los tutoriales anteriores. La única pequeña diferencia aquí es que también hemos agregado un ID de CSS al aviso de administrador div envase. Esto se utilizará para orientar específicamente el aviso de administración que nos interesa..
Tendremos que agregar código JavaScript para que la llamada Ajax funcione, así que agregue un js carpeta en la raíz avisos de administrador Carpeta de plugin y dentro de crear un archivo llamado admin-notices.js. Agregue código al nuevo archivo para probar que se está cargando correctamente enviando un mensaje de consola.
jQuery (document) .ready (function ($) console.log ('admin-notices.js loaded!'););En Gwyer_Plugin_Options :: init (), añadir un nuevo add_action Llamado para poner en cola nuestro archivo de script:
add_action ('admin_enqueue_scripts', array ($ this, 'enqueue_scripts'));Solo queremos que este archivo de JavaScript se cargue en la página de opciones del complemento, por lo que necesitamos una manera de ponerlo en forma condicional. Podemos hacer esto verificando en qué página de administración estamos actualmente para ver si es nuestra página de opciones de complementos.
Podemos obtener un identificador de nuestra página de opciones de plugin almacenando el valor de retorno de add_options_page () en una propiedad de clase. No teníamos necesidad de este valor anteriormente, por lo que acabamos de llamar add_options_page () sin almacenar el valor de retorno.
Agregar una propiedad de clase a Gwyer_Plugin_Options:
protected $ plugin_options_page;
Entonces, en create_admin_menu_page (), Utilice esta nueva propiedad para almacenar el identificador en nuestra página de opciones de plugin:
función pública create_admin_menu_page () $ this-> plugin_options_page = add_options_page ('Avisos del administrador', 'Avisos del administrador', 'manage_options', __FILE__, array ($ this, 'render_options_page')); Finalmente, podemos poner en cola nuestro archivo JavaScript para que se cargue solo en la página de opciones del complemento:
función pública enqueue_scripts ($ hook) if ($ hook! = $ this-> plugin_options_page) return; wp_enqueue_script ('gwyer-admin-notice-js', plugin_dir_url (__FILE__). 'js / admin-notices.js'); Si todo fue bien, entonces verás una admin-notices.js cargado! mensaje enviado a la consola del navegador.
Actualizar el código de JavaScript en admin-notices.php a lo siguiente:
jQuery (document) .ready (function ($) $ (document) .on ('click', '# an1 .notice-dismiss', function (event) data = action: 'display_dismissible_admin_notice',; $. post (ajaxurl, data, function (response) console.log (response, 'DONE!'););););Aquí, estamos escuchando un evento de clic en el an1 ID de CSS que agregamos a nuestro aviso de administrador anterior. Tan pronto como se hace clic, se activa una solicitud Ajax. Vamos a manejar esa solicitud siguiente.
En Gwyer_Dismissible_Admin_Notices :: init (), añadir un nuevo add_action llamada:
add_action ('wp_ajax_display_dismissible_admin_notice', array (& $ this, 'display_dismissible_admin_notice'));Esto ejecutará la función de devolución de llamada una vez que el display_dismissible_admin_notice Ajax solicita fuego. Recuerde que esto originalmente fue definido como el data.action Propiedad en nuestra solicitud de Ajax..
Ahora agregue el display_dismissible_admin_notice función de devolución de llamada a Gwyer_Dismissible_Admin_Notices:
función pública display_dismissible_admin_notice () echo "Procesando solicitud Ajax ..."; wp_die ();
Guarde los cambios, vuelva a cargar la página de opciones del complemento y haga clic en el botón de desconexión de la notificación del administrador para ver la solicitud de Ajax en acción!
Si la solicitud fue exitosa, entonces verá una Procesando solicitud de Ajax… HECHO! mensaje mostrado en la consola del navegador.
La última pieza del rompecabezas es crear una opción personalizada inicialmente establecida en verdadero, pero que luego se establece en falso cuando se hace clic en el botón de descartar. Luego, cuando se carga la página de opciones del complemento, el aviso de administrador solo se muestra si el valor de la opción personalizada es verdadero.
En Gwyer_Dismissible_Admin_Notices :: init (), agregar una segunda llamada a register_activation_hook ():
register_activation_hook (plugin_dir_path (__FILE__). 'admin-notices.php', array ($ this, 'create_custom_option'));
Y añada el create_custom_option Función de devolución de llamada a la clase:
función pública create_custom_option () update_option ('gwyer-dismiss', true); Ahora, cuando el complemento está activado, una opción personalizada llamada gwyer-despedir se crea y se establece en cierto.
Actualizar display_dismissible_admin_notice () para actualizar nuestra opción personalizada cuando se enciende la solicitud de Ajax:
función pública display_dismissible_admin_notice () update_option ('gwyer-dismiss', false); wp_die (); Ahora todo lo que queda por hacer es actualizar dismiss_admin_notice () para verificar el valor de la opción personalizada y solo mostrar el aviso de administrador si está configurado en verdadero.
función pública dismiss_admin_notice () $ whitelist_admin_pages = array ('settings_page_admin-notices / plugin-options'); $ admin_page = get_current_screen (); $ display_status = get_option ('gwyer-dismiss'); if (in_array ($ admin_page-> base, $ whitelist_admin_pages) && $ display_status):?> Despídeme, si puedes. Jajaja!
Desactive y vuelva a activar el complemento para probar el código que hemos agregado. Visite la página de opciones de complementos, descarte el aviso de administrador y actualice la página. El aviso ya no debe ser visible. Hurra!
Debido a que la opción personalizada se establece en verdadero cada vez que se activa el complemento, puede repetir los pasos anteriores para probar el aviso de administrador que se puede descartar tantas veces como desee..
Para simplificar las cosas, este fue un ejemplo básico del uso de una solicitud Ajax para configurar la opción de notificación de administrador personalizada. En la práctica, desearía utilizar un valor nonce (número usado una vez) para validar la solicitud de Ajax como una medida de seguridad mínima.
Esto fue mucho trabajo para descartar permanentemente un aviso de administrador, pero el efecto final funciona bien y es algo que puede utilizar para tener un buen efecto en sus propios complementos..
Despido de aviso de administrador de acción personalizada
Es hora de ver un método ligeramente diferente para descartar los avisos de administración ahora. Este es un tipo de aviso de administrador que se muestra en todas las pantallas de administración y no se puede descartar hasta que se realice alguna acción..
Nota: use este método con precaución o se arriesgará a alienar a sus usuarios de complementos muy rápidamente!
La acción específica en la que nos enfocaremos en nuestro ejemplo será mostrar un aviso de administrador hasta que se instale y active un complemento requerido o una lista de complementos.
A diferencia del método anterior, en el que tuvimos que saltar a través de los aros para obtener un aviso de administrador que se puede descartar de forma permanente, la solución para este método es muy simple!
Primero, comenta todas las llamadas de función en Gwyer_Dismissible_Admin_Notices :: init (). Luego, agrega un nuevo add_action () función:
add_action ('admin_notices', array ($ this, 'install_plugin_to_dismiss_admin_notice'));Y define la devolución de llamada de la siguiente manera:
función pública install_plugin_to_dismiss_admin_notice () if (! is_plugin_active ('hello-dolly / hello.php')):?> Por favor instale y active el Hola muñequita enchufar.
¡Eso es todo al respecto! Te dije que era simple, ¿no??
Lo único que hicimos de manera diferente esta vez fue usar el is_plugin_active () Función de WordPress para probar si el plugin Hello Dolly está instalado y activado. Si no, is_plugin_active () devolverá falso, y se mostrará nuestro aviso de administrador.
Intente activar el complemento Hello Dolly para verificar que el aviso de administración desaparezca.
Esto funciona bien para complementos individuales, pero ¿qué sucede si desea recordar a los usuarios que activen varios complementos? En lugar de codificar en la información del complemento Hello Dolly, podríamos crear una matriz para incluir en la lista blanca los complementos necesarios..
Reemplazar install_plugin_to_dismiss_admin_notice () con:
función pública install_plugin_to_dismiss_admin_notice () $ required_plugins = array ('Hello Dolly' => 'hello-dolly / hello.php', 'Akismet' => 'akismet / akismet.php'); $ require_activating = array (); foreach ($ required_plugins as $ required_plugin_name => $ required_plugin_path) if (! is_plugin_active ($ required_plugin_path)) array_push ($ require_activating, $ required_plugin_name); if (! empty ($ require_activating)):?> Por favor, instale y active los siguientes complementos: .
Los complementos necesarios ahora se almacenan en una matriz que se repite en bucle para verificar si cada complemento ha sido activado. Para cualquier complemento que no esté activo actualmente, el nombre se agrega a un $ requiere_activar matriz que se envía a través del aviso de administración como una lista separada por comas de los nombres de complementos requeridos.
Avisos de administración personalizados
Antes de terminar, divirtámonos un poco al crear nuestros propios tipos de aviso de administrador personalizados. Veamos cómo agregar algunos tipos de avisos de administrador personalizados. Ya estará completamente familiarizado con los cuatro avisos de administración incorporados que WordPress proporciona de forma predeterminada, pero no es tan difícil crear algunos de los nuestros..
En primer lugar, sin embargo, comentar todas las llamadas de función en Gwyer_Dismissible_Admin_Notices :: init () así que empezamos en una pizarra limpia.
Necesitaremos agregar CSS para nuestros tipos de avisos de administrador personalizados, por lo que en la carpeta del complemento raíz agregue un css carpeta, y dentro de crear un archivo llamado admin-notices.css. Para ponerlo en cola en todas las páginas de administración, agregue un nuevo add_action llamar Gwyer_Plugin_Options :: init ().
add_action ('admin_enqueue_scripts', array ($ this, 'enqueue_styles'));Entonces, para el Enquistar_estilos () devolución de llamada, agregue este método a la misma clase:
función pública enqueue_styles () wp_enqueue_style ('gwyer-admin-notice-css', plugin_dir_url (__FILE__). 'css / admin-notices.css'); Ahora configuremos un nuevo método para generar nuestros avisos de administración personalizados. En Gwyer_Admin_Notices :: init (), añadir:
add_action ('admin_notices', array ($ this, 'custom_admin_notices'));Luego, agregue una devolución de llamada para mostrar una serie de avisos de administrador personalizados:
/ ** * Enviar notificaciones personalizadas de administrador. * / public function custom_admin_notices () ?> Houston, definitivamente creo que tenemos un problema.!
Enhorabuena, has ganado el premio al usuario Admin del año.!
Ahora esta es una gran idea.
Vamos a conectar!
Únete a Neo y sigue al conejo blanco. Si lo ves dale esta zanahoria. El conejo que es, no Neo.!
Finalmente, agregue CSS a admin-notices.css para diseñar nuestros avisos personalizados de administrador:
.notice-big-error border: 3px solid red; -webkit-transform: rotateZ (-1deg); -ms-transform: rotateZ (-1deg); transformar: rotateZ (-1deg); .notice-admin-user-award border-left: 5px solid purple; .notice-admin-user-award p: antes font: normal 24px / 1 'dashicons'; contenido: "\ f313"; color morado; .notice-light-bulb border-right: 5px solid # e2e224; .notice-light-bulb p: antes de fuente: normal 22px / 1 'dashicons'; contenido: "\ f339"; color: # e6e610; .notice-social-media border-left: 5px solid # 1da25f; parte inferior de relleno: 5px; .notice-social-media p padding-bottom: 0; margen inferior: 4px; .notice-social-media: después de font: normal 22px / 1 'dashicons'; contenido: "\ f301 \ f304 \ f462"; color: # 888; .notice-neo border-right: 10px solid orangered; borde izquierdo: 10px sólido en orangered; .notice-neo p: antes font: normal 22px / 1 'dashicons'; contenido: "\ f511"; color: orangered;
Después de guardar los cambios, cargue cualquier página de administración para ver nuestros avisos de administración personalizados.
A juzgar por los resultados, probablemente sea una buena idea usar avisos de administración personalizados con moderación, de lo contrario, correrá el riesgo de que se vean llamativos.
No entraré en detalles sobre el CSS personalizado usado. Es solo por un poco de diversión, y la mayoría del estilo es bastante autoexplicativo..
Usamos íconos de fuentes de dashicons para nuestros avisos de administración personalizados para mayor comodidad, ya que están disponibles en la administración de WordPress de forma predeterminada. Pero puedes importar y usar cualquier ícono que te guste para decorar más..
Prueba el código por ti mismo
Todo el código de esta serie de tutoriales se ha incluido en un complemento de WordPress para que lo descargue. Eche un vistazo al código, extiéndalo e implemente nuevas formas de mostrar (y descartar) los avisos de administración. ¡Asegúrate de hacerme saber en los comentarios si creas algo genial! Me encantaría ver lo que se te ocurre..
Conclusión
Gracias por acompañarme en esta serie de tutoriales de cuatro partes. Esperamos que ahora tenga mucha más confianza en la forma en que implementa los avisos de administrador en sus propios proyectos..
Hemos cubierto muchos aspectos diferentes de los avisos de administración de WordPress, incluidas varias formas de rechazarlos permanentemente, lo cual no es posible sin un código personalizado..
Crear tus propios avisos de administración personalizados también es bastante fácil, pero en la práctica querrías usarlos con moderación en tus propios proyectos. La mayoría de las veces es mejor mantener los estilos de WordPress predeterminados para una experiencia de usuario consistente.
WordPress tiene una economía increíblemente activa. Hay temas, complementos, bibliotecas y muchos otros productos que lo ayudan a desarrollar su sitio y proyecto. La naturaleza de código abierto de la plataforma también lo convierte en una excelente opción desde donde puede mejorar sus habilidades de programación. En cualquier caso, puede ver lo que tenemos disponible en el mercado de Envato..
Y no olvides descargar el complemento y jugar con el código. Es una excelente manera de familiarizarse con la forma en que todas las piezas encajan. Y, por favor, hágame saber sus pensamientos sobre el tutorial a través de los comentarios a continuación..
