Elementor versión gratuita de los tutoriales de creación de página de detalles del producto

Para los que acaban de empezar a crear un sitio web, crear una página de detalles que tenga un aspecto profesional y muestre claramente la información del producto es un paso muy importante. Aunque Elementor Edición GratuitaNo hay componentes exclusivos de WooCommerce como en la versión Pro, pero con el enfoque adecuado, todavía se puede utilizar la versión gratuita para hacer una página de producto claramente estructurada y visualmente amigable.

Este post le llevará paso a paso a través de la creación de una página de detalles del producto, adecuado para la muestra de un solo producto, introducciones de cursos, pequeñas marcas y otras necesidades de la página.

Preparar la estructura de la página

Abre el backend de WordPress y añade una nueva página. Selecciona "Editar con Elementor" como método de edición.

Una vez que haya introducido la visualización, piense en lo que debe incluirse en esta página de producto. Normalmente incluirá:

• Imagen principal del producto
• Cloruro de dietilamonio
• breve introducción
• Funciones destacadas
• Detalles de la imagen
• Botones de precio u orientación (por ejemplo, comprar, contactar, reservar, etc.)

estructura de la páginaSe recomienda organizarlos en el orden de arriba→abajo para facilitar el desplazamiento de los visitantes.

Insertar área de información de cabecera

Añada una sección de una sola columna, arrastre el componente "Imagen" e inserte la imagen principal de su producto, ya sea una vista frontal de alta calidad o una imagen en vivo. A continuación, añada un componente "Título" con el nombre del producto, y un componente "Editor de texto" para resumir el producto en unas pocas frases.

Entre estos tres se recomienda añadir márgenes internos o ajustar el tamaño de la fuente para dar más respiro al contenido.

Crear una zona de exposición de productos

Crea otra Sección y divídela en dos columnas.

Siga colocando imágenes del producto a la izquierda, como zoom local, escenarios de uso del producto y texto de introducción a la derecha.

Puede enumerar de 3 a 5 puntos de venta en un titular + gráfico, o utilizar una "lista de iconos" para mejorar la legibilidad.

Si le preocupa que la página resulte demasiado monótona, puede establecer módulos escalonados, como "imagen a la izquierda + texto a la derecha" y luego "imagen a la derecha + texto a la izquierda", para crear una sensación de ritmo visual.

Añadir una imagen detallada o un vídeo

La siguiente área puede ser una imagen detallada horizontal separada, o se puede insertar un vídeo introductorio.Elementor viene con un módulo de vídeo que soporta el YouTubeEs muy fácil previsualizarlo pegando la dirección directamente en él.

Añadir un botón de guía

Cuando un visitante mira el contenido del producto, lo que más necesita es una acción clarabotonesPor ejemplo, "Compre ahora", "Contacte con nosotros", "Vaya a Little Red Book para saber más", etc. Puede utilizar el módulo de botón para establecer el tamaño, el color y el estilo de esquina redondeada para que sea lo suficientemente llamativo en la página.

Si no tiene intención de acceder a la funcionalidad de comercio electrónico, puede enlazar directamente con WeChat, formularios o centros comerciales externos.

Adaptación móvil

Una vez terminada la página, no olvides cambiar al "modo responsive" para comprobar cómo se ve en móviles y tabletas. Si el texto es demasiado largo, la imagen demasiado grande o los botones no tienen sentido, puedes ajustarlos para los distintos dispositivos.

La versión gratuita de Elementor permite personalizar el tamaño de la fuente, los márgenes y la alineación en diferentes dispositivos, lo que es perfecto para hacer queOptimización móvil.

Guardar como plantilla

Guardar páginas o artículos como plantillas para editar fácilmente las páginas de detalles de los productos puede resultar eficaz y eficiente.

Recomendaciones para la inspección previa a la liberación

• Asegúrese de que todas las imágenes se cargan correctamente y tienen el tamaño adecuado.
• Si el salto de enlace funciona o no
• El título y la descripción del contenido son completos y fluidos
• Si la página se carga sin problemas (intente cargar las imágenes en JPG, comprimidas)

Un resumenPágina de detalles del productoLa estructura no tiene que ser demasiado compleja, pero debe permitir a los usuarios comprender rápidamente el valor del producto y saber exactamente qué hacer a continuación. El uso de Elementor versión gratuita aunque los componentes son limitados, hacer un buen uso de la disposición y los módulos básicos también puede hacer un efecto de página muy profesional.

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