384 | Guía definitiva para personalizar el admin de WordPress
23 Aug 2023 · 17 min
Podcast episode 384 (host Gonzalo Navarro) explains how to customize the WordPress admin/dashboard (appearance, menus, toolbar, dashboard widgets, media library, login/registration page and permissions) using either custom code (admin-specific CSS and PHP snippets) or plugins. The episode contrasts native, minimal options (profile color schemes, screen options) with full customizations achievable via an admin stylesheet, PHP snippets, or plugins. It recommends specific plugins (Supplier Order Email; Admin Menu Editor; Ultimate Dashboard; Admin Columns; WP Media Folder), mentions WordPress 6.3 Phase 3 admin redesign, and points listeners to episode notes and "zona código" videos for examples and code.
Chapters
En el episodio 384 de WordPress semanal te cuento cómo personalizar el dashboard de tu web WordPress a medida, tanto el diseño como los elementos. Vamos allá. Hola, hola, soy Gonzalo Navarro y Bienvenidos al episodio 384 de WordPress Semanal, el podcast en el que aprendes a crear y gestionar tus propias webs con WordPress en profundidad. Y hoy hablamos de cómo personalizar la parte de administración de WordPress. También escucharás Dashboard, backend, escritorio, en fin, toda la zona de atrás. Veremos cada opción de forma individual. Y además también te voy a hablar del estado actual en el momento en el que estoy grabando este episodio y lo que se espera del diseño de la parte de administración que te adelanto, por fin va a cambiar. Fantástico. Todo esto en un momentito, pero antes, como siempre, novedades. ¿Qué está pasando en Gonzalo Navarro es esta semana? Pues tenéis nuevo vídeo de la zona código. En él os enseño algo que de vez en cuando algunos me preguntáis porque bien por el tema que estáis utilizando, por el tipo de vídeo, porque va sobre vídeo que estáis incrustando o lo que sea. Hay veces que me preguntáis por qué un vídeo que ponéis en vuestra web no se hace responsive y como realmente hay poco control cuando tú incrustas un vídeo desde otro lugar, hombre, YouTube y Vimeo ya se van a hacer responsive normalmente por defecto, pero hay veces que no, por algún caso particular o si incrustas un vídeo de otra, de otro hosting de vídeo que no está preparado para el responsive, puedes tener problemas. Entonces te enseño cómo puedes crear una caja que envuelva ese vídeo para que le puedas aplicar el CSS que lo haga responsive, porque si no, modificando el CSS de la incrustación del vídeo no te va a funcionar, porque aunque tú lo veas visualmente, cuando se haga efectivo, cuando sea real en una página que visite alguien, como eso recoge automáticamente los estilos JavaScript y CSS de, pues imagínate, YouTube, Vimeo, de donde esté hecho, pues va a sobreescribir lo que tú hubieses hecho, porque digamos, tú no tienes control sobre esos estilos, sino que te los está dando el hosting de vídeo en cuestión. Pero podemos crear por fuera una zona donde estará el vídeo y ahí sí darle nuestro CSS y es lo que te enseño en este vídeo. Recuerda que en la zona código vemos cosas como estas, cómo hacer modificaciones en tu web sin utilizar plugins y no tienes que saber desarrollo ni nada. Ves el vídeo, copias el código que te dejo, lo pegas y lo tienes. Y van más de 330 vídeos, o sea que tienes infinidad de snipers de código y de pequeñas modificaciones muy útiles. En la zona de contenidos recomendados, que es donde te voy a dejar el enlace al vídeo nuevo de la zona código. Recuerda, puedes acceder a todo esto si escribes en tu navegador Gonzalo Navarro es 384, que es el número de este episodio. En todos los episodios escribes Gonzalo Navarro es el número del episodio y vas directo a las notas donde verás todo lo que comento en formato escrito con los enlaces relevantes para que tengas todo más a mano. Como digo, en esta zona de contenidos recomendados en las notas te voy a ir dejando clases de cursos interesantes, otros vídeos de la zona código también interesantes para que puedas aplicar algunas de las cosas de las que vamos a hablar en este episodio. Por ejemplo, una clase del curso de productividad en WordPress en la que te enseño a ordenar el menú de administración a tu antojo, es decir, toda la parte donde aparece entradas, páginas, plugins, medios, todo eso te enseño en esta clase no solo a reordenarlo como quieras, sino a ocultar los elementos que realmente no uses u ocultarlos a nivel de rol de usuario o a nivel de usuario específico, que esto yo lo uso mucho para mis ayudantes, solo les doy permiso para que vean los menús de administración que a mí me interesa. Bueno, una clase que está muy bien. Y te voy a hablar del plugin que utilizo en esa clase a lo largo del episodio. Sí, fantástico. Esto en cuanto a las novedades. Vámonos ahora con el plugin de la semana que se llama Supplier Order Email. Este plugin se lo recomendé creo que la semana pasada a un suscriptor porque necesitaba enviar automáticamente el pedido que se hacía en su web con WooCommerce a los proveedores. Si tienes la típica web con WooCommerce en la que tienes varios proveedores, en lugar de recibir el pedido del cliente, recopilarlo y enviárselo tú mismo al proveedor, pues esto envía automáticamente el resumen del pedido con todos los productos al proveedor en cuestión. De nuevo, se llama Supplier Order Email, pero lo tienes ya digo en las notas del episodio, es un plugin pequeñito que no está activo en demasiadas webs, pero hace lo que promete. Fantástico. Ahora sí, vámonos con el tema central del episodio, cómo personalizar la parte de administración de WordPress. Y vamos a hablar primero un poco del diseño actual de esta zona de administración de WordPress, que realmente lleva con el mismo diseño o muy parecido pues toda la vida. A ver, yo veo vídeos míos antiguos y sí que se nota un pequeño cambio, pero es mínimo, se ve todo un pelín más moderno, pero la estructura es la misma, los iconitos creo que son los mismos, me refiero por ejemplo a donde salen todos los menús en la izquierda, es prácticamente igual, No ha habido grandes cambios, han sido cositas mínimas, pero se viene lo mismo cuando si estás escuchando este episodio un poquito más adelante, pues ya está este cambio, pero se viene un rediseño importante a lo largo de la versión de WordPress 6.3 en la que ya estamos, lo que pasa que ahora mismo estamos en la fase 2 de unos grandes cambios que se están haciendo de dentro de WordPress y ya se va a entrar en la fase 3. Y en esta fase 3 entre otras cosas va a haber un rediseño de toda la parte de administración y va a ser, no sé si has visto o ya usas el editor de WordPress nuevo cuando tienes un tema basado en bloques donde básicamente desde una zona de diseño puedes controlar partes estructurales de la web, es decir, puedes diseñar la cabecera, el footer, también la estructura de tus páginas, tus entradas, etc. Todo esto se llama Full Site Editing, diseño global del sitio o edición global del sitio mejor dicho. Y si usas un tema basado en bloques que ya existen, pues puedes acceder a ello. Bueno, pues esta experiencia que se ve como más moderna, con unos paneles diferentes, con unos menús diferentes, es la que se está buscando o la que se parecerá a lo que tendremos en toda la administración de WordPress, no sólo en esta zona del editor, sino en todos lados, incluso plugins y cosas que añadamos cogerán este diseño, Estará todo preparado para que los plugins y demás puedan hacer este rediseño. Si queréis buscarlo podéis buscar en Google WordPress 6.3 Phase 3 Fase 3 y lo encontraréis. De todas formas voy a dejar un enlace, las notas del episodio, a ver si me acuerdo porque no lo había dejado, pero es interesante para que podáis verlo, sí bien esto es lo que nos espera en un futuro muy cercano o quizás en el presente si ya ha pasado cuando tú estás escuchando este episodio, pero aún así yo te voy a hablar de cómo puedes personalizar toda la parte del menú de administración, porque a pesar de que vayan a hacer un rediseño, tú vas a poder seguir modificando, quizás algunas cosas sean diferentes, pero como veremos ahora, prácticamente puedes modificar cualquier cosa que te propongas de la zona de administración. Primero vamos a ver qué se puede modificar ahora mismo sin añadir nada, ni plugins, ni un poquito de código, absolutamente nada. ¿Qué puedes hacer ahora mismo para cambiar algo de la zona de administración? Básicamente dos cosas. Puedes cambiar el color de los menús y de la barra de administración, esto lo puedes hacer a nivel de perfil, cuando te vas a editar tu usuario, puedes cambiar cómo ves el admin, pero muy poquitas cosas, ya digo, los colores y poco más. Y luego otra zona que puedes hacer desde la parte del escritorio, es decir, cuando tú accedes por primera vez a la parte de administración, en la zona hay un menú que es escritorio, sería como la parte de bienvenida de la zona de administración. Pues ahí tienes como cajitas que son paneles o widgets, que de hecho los plugins te suelen cargar eso de mil cosas, a mí me gusta dejarlo limpito, limpito, casi no tengo nada en el mío. Y esto lo puedes hacer muy fácil desde la esquina superior derecha de la pantalla, ves una zona que pone opciones de pantalla, le das y se te despliega una cajita donde puedes seleccionar y deseleccionar los elementos para que se muestren en el escritorio. Yo ahora mismo estoy mirando en el mío y tengo las estadísticas del podcast y la opción de Pretty Links, que es una cosa que uso para cortar los enlaces, ya está. Pero normalmente te sale la bienvenida, el estado actual del sitio, la actividad, que te salen como enlaces a información de novedades de WordPress, si tienes WooCommerce, pues las últimas ventas, si tienes Easy Digital Downloads lo mismo, la opción de crear borradores rápido, eventos y noticias. Todo eso aparece si tú no lo quitas, pues lo puedes quitar u ocultar mejor dicho. Pues esto es lo que puedes hacer básicamente sin añadir nada extra, es decir, muy muy muy poquito. Ahora qué puedo llegar a modificar realmente, aunque no sea de forma nativa, del Dashboard de WordPress, de la parte de administración, pues todo. Puedes cambiar el aspecto global, es decir, el diseño de todo, incluso hacer que separa, que no se parezca al menú de administración actual, dándole tu propio branding, tu propio logo, absolutamente todo. Puedes ocultar, reordenar y crear menús nuevos. Puedes modificar la toolbar, es decir, la barra de arriba de administración. Puedes desactivar partes que no uses, no solo ocultar, sino desactivar, por ejemplo estos paneles que te decía del escritorio, puedes desactivarlos directamente si quieres y que ni siquiera aparezca la opción de mostrarlo. Incluso puedes crearlos a medida, imagínate que es una web de un cliente o que tú quieres tener algo muy a medida y en la parte del escritorio pues te puedes crear tu propia cajita, tu propio panel y poner ahí lo que quieras. Puedes modificar incluso, digamos más allá, no solo en esta primera zona, sino un nivel más, por ejemplo, si le das a ver, todas las entradas se muestran como en una tabla, en la que se ve el título, la fecha, la categoría, todo ese tipo de cosas. Pues puedes también modificar esa tabla y hacer que algunos elementos se muestren, que otros no, añadir otras cosas que no ves. Y como te he comentado al principio, puedes hacer cosas tan chulas como controlar qué puede ver cada rol de usuario o incluso a nivel de usuario específico, Yo como administrador, pues puedo ver, imagínate todo. De hecho yo lo tengo, yo lo que he hecho es crear un menú que lo he llamado otros, donde meto todos los menús de la parte de administración que no uso a diario, que son muchísimos, muchos plugins te crean menús, te los ponen ahí y tú ese plugin lo configuras una vez y no lo vas a volver a configurar, entonces no tengo por qué estar viéndolo ahí en la barra de la izquierda, que además me ocupa mucho espacio y entonces pues tengo una zona de otros donde meto pues eso, lo que lo que no voy a modificar prácticamente nunca. Y además tengo reordenados los elementos del menú, por ejemplo en la biblioteca de medios no entro casi nunca, pues la tengo al final, en lugar de tenerla bastante arriba, ahora mismo ni recuerdo dónde aparece por defecto, pero aparece bastante arriba. Y luego tengo como separadores para que me quede, por ejemplo, los contenidos, entradas, cursos y la zona código los tengo como agrupados, después hay como un espacio y se muestran otros menús. Eso es lo que puedes hacer. Y luego por ejemplo a mi ayudante cuando accede no ve todo, ve solo las cosas que yo le dejo ver. Sí, pues todo esto es súper interesante, más allá, fíjate, de modificar el aspecto, estamos hablando de incluso pues funcionamiento o elementos que se puede ver que no se puede bien, ¿Cómo podemos hacer todo esto que te acabo de comentar? Y mucho más, porque seguro que me dejo cosas, de hecho por ejemplo se me está ocurriendo, no te ha hablado siquiera de la página de login o la página de registro que también forman parte de la zona de administración, que también puedes llegar a modificarlas pues al 100% totalmente a medida, incluso la URL. Bueno, ¿Cómo puedo modificar toda esta zona? ¿Todo lo que te acabo de comentar? Dos opciones, modificar el escritorio por código o modificarlo con plugins por código. Realmente puedes hacer todo lo que se hace con plugins, lo que pasa que algunas opciones son más sencillas y otras pues son menos. Por ejemplo, para modificar el diseño, es decir, el aspecto, puedes crear una hoja de estilos específica para el admin y ahí ir poniendo todo el CSS. ¿Por qué una hoja específica para el admin? Porque si tú por ejemplo haces como hacemos muchas veces, que te vas al personalizador de CSS de WordPress e intentas pegar una modificación para la zona de administración, no te va a hacer caso porque tiene una hoja de estilos diferente, esa parte es separado. Y también si utilizas el style CSS de tu tema hijo o de tu tema principal, tampoco te va a hacer caso, no está vinculado con la zona de administración, están solo vinculados con la parte frontal. Entonces tienes que crear un style CSS para la zona de administración. Esto te enseño a hacerlo en un vídeo de la zona código que te pongo enlazado y ahí pues ya pegas todo el CSS que quieras. También puedes inspeccionar, como vemos en otros vídeos, la parte de administración, inspeccionas el código, ves cómo quedan las modificaciones y te las llevas a tu style CSS nuevo específico para el admin. Ahí puedes ir cambiando todo, si sabes un poquito de CSS o si sigues alguno de los vídeos de la zona código, pues puedes ir modificando todo eso. Pero también puedes modificar textos, elementos y otras opciones con snippets de código, con un poquito de código PHP, te voy a dejar un enlace. He hecho una búsqueda en la parte de la zona código, he puesto admin y esa búsqueda te la dejo enlazada para que puedas hacer revisar. Hay un montón de vídeos en los que vemos cómo modificar el también la parte del login, del registro, te enseño todo esto de desactivar los paneles que no uses, crear tus propios widgets o paneles para el escritorio, modificar los elementos que se muestran en la toolbar, en la barrita negra de arriba. ¿Bueno, un montón de vídeos que puedes ver, de acuerdo? Entonces, digamos, a nivel de código lo puedes hacer prácticamente todo. Si eres suscriptor y hay algo que quieras hacer, escríbeme desde la zona de sugerencias de tu cuenta y lo apunto. Pero vamos, seguramente ya esté publicado porque he publicado muchísimos vídeos sobre cómo modificar el admin. Bien, que no quieres código, que pasas del tema. Hay plugins y muy buenos para hacer todo esto, casi todos tienen una versión gratuita y otra premium y los tienes digamos globales o específicos, por ejemplo para modificar todo el dashboard, toda la parte de administración, el aspecto, los paneles, los contenidos, hay un montón. Te voy a destacar Admin Menu Editor tiene versión gratuita y versión de pago que vemos en el curso de productividad en WordPress. Incluso hay cosas que no vemos, es un plugin tan completo. Esa clase está un poco enfocada a toda la la zona de los menús, todo lo que te he comentado antes de reordenar los menús, de la parte de administración, de ocultarlos, no ocultarlos, todo esto es lo que vemos en esa clase. Pero se puede hacer muchísimas más cosas. De hecho si te interesa puedo sacar un curso sobre cómo modificar por completo toda la zona de administración, me lo comentáis y pues lo apunto y lo sacamos. Este es uno de ellos, ya digo, os dejo el enlace a la clase. Pero hay más, tenéis Ultimate Dashboard que salió después, que hace cosas muy parecidas. Y si buscas en la zona de plugins de WordPress Dashboard Editor o algo así, vas a ver un montón de plugins. Te menciono estos dos porque son de los mejores que hay. Tienen versión gratuita bastante completa y luego versión premium también. ¿Y después los hay más concretos, por ejemplo tienes un plugin que te permite modificar esto, que te comentaba, te acuerdas que te he dicho si vas a todas las entradas, las ves, ves toda la relación de entradas en una columna? Pues esto se puede hacer por código. Yo te enseño por ejemplo en la zona código a que puedas filtrar por fecha, a añadir más elementos, a quitar elementos que no te interesen. Por ejemplo, yo en mi web publico yo solo, no me interesa ver la parte de autor, no quiero saber quién lo ha publicado porque siempre soy yo, entonces quito esa columna y me queda más limpito todo, un poquito menos colapsado. Pues bueno, esto ya digo, se puede hacer por código y lo tengo cubierto, pero también se puede hacer con este plugin, por ejemplo, que se llama, ya digo, Admin Columns, que también tiene versión gratuita y versión de pago y te permite añadir por ejemplo que puedas ver la imagen destacada y que se vea la imagen en sí. Bueno, algunas cosas bastante interesantes. Otros plugins para modificar partes específicas, digamos, yendo un nivel más allá, pues tienes plugins para la zona de medios, la zona multimedia. Aquí hay muchísimos plugins, podéis ir a la parte de WordPress. Org y buscar Media Library o por ejemplo Media Folders, cosas así, carpetas y demás. Y hay muchos, ya he hablado en otros episodios de preguntas y respuestas, me habéis preguntado por ello, incluso como había mucho interés en su día saqué un curso completo de cómo modificar, tener por carpetas y tener mucho más ordenado y con más control la zona de medios, la zona de biblioteca multimedia de WordPress. Y lo hacemos con el plugin WP Media Folder, que es premium, pero que podéis descargar para seguir el curso sin problemas. Ya sabéis que siempre recomiendo que si va a ser en un proyecto real que vais a publicar, que compréis la licencia para que podáis actualizar el plugin, pero ya digo, si queréis opciones gratuitas también podéis buscar en WordPress. Org porque hay bastantes. ¿Que recomiendo yo? A ver, si queréis digamos una personalización completísima, global, en la que incluso no se note ni qué es WordPress. Imaginad que creáis un proyecto para un cliente y que el cliente quiera que la experiencia por dentro, porque a lo mejor sus trabajadores o lo que sea sea, quiere que sea con toda su marca, que no parezca ni que es WordPress, pues seguramente aquí un plugin como Admin Menu Editor o Ultimate Dashboard sea muy útil porque puedes controlar todo, sobre todo con las versiones de pago que necesitáis una solo unas pequeñas modificaciones, pues yo tiraría por pegar un poquito de código, aunque no sepas merece la pena porque ya digo, yo los vídeos lo explico para gente que no sabe código, simplemente para que veas dónde tienes que pegar las cosas y demás, o si es una cosa muy concreta, como por ejemplo la parte de controlar las columnas de todas las entradas, pues puedes usar un plugin específico o también tienes la posibilidad de hacerlo con un pelín de código. Ya digo, hay muchísimos plugins, por ejemplo si estáis en la comunidad privada en Telegram, comentadme qué utilizáis vosotros para modificar, si es que lo hacéis, la parte de administración de WordPress y si no pues podéis escribirme por Twitter gonnabarroes y comentamos opciones. Fantástico. Nada más por este episodio, por último darte las gracias por estar ahí, por escuchar, ya sabes que si quieres aportar tu granito de arena puedes dejarme pues una valoración en Apple Podcast, una reseña en Spotify, seguir el podcast si no lo sigues aún, en la aplicación que utilices para escuchar podcast y por supuesto si piensas que le puede gustar a alguien te animo mucho a compartirlo con tus amigos, con compañeros de trabajo, familiares o incluso publicarlo en tus redes sociales por si le puede interesar a alguien. Nada más por este episodio, nos seguimos escuchando, adiós.
More from Gonzalo
518 | Redes sociales, precios personalizados, audios desde Drive y temas de bloques (Q&A)
513 | Por qué sigo usando estos plugins después de tantos años (y cuáles he abandonado)