Ixonn Group

Agregar Imagen de Fondo de Inicio de Sesión a Tamaño Completo

You are here:
< All Topics

Ixonn no admite oficialmente la imagen de fondo de inicio de sesión para el área de administración y el área de clientes para mantener la simplicidad, pero creamos un fragmento de CSS simple que agregará una imagen de fondo perfectamente alineada y de ancho completo en el área de administración, incluido el desvanecimiento sobre la imagen con CSS puro.

Imagen de fondo de inicio de sesión personalizada del área de administración

  1. Si agregó un color personalizado para el fondo de inicio de sesión de administrador en Configuración-> Estilo del tema-> General, elimínelo y configúrelo en blanco para evitar que los estilos en línea sobrescriban el estilo de fondo de la imagen.
  2. Crear archivo custom.css en assets / CSS
  3. Elija una imagen que desea agregar como fondo. (al menos 1280 x 720px)
  4. Cargue el ecualizador de imagen, en la carpeta de medios (o donde más le guste). En nuestro caso estará en los medios y la url será así: http://yourdomain.com/crm/media/login_admin.png
  5. Abra el archivo custom.css y agregue el siguiente código:

/ * Elimine esto si no desea superposición de fondo sobre la imagen o ajuste según sus necesidades * /

body.login_admin: antes de {

contenido: ” “;

antecedentes: rgba (31, 31, 31, 0.7);

altura mínima: 100%;

ancho min: 100%;

posición: absoluta;

}

body.login_admin {

fondo: url (‘https://yourdomain.com/crm/media/login_customers.png’) centro de centro no repetido fijo; / * La url de la imagen completa * /

-webkit-background-size: cubierta;

-moz-background-size: cubierta;

-o-background-size: cubierta;

tamaño de fondo: cubierta;

}

Aquí está nuestro resultado final:

Imagen de fondo de inicio de sesión personalizada del área de clientes

Siga los pasos de la imagen de fondo de inicio de sesión personalizada del área de administración de 1 a 4.

Tenga en cuenta que para el paso 4 deberá cambiar el nombre de la imagen a eq. login_customers.png

  • Abra el archivo custom.css y agregue el siguiente código:

body.customers_login {

fondo: url (‘https://yourdomain.com/crm/media/login_customers.png’) centro de centro no repetido fijo; / * La url de la imagen completa * /

-webkit-background-size: cubierta;

-moz-background-size: cubierta;

-o-background-size: cubierta;

tamaño de fondo: cubierta;

}

No olvides reemplazar la URL con la URL de tu imagen

Artículos Relacionados

  • Crear pasarela de pago personalizada
  • Aplicando estilos CSS personalizados
  • Ganchos de acción
  • Personalización de PDF
  • Plantillas de clientes
  • Área de desactivación de clientes
Table of Contents
Scroll Up