Optimización de la velocidad de carga y configuración de la presentación de diapositivas de la página de inicio de WoodMart

existe Temas WoodMartAñadir un rotador de página de inicio puede mejorar el rendimiento visual de la página, pero también centrarse en mostrar el contenido principal. A continuación se presentan dos configuraciones comunes y se ofrecen técnicas prácticas de optimización de la carga para ayudarle a crear una página de inicio atractiva y sin retrasos.

Añadir una imagen giratoria de la presentación de diapositivas de la página de inicio

Método 1: Utilice el control deslizante integrado de WoodMart

• Accede al backend de WordPress, haz clic en "Páginas", busca la página de inicio y haz clic en "Editar con Elementor".

• En la parte superior de la página, haga clic en el signo "+" para crear una nueva línea e inserte el componente "WoodMart Slider" (o utilice el equivalente de WPBakery).

• Seleccione el accesorio deslizador o haga clic en "Seleccionar deslizador" para crear una nueva área de rotación.

• Sube lo que quieras mostrardiapositivas (fotografía, software de presentación)Imágenes, se recomienda un tamaño uniforme, por ejemplo 1920 x 800.

• Añada títulos, botones, enlaces de salto, etc. a cada diapositiva
• Establezca la animación de conmutación (por ejemplo, fundido de entrada, deslizamiento, etc.), establezca el tiempo de intervalo de conmutación (se recomiendan unos 5 segundos) y si desea activar la reproducción automática.

• Haga clic en "Actualizar" para volver a la página de inicio y ver los resultados.

Método 2: Utilizar el plugin Slider Revolution

WoodMart tiene incorporado el potente plugin Slider Revolution para rotar escenas que requieren animaciones complejas y superposiciones de capas.

• Haz clic en "Slider Revolution" en la parte izquierda del backend para editar el slider.

• Establezca el tamaño del deslizador, por ejemplo, anchura 1920px, altura 800px.

• Añadir presentación de diapositivas: cargue una imagen de fondo y añada capas de texto, botones, enlaces y mucho más.

• Haga clic en cada capa para ajustar elanimemodos, como desvanecimiento, zoom, tiempo de retardo, etc.

• Cuando hayas terminado, haz clic en el botón "Guardar" de la esquina inferior derecha.

• Vuelve al editor de Elementor e inserta el módulo "Revolution Slider" en la página de inicio y selecciona el nombre del slider que acabas de crear.

• Guarde la página y actualice el frontend para ver los resultados.

Consejos para optimizar la velocidad de carga

Aunque el atractivo visual de la presentación de diapositivas es fuerte, pero el tamaño de la imagen es demasiado grande o se carga de una manera poco razonable, se ralentizará la página de inicio para abrir la velocidad. He aquí algunas sugerencias prácticas para la optimización:

Imágenes comprimidas

Se recomienda que todas las imágenes giratorias estén en formato WebP y comprimidas a menos de 150 KB. Se pueden utilizar las siguientes herramientas:

• TinyPNG
• Squoosh
• ShortPixel Plugin (Plugin de WordPress)

Activar la carga lenta

gasto o desembolso Elementor Pro Si utiliza un constructor diferente, puede instalar la aplicación Cohete WP y activar la carga lenta de imágenes. Se recomienda establecer la primera diapositiva no acarga perezosa (informática), el resto de la carga retrasada para evitar la primera pantalla en blanco de la página.

Control del número de diapositivas

No se recomienda añadir más de 3 diapositivas para evitar cargar pilas. 3 diapositivas o menos es una buena manera de mostrar los puntos clave y facilitar que se centren en ellos.

Racionalización de animaciones y capas

Revolution Slider proporciona ricas características de animación, pero el coste de carga es alto. Se recomienda desactivar las animaciones de capas redundantes y mantener sólo las transiciones simples para reducir el tiempo de renderizado.

observaciones finales

WoodMart Admite múltiples formas de añadir la imagen giratoria de la página de inicio, con una gran compatibilidad y estética. Tanto si prefiere una configuración sencilla como si necesita un rendimiento visual complejo, capte laOptimización de imágenesy control de animaciones, es fácil crear una página de inicio atractiva y de carga rápida.

Contacte con nosotros
¿No puede leer el tutorial? Póngase en contacto con nosotros para obtener una respuesta gratuita. Ayuda gratuita para sitios personales y de pequeñas empresas	Servicio de atención al cliente WeChat
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) Correo electrónico: [email protected]
④ Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres