Diseña tu tienda online: crea una tienda bonita y fácil en pocos pasos.

Te contamos el paso a paso para diseñar tu tienda online

Creas tu tienda online, pero una vez delante del panel de configuración piensas, "Y ahora, ¿qué hago?"

En Yupop te lo ponemos fácil y hemos creado una tienda de muestra para que puedas ver cómo es, qué puedes hacer y, si te inspira, puedas copiar este diseño sencillo y resultón para que tu tienda se vea bien bonita.


¡Empezamos! Esta es nuestra tienda.

En la página principal puedes ver que hemos configurado un menú con las categorías en la cabecera y el logo de nuestra tienda, y hemos añadido tres módulos antes del pie de página. Te contamos todo lo que hemos hecho en esta tienda para que se vea así, paso por paso:

Antes que nada: completa los datos de tu tienda.

Es importante empezar la tienda por los detalles más básicos como lo son los datos de contacto y de la tienda: logo, teléfono, redes sociales... Todo esto va a hacer que tu tienda vaya cogiendo forma y le cree confianza a tu cliente. Y son detalles tan básicos que puede que se te olviden, así que te animamos a que sea lo primero que hagas al crear tu tienda. El logo es lo primero que verán, así que no lo dejes de lado, podrás modificar su tamaño más adelante.

Paso dos: Añade productos y categorías.

Cuando creas productos en tu tienda, se añaden automáticamente a tu catálogo general, que podrás encontrar en el menú de la cabecera (si no lo ves automáticamente, lo puedes añadir editando la cabecera cuando estés editando  la personalización de la tienda). Pero aquí, lo que te queremos recomendar es que, también, crees categorías para poder organizar los productos en la tienda. Para ello nos vamos al panel de configuración Catálogo > Categorías. En nuestra tienda hemos creado estas categorías:

Imagen del panel de configuración de Yupop

Aquí, como puedes ver, hemos creado cuatro categorías y dos subcategorías (dentro de Cuidado facial) para ayudarnos en la organización de productos, así podemos facilitar la navegación a nuestro cliente y no sobrecargamos el menú de nuestra tienda.

Ahora voy a añadir los tipos de variantes porque uno de mis artículos en este caso (aceite de jojoba) tiene diferentes tamaños. Vamos a Catálogo > Tipos de variantes.

Imagen del panel de configuración de Yupop

Después hemos ido a Catálogo > Productos en el menú de la izquierda y hemos añadido seis productos, cada uno en su categoría correspondiente (te invitamos a navegar por la tienda para que veas como ha quedado). Algunos de ellos les hemos hecho un descuento para que veas como queda en la tienda.

Estos son nuestros productos:

Imagen del panel de configuración de Yupop

¿Lo tenemos?

Seguimos. Vamos a diseñar nuestra página de inicio:

Como ya hemos añadido productos y categorías, ya podemos empezar a diseñar nuestra página de inicio.


Nos vamos a ir a Personalización > Página de inicio

Aquí encontraremos una serie de módulos predeterminados: Cabecera, Escaparate, etc. Los módulos cabecera y pie de página son fijos y no los puedes eliminar. A parte de estos, puedes añadir, editar, habilitar y deshabilitar los módulos que quieras. Todo esto te lo explicamos con detalle en nuestro centro de ayuda por si quieres saber más sobre los módulos de diseño.

Para ver cómo se ve tu tienda deberás ir a "ver tienda online" en el botón de arriba en el centro.

¿Cómo hemos diseñado nuestra tienda?

En nuestra tienda de muestra puedes ver los siguientes módulos:

  • Cabecera

Este módulo es fijo y no se puede eliminar.

Primero de todo hemos editado la cabecera añadiendo las categorías que ya habíamos creado. Esta parte es muy importante para añadir el menú con las categorías y así permitir que tus clientes encuentren los productos con facilidad.

También hemos añadido en nuestro menú la página "Qué es Cosm?" (nuestro "sobre nosotros" ya personalizado).

Hemos ido añadiendo elemento a elemento cada categoría y página que queremos en el menú:

Imagen del panel de configuración de Yupop

Además, en la cabecera también puedes modificar el tamaño del logo si lo deseas.

  • Módulo Escaparate

Hemos añadido el módulo Escaparate con la siguiente información y una fotografía:

Imagen del panel de configuración de Yupop

Y ha quedado así:

Imagen del escaparate de nuestra tienda de muestra

El color del texto lo hemos puesto blanco, no hemos añadido botón de enlace, la alineación de la imagen es Centrado; y la alineación de texto y botón es izquierda - inferior.

  • Módulo Productos

Nuestro siguiente módulo es el de Productos.

Aquí hemos añadido "Nuestros serums" como Texto principal, y hemos añadido cuatro productos elegidos de toda nuestra lista de productos.

  • Módulo Banner

Para dar un poco de espacio entre el módulo de productos y el pie de página, hemos añadido un módulo banner con una imagen. El módulo banner no tiene espacio para escribir, así que solo hemos añadido la imagen en ancho completo. El módulo banner es un módulo que te permite hacer que la imagen sea un enlace, si quieres, o puedes no enlazarlo a nada para que solo se vea la imagen.

  • Pie de página

En el pie de página se encuentran cuatro columnas de enlaces e información.

Imagen del pie de página de nuestra tienda de muestra

En las dos primeras columnas vamos a encontrar los enlaces que podemos editar en el módulo "enlaces del pie de página". Podemos renombrar las columnas y añadir las páginas que necesitemos.

En nuestra tienda de muestra hemos dejado la columna por defecto "Nosotros", que incluye la página "Sobre nosotros" la cual hemos renombrado "Qué es Cosm?" Para darle un poco más de personalidad.

En la columna "Legal" (le hemos dejado el mismo título) tenemos los textos legales que debemos rellenar con la información legal de nuestro negocio.

Los otros dos bloques de la derecha ("Contactar" y "Síguenos") se van a completar automáticamente al añadir los datos de contacto y los enlaces a las redes sociales que te comentaba al inicio de este post.

Y ¡ya lo tienes! Ahora tan solo te falta completar el resto de funcionalidades básicas (método de pago y método de envío) para poder poner tu tienda online y ¡ya estará lista para vender!

Martín S.
Somos el equipo de Marketing de Yupop. Generamos contenido sobre el mundo del ecommerce y el emprendimiento. Compartimos tutoriales para guiarte en la creación de tu tienda online, herramientas de marketing que te ayudarán a vender y más consejos para hacer crecer tu negocio.