Cómo personalizar el panel de administración en Joomla 4

Cómo personalizar el panel de administración en Joomla 4

En este artículo voy a mostrarte, de una forma muy sencilla, cómo personalizar el panel de administración en Joomla 4 para dar un aspecto más acorde con tus necesidades.

Cómo personalizar el panel de administración en #Joomla 4 - #MejorConJoomla #Joomla4 Tuitéalo

Lo primero que vamos a personalizar es la pantalla de acceso.

Por defecto tenemos una pantalla como la siguiente:

dashboard old

Como puedes ver, hay un apartado en la cabecera con el logo de Joomla y enlace a la parte front, un apartado lateral con información y enlaces de interés (que puedes usar para poner tus propias instrucciones) y un apartado central con el formulario de acceso.

Bien, pues con un poco de CSS (estilos), vamos a dejarla de esta manera:

panel despues

Ahora verás que hemos eliminado los apartados de cabecera y lateral (ya que no nos aporta en este proyecto) y hemos puesto nuestro propio logo (para que quede más corporativo).

Para hacer esto tenemos que seguir los siguientes pasos:

Pasos para personalizar página de acceso en Joomla 4

Primeramente vamos a entrar al panel y desde ahí tenemos que ir a la opción de menú Sistema > Estilos de plantilla de la administración.

sistema

Entramos en la plantilla que se llama "Atum - Default".

configuracion logo

Aquí tenemos los parámetros de configuración que nos permite la plantilla: entre ellas las siguientes (por pestañas):

  • Color del enlace: puedes definir el color de los enlaces.
  • Configuraciones de imágenes: Logotipo de inicio de sesión, marca grande y marca pequeña.

Para nuestro ejemplo de personalización subiremos nuestro logo en el campo correspondiente.

Una vez tenemos este paso, tendremos que crear un archivo CSS específico llamado user.css para que podamos sobre-escribir o añadir los estilos que vemos en la plantilla actualmente.

Para ello ahora tenemos que ir a Sistema > Planitllas de administración y entramos en la plantilla que se lama "Atum".

plantilla atum

Para crear este fichero tenemos que hacer clic en el botón de "Archivo nuevo". Se nos abrirá un popup (o ventana emergente) con un formulario que tenemos que rellenar para su creación:

formulario creacion

Los pasos para crearlo son los siguientes:

  1. Seleccionar la carpeta donde queremos guardarlo: css
  2. Ponerle un nombre: user (es importante que se llame así y que no le pongas la extensión .css)
  3. Seleccionar tipo de archivo: .css

Cuando hayamos rellenado el formulario con estos datos, pulsamos el botón de "Crear".

Ahora que ya tenemos este fichero, vamos a editarlo y añadiremos las siguientes líneas:

.view-login .header,
.view-login .sidebar-wrapper{
    display: none!important;
}

Guardamos el fichero y con esto conseguiremos la pantalla que te mostraba al inicio de este artículo.

Bueno, pues esta es la primera parte del artículo.

Teniendo ese fichero CSS (user.css) ya puedes cambiar todo lo que necesites de la plantilla.

Vamos ahora a adaptar la pantalla de inicio del panel de administración para poner los iconos/enlaces que más nos interesen para nuestros propósitos.

Cómo personalizar la pantalla de administración de Joomla 4

Como hice antes, te pongo una captura de cómo viene por defecto:

dashboard old

Y de lo que vamos a conseguir siguiendo los pasos que te contaré:

dashboard new

Puedes ver que ya no hay tantos módulos y que los que tenemos son los que utilizamos:

  • Primero uno con enlaces directos a las categorías de artículos que más se usan en la web, luego otro con enlaces directos a usuarios, artículos... Es decir, la configuración globarl del sitio (pero con algún detalle más, como el número de usuarios y artículos).
  • En la segunda fila tenemos las notificaciones (para saber si está o no actualizado el CORE de Joomla, las extensiones...) y un módulo de sistema (con enlaces a la edición de estilos y código de plantilla, desbloqueo, etc.
  • Por último, tenemos un enlace directo al navegador de ficheros de JCE (ya sabes que es el editor que más me gusta) y el módulo que te permite añadir más módulos a esta pantalla.

Venga, vamos ahora lo que te interesa: Cómo hacerlo.

Para quitar los módulos que no nos hacen falta solo los he despublicado. Lo puedes hacer directamente desde cada módulo haciendo clic en el icono de y luego haciendo clic en la opción de "Despublicar".

despublicar modulo

Luego he editado el módulo que, por defecto, se llama "Site" y he hecho los siguientes cambios:

editar modulo

  • He cambiado el nombre por Gestión
  • En los iconos de Usuarios y Artículos he cambiado la opción seleccionada de "Mostrar" a "Mostrar elementos con contador" para que, de esta forma, nos muestre el número de usuarios y artículos que hay.

Como puedes ver, el módulo presenta más opciones de configuración para mostrar/ocultar otros iconos. Puedes jugar con ellos para ponerlo según tus necesidades.

En el módulo llamado por defecto "System" he hecho más o menos lo mismo: he cambiado su nombre a Sistema y he añadido 2 iconos más: "Estilos de plantilla" y "Código de plantilla".

El módullo de "Multimedia", por defecto se llama "3rd Party". Aquí, a parte de cambiar el nombre, he cambiado el icono que muestra.

Decirte que este módulo aparece de forma automática cuando instalas JCE.

Y, seguramente, el que más te llame la atención sea el que he llamado "MejorConJoomla".

Para hacer esto he instalado una extensión de terceros. En concreto el módulo llamado "Custom Quick Icons". Se trata de un módulo de administración desarrollado por Joomill y que nos permite, a parte de esto, crear iconos (el que quieras) con enlaces a categoría de artículos, artículo específico, módulo específico o enlace personalizado.

La verdad que está muy bien pensado para poder poner enlaces donde quieras en función de tus necesidades.

Y ya está.

Con estos pequeños cambios creo que el panel queda con lo necesario para gestionar nuestra página web y acceder a los sitios que más se utilizan de forma rápida y sencilla.

Enlaces de interés

A continuación te pongo también algunos enlaces de interés relacionados con este artículo que seguro te pueden venir bien:

Espero que este artículo te haya gustado y lo pongas en práctica en tus proyectos web con Joomla.

Y si quieres ayudar a otros usuarios... Comparte el artículo ;-)

Cómo personalizar el panel de administración en #Joomla 4 - #MejorConJoomla #Joomla4 Tuitéalo

Joomla!® es Software Libre distribuido bajo licencia GNU/GPL
The Joomla!® name is used under a limited license from Open Source Matters in the United States and other countries.
mejorcon.joomla.es is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.