Elementor puede crear efectos de fondo de paralaje, que pueden hacer que un sitio webMás vivo y añadir capas. Este artículo le dará una visión detallada de cómo puede utilizar elCreación de un fondo de paralajeEl resultado es una experiencia visual convincente.

¿Qué es el efecto de paralaje?

El paralaje es un efecto que crea una sensación de profundidad y dinamismo a través de la diferencia de movimiento relativo entre el fondo y el primer plano. Cuando se desplaza por una página web, el fondo se mueve a una velocidad diferente que el primer plano, creando la ilusión de movimiento. El paralaje se utiliza mucho en el diseño web y en los juegos para que la experiencia visual sea más envolvente.

¿Por qué utilizar fondos de paralaje?

Los efectos de paralaje no sólo atraen la atención de los visitantes, sino que también hacen que el contenido de la página parezca más tridimensional. Ajustando la diferencia de velocidad de movimiento entre el fondo y el contenido, se puede crear una sensación de movimiento y jerarquía, mejorando la experiencia visual del usuario y aumentando potencialmente el tiempo de permanencia en la página.

Pasos para crear un fondo de paralaje en Elementor

innecesario Elementor Pro se pueden implementar efectos de paralaje en la versión gratuita de Elementor. Estos son los pasos:

Paso 1: Crear o editar una página

En primer lugar, necesita tener laCrear una nueva página(matemáticas) géneroO edite una página existente.

1. Acceda a su panel de control de WordPress y haga clic en "página web">"Añadir nueva página" o seleccione la página que desea editar.

2. Pulse "Uso del editor de Elementor", para entrar en el editor de Elementor.

Paso 2: Añadacontenedoresresponder cantandoelemento

En el editor de ElementorAñadir un nuevo contenedorEl efecto de paralaje se aplicará al fondo del capítulo. Puede añadir cualquier contenido al capítulo, como texto, imágenes, títulos, mapas, iconos, etc.

1. Pulse "Añadir un nuevo contenedor" y seleccione la estructura (por ejemploColumna simple, columna doble(etc.).

2. Arrastre y suelte editores de texto, botones u otros elementos en las secciones para rellenar el contenido.

Paso 3: Añadir un fondo

A continuación, añada una imagen de fondo al contenedor, que está a punto de aplicar elEfecto de paralaje por parte de.

1. Haga clic en el icono "Editar contenedor" y vaya a la pestaña "Estilos".

2. Busque "Tipo de fondo" y seleccione el modo "Clásico".

3. Pulse "Seleccionar imagen" y cargue o seleccione una imagen de fondo adecuada de la biblioteca multimedia.

4. Configure las opciones de visualización de la imagen, como la posición, el método de repetición, etc., para asegurarse de que la imagen se muestra correctamente en la página.

Paso 4: Activar el paralaje

Este es el paso clave porImagen de fondo fijaSe realizan efectos de paralaje.

1. En "Tipo de fondo" busque "archivo adjunto (correo electrónico)", ajústelo a "fijación".
   • Esto hará queImagen de fondo fijay el contenido en primer plano se moverá al desplazarse, creando un efecto de paralaje.

2. La visualización de la imagen de fondo puede ajustarse según sea necesario, como "colocación"La opción puedeImagen de controlLa alineación del "magnitud" La opción le permite ajustar el modo de zoom de la imagen.

Paso 5: Guardar y previsualizar el efecto

Después de completar los ajustes anteriores, puede previsualizar la página para ver el efecto real del efecto de paralaje.

1. Haga clic en "ojos" y seleccione "Vista previa de los cambios".
2. Desplace la página en una nueva ventana y observe cómo se comporta el efecto de paralaje.

¿Cómo se puede optimizar aún más el fondo de paralaje?

Si el efecto de paralaje predeterminado no se ajusta del todo a sus necesidades, pruebe los siguientes consejos de optimización:

1. Ajuste de la transparencia de la imagen de fondoHaga que el contenido en primer plano destaque más ajustando la transparencia del fondo.

2. Añadir una superposición de color: Añadir una capa de color transparente a la imagen de fondo puede mejorar la coherencia estilística general de la página.

3. Combinado con efectos dinámicos: Si desea algo más llamativo, puede utilizar los efectos de desplazamiento de Elementor para añadir otras animaciones a los elementos de primer plano o de fondo.

Consideraciones sobre el fondo de paralaje

• Selección de imágenesLa elección de la imagen de fondo adecuada es crucial. Se recomienda utilizar imágenes que sean claras y temáticas.
• Velocidad de carga: Los fondos Parallax pueden aumentar el tiempo de carga de la página, intente utilizar imágenes optimizadas para garantizar el rendimiento del sitio.
• Compatibilidad con dispositivos móviles: Puede que algunos efectos de paralaje no funcionen bien en dispositivos móviles. Puede controlar si los efectos de paralaje se muestran o no en los dispositivos móviles personalizando las opciones de visualización.

resúmenes

El efecto de paralaje es una herramienta visual muy útil para realzar el atractivo de una página, y Elementor proporciona una forma fácil de utilizar para conseguir este efecto sin necesidad de plugins adicionales. Esperamos que los pasos detallados y las sugerencias de optimización de este artículo le ayuden a crear fácilmente impresionantes fondos de paralaje en Elementor.