(Tiempo estimado: 2 - 4 minutos)

El pasado fin de semana un usuario me preguntaba si había alguna forma de personalizar el back de Joomla. Que había buscado información y no encontraba nada...

Así que he decidido rescatar este artículo que escribí hace tiempo para la Magazine de Joomla en el que explico, paso a paso, cómo personalizar la plantilla de administración de Joomla.

Cómo personalizar la plantilla de administración de #Joomla - Isis - #MejorConJoomla Tuitéalo

Por qué personalizar esta plantilla Joomla

La verdad que no es algo que suela hacer en los proyectos que desarrollo. Pero, a veces, puede resultar interesante.

Te pongo un par de ejemplos que se me ocurren:

  • Cuando tenemos varias páginas web de la misma temática y queremos diferenciarlas: por ejemplo, en la web de la Liga de los Casos Clínicos tenemos 2 años (2018 y 2019); cada uno con un color. Para identificar en cuál nos encontramos de una forma rápida, personalizamos esta plantilla de administración con los mismos colores.
  • Queremos dar un valor añadido al cliente y que se sienta identificado en su página web: personalizar cualquier cosa es algo a tener en cuenta para poder destacar de nuestra competencia.

De cualquier forma, aquí te traigo los pasos necesarios para personalizar ISIS, la plantilla de back de Joomla.

Plantillas de administración Joomla

Como seguramente ya sabrás Joomla viene con 2 plantillas diferentes para la zona de administración: Hathor e Isis.

Hathor es "más accesible".

Isis es la que viene como predeterminada.

Para poder acceder a ellas tienes que ir a Extensiones > Plantillas:

plantillas back

Tienes que hacer uso del primero de los filtros de esta pantalla para poder verlas.

Para poder modificar los estilos (colores) y el logo que vienen por defecto tienes que seguir estos pasos:

1/ Entrar en ella e ir a la pestaña que pone "Avanzado".

isis avanzado

2/ Modificar los campos de configuración.

Como puedes ver, tienes varios campos para los colores, los de logotipo y algunas configuraciones más.

Vamos a suponer que la empresa/negocio/particular para el que estás desarrollando su sitio web tiene una gama de colores corporativos en tonalidades verdes y el siguiente logotipo:

logo demo

Para que el cliente se sienta identificado en su sitio cuando acceda a la parte de administración, entendemos que le gustará ver "sus elementos".

Así que... manos a la obra y a modificar estos campos de configuración.

isis modificada

Una vez has realizado estos cambios, guarda y podrás ver el resultado.

Pasarás de esto:

plantillas isis defecto

A esto:

plantillas isis modificada

Un simple cambio que siempre queda bien y genera confianza en los clientes.

Hay que tener en cuenta que no solo se cambia la página de acceso sino que también se modifican las internas.

plantillas isis modificada interno

¿Se pueden modificar o añadir estilos a la plantilla?

Sí, se puede.

Y además, de forma que no se eliminen los cambios con las actualizaciones de Joomla.

La forma correcta de hacerlo es crear un archivo de estilos llamado custom.css dentro de administrator/templates/isis/css/

En este fichero podrás añadir y/o modificar los estilos que necesites para adaptar el template de Back a tus propósitos.

Por ejemplo, para modificar el color primario de los botones, podrías poner el siguiente código:

.btn-primary {
  background-color: #65792C;
  background-image: linear-gradient(to bottom, #9CB341, #65792C);
  background-repeat: repeat-x;
  border-color: #65792C #65792C #9CB341;
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.btn-primary:hover{
    background-color: #65792C;
}
 

En este ejemplo se están usando los mismos colores que los utilizados en la personalización anterior.

El resultado lo puedes ver a continuación:

plantillas isis customizada

¿Y algún cambio más?

Pues sí.

Puedes modificar más cosas a través de extensiones (generalmente módulos) para adaptarla a las necesidades y hacer el sitio más fácil de utilizar para tu cliente. Pero… de estas extensiones de parte de Back hablaremos en otro artículo.

Espero que te haya resultado de interés este pequeño tutorial de personalización del panel de administración.

Un cambio que no te lleva apenas tiempo y que genera mucha confianza.


Espero que te haya resultado de interés este artículo.

Otro artículo que te puede interesar, también relacionado con la parte de adminsitración de Joomla, es este: Extensiones para la personalización del panel de administración de Joomla!

 

Sobre el autor, Sergio Iglesias

Sergio Iglesias

Sergio Iglesias es formador, desarrollador y front-end del CMS Joomla!. A través de su blog y sus cursos puedes aprender a desarrollar tu propio portal web autogestionable.

 

¿Te ha gustado el artículo? ¡Suscríbete YA!

¿Necesitas un sitio web que funcione?

¿No quieres depender de nadie para gestionar tu página web?

Recibe contenido exclusivo y GRATIS mi curso sobre desarrollo de plantillas Joomla!


Me apunto ya!

Escribir un comentario

Puedes publicar el comentario que quieras, pero si lo considero SPAM será eliminado automáticamente.



Código de seguridad
Refescar

SergioIglesias.NET te informa que los datos de carácter personal que nos proporciones rellenando este formulario serán tratados por Sergio Iglesias Sánchez como responsable de esta web. La finalidad de la recogida y tratamiento de los datos personales que te solicitamos es, únicamente, para gestionar los comentarios de este blog. La legitimación se realiza a través del consentimiento del interesado. Te informamos que los datos que nos facilitas estarán ubicados en los servidores de SiteGround (proveedor de hosting). Ver política de privacidad de Siteground. El hecho de que no introduzcas los datos de carácter personal que aparecen en el formulario como obligatorios podrá tener como consecuencia que no pueda atender tu solicitud. Podrás ejercer tus derechos de acceso, rectificación, limitación y suprimir los datos en info@sergioiglesias.net así como el derecho a presentar una reclamación ante una autoridad de control. Puedes consultar la información adicional y detallada sobre Protección de Datos en mi política de privacidad.

¿Quieres tener un sitio web que funcione?

Contacta conmigo