Configurar el Módulo de Tienda de WooCommerce en Divi

Cómo configurar el modulo de tienda en Divi usando Woocommerce

Cómo configurar el modulo de tienda en Divi usando Woocommerce

En este artículo vamos a ver como configurar el modulo de tienda en divi, es decir, cómo podremos configurar la página de la tienda que viene por defecto en WooCommerce.

El objetivo es crear una página de tienda como esta: página de tienda extendida.

 

Pasos previos para configurar el modulo de tienda en Divi

Lo primero que tenemos que hacer, lógicamente, tener el instalado el tema Divi. Si no lo tienes instalado aun, puedes descargarlo desde el apartado de Recursos de la web.

Esta página podemos hacerla de dos formas: partiendo desde cero en el diseño o utilizando un diseño de tienda predefinido y guardado en Divi.

Crear el módulo de tienda partiendo desde cero

Lo primero que debemos hacer es crear la página que nos servirá de base para almacenar este diseño.

Una vez creada esta página, para crear y configurar el modulo de tienda en Divi primero debemos fijarnos en cómo está creado el ejemplo que nos muestra Elegant Themes, que es este.

Lo primero que vemos es que tenemos un módulo a pantalla completa con una imagen también a pantalla completa, después nos encontramos una zona con productos en la parte izquierda colocados en tres columnas, y también una barra lateral (sidebar) con información.

Si continuamos bajando, nos encontramos con 2 botones y más abajo otro módulo a pantalla completa con los productos más populares.

Por último nos encontramos con un CTA (call to action) a todo lo ancho con un botón de acción, y evidentemente, en la parte inferior nos encontramos con el pie de página.

Crear el módulo de tienda con un layout predifinido de Divi

Precisanmente, para evitarnos tener que crear los bloques de diseño que se han usado en la construcción de esa página, tenemos los layouts o plantillas predefinidas de Divi.

En este caso vamos al Constructor de Divi y hacemos clic en la opción Cargar de biblioteca, y entre todas las plantillas que ya están creadas elegimos una que se llama Tienda extendido y pulsar el botón de Cargar y después actualizar la página.

Cómo configurar el modulo de tienda en Divi usando Woocommerce

Conclusión

Si vamos al navegador para ver el resultado, podremos ver que el diseño es idéntico al que nos daba Elegant Themes de muestra, ahora sólo tenemos que sustituir los contenidos (textos e imágenes) por los nuestros y de esta forma tan sencilla hemos creado una página para vender nuestros productos con Divi.

 

 

¿Qué te ha parecido el artículo?. Házmelo saber en los comentarios que tienes más abajo. Estoy deseando leerte.

Por último, si crees que este artículo puede ser interesante para algún amigo tuyo, te agradecería enormemente que lo compartieras con él y con todo el mundo a través de las Redes Sociales.

Puede que también te interese...

1 Comentario

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *