Cómo crear una tienda online en WordPress desde cero

Autor: Max Camuñas

Fecha: 26/02/2020

Si necesitas diseñar una página web y más concretamente vender tus productos o servicios online, en este post te voy a explicar, paso a paso, cómo crear una tienda online en WordPress.

Lo primero que debes saber es que existen diferentes plataformas para montar un ecommerce (Shopify, Magento, Drupal, etc), pero me voy a centrar en WordPress, ya que es el CMS que manejo y recomiendo.

Para crear una tienda online en WordPress, lo primero que debes hacer es descargar, activar y configurar WooCommerce, el plugin oficial de ecommerce, en tu web.

Crear una tienda online en WordPress con WooCommerce

Cómo añadir un producto en WooCommerce


Una vez configuradas todas las opciones de WooCommerce (ajustes generales, envíos, pasarelas de pago, etc), es el momento de añadir los productos que vas a vender.

Para añadir un producto en WooCommerce, simplemente debes ir a Productos > Añadir nuevo y completar cada uno de los campos con la información de tu artículo o servicio:

Crear una tienda online en WordPress: añadir un producto en WooCommerce
  • Nombre o título del producto.
  • Descripción corta y larga.
  • Datos del producto (lo explicaré a continuación).
  • Categorías y etiquetas.
  • Imagen destacada del producto.
  • Galería (fotografías complementarias).

Añadir correctamente los datos generales y configurar el tipo de producto en función de tu negocio es lo más importante dentro de cada ficha.

Tipos de productos en WooCommerce

Crear una tienda online en WordPress: tipos de producto en WooCommerce

Como ves en la captura, existen varios tipos de productos en WooCommerce, que se configuran desde los datos generales de la ficha. Te los explico todos:

Producto simple

Se trata del producto por defecto. Puedes ponerle un precio normal y otro rebajado, así como asignar sus impuestos. A su vez, WooCommerce dispone de 3 modalidades de producto simple:

  1. Físico: se manda al domicilio del cliente y puedes configurar todo lo relacionado con su envío (peso, dimensiones y tipo).
  2. Virtual: se trata de un producto online, es decir, no requiere de un envío físico. Por ejemplo: entradas a un concierto.
  3. Descargable: es un producto que se puede descargar después de la compra (por ejemplo: un ebook, una plantilla, un PDF, etc). Puedes seleccionar el límite y la caducidad de las descargas.
Crear una tienda online en WordPress: producto simple virtual y descargable

Producto agrupado

Se trata de un tipo de producto que se puede agrupar con otros para venderlos conjuntamente, porque sus características (descripción, estilo, colores, etc) son similares y se asocian bajo un producto «padre», en función de su referencia o identificador.

El objetivo es que el cliente pueda añadir todo el grupo de productos al carrito y no tenga que hacerlo de forma individual. Ejemplo: imagina una tienda de muebles que vende sillas. Por una parte, estaría la estructura y por otra el cojín.

Además, para el cliente es posible seleccionar cantidades diferentes de cada uno de los productos del grupo. Es decir, puede elegir comprar una cantidad de un producto y otra del resto. Por ejemplo: en el caso de una mesa, sería un tablero y varias patas.

Recuerda que las variaciones no están disponibles en los productos agrupados de WooCommerce.

Crear una tienda online en WordPress: productos agrupados

Producto externo / afiliado

Los productos externos sirven para vender artículos que no son de tu propiedad, es decir, te encargas de la venta, pero no de la gestión del producto ni de su inventario. Por ejemplo: afiliado o dropshipping.

Si esta es la modalidad de tienda que tienes, los campos a completar son:

  • URL del producto (fuera de tu web).
  • Texto del botón o llamada a la acción.
  • Precios: normal y rebajado.
  • Impuestos: estado y clase.
Crear una tienda online en WordPress: producto externo / afiliado

Producto variable

Los productos variables de WooCommerce son aquellos que varían en función de algún atributo específico: talla, color, tamaño, etc. Es decir, para configurar un producto variable primero tienes que crear unos atributos (los que necesite tu tienda):

Crear una tienda online en WordPress: producto variable (atributos)

Creados los atributos, lo siguiente que debes hacer es añadir las variaciones (en base a ellos) y añadir la información de cada variación de producto: precio, dimensiones, descripción, imagen, etc.

Crear una tienda online en WordPress: producto variable (variaciones)

Cuando hayas añadido y configurado todas las variaciones, ya puedes publicar el producto y aquí puedes ver el resultado:

Crear una tienda online en WordPress: producto variable

Inventario

Gestionar el inventario de WooCommerce es muy sencillo y te permite tener un control detallado de todos los productos, modelos y unidades de tu tienda.

Además, puedes informar a tus clientes sobre el número de unidades disponibles de un artículo, así como gestionar tu propio stock, algo que vas a agradecer, en especial si vendes muchos productos distintos.

Puedes gestionar el inventario de cada producto dentro de su ficha:

Crear una tienda online en WordPress: gestionar el inventario en WooCommerce

Los campos que puedes configurar para gestionar tu inventario en WooCommerce son:

  • SKU: código, referencia o identificador del producto. Si tienes una tienda con muchos productos, te recomiendo que cada uno tengo su código para gestionar el inventario de forma más sencilla.
  • ¿Gestión de inventario? Si activas la gestión de inventario a nivel del producto, se habilitan unos campos específicos para gestionar la cantidad de unidades específicas de dicho producto (te lo explico más abajo).
  • Estado del inventario: te permite configurar si quedan existencias de dicho producto, si está agotado o si se puede reservar.
  • Vendido individualmente: puedes activar esta opción si quieres que solo se pueda comprar una unidad de este producto específico en cada pedido.

Si activas el check de gestión de inventario, se habilitan las siguientes opciones:

  • Cantidad de inventario: aquí debes introducir el número de unidades que tienes disponibles en tu tienda para este producto en concreto.
  • ¿Permitir reservas? En este caso y a diferencia de la opción sencilla (la de arriba), puedes permitir las reservas, no permitirlas o hacerlo avisando al cliente.
  • Umbral de pocas existencias: puedes configurar un número mínimo de unidades para que, cuando se estén agotando, recibas un aviso por email. Por ejemplo: imagina que tienes una tienda con 10 camisetas rojas y configuras este campo para 2 unidades; cuando hayas vendido las 8 primeras y solo queden 2 en tu tienda, recibirás un aviso para reponerlas.
Crear una tienda online en WordPress: gestionar el inventario en WooCommerce

Envío

La gestión del envío en WooCommerce solo está disponible para los productos simples que no sean virtuales o descargables y también para los variables, es decir, para los productos que son físicos y susceptibles de ser enviados al cliente.

Crear una tienda online en WordPress: envío de productos en WooCommerce

Aquí vas a configurar las opciones de envío de tus productos al domicilio del cliente. Es muy sencillo:

  • Peso en kg.
  • Dimensiones en cm: longitud, anchura y altura.
  • Clase de envío. Podrás elegir entre las opciones que hayas añadido al configurar WooCommerce.

Productos relacionados

WooCommerce te permite establecer productos relacionados con el objetivo de generar ventas dirigidas y cruzadas.

Dentro de cada ficha de producto, puedes establecer unos productos relacionados de forma personalizada.

Puedes elegir los productos por referencia (SKU) o por su nombre:

Crear una tienda online en WordPress: productos relacionados en WooCommerce

¿Qué son las ventas dirigidas y las ventas cruzadas de WooCommerce?

La ventas dirigidas consisten en recomendarle al cliente un producto alternativo al que está viendo, ya sea porque es más rentable o tiene un precio mayor. Es decir, recomiendas un producto diferente al actual.

Lo habitual es mostrarlos en la parte inferior de las fichas de producto con un texto del tipo «también te interesa» o «te recomendamos».

Por ejemplo:

Crear una tienda online en WordPress: ventas dirigidas WooCommerce

Las ventas cruzadas son diferentes a las anteriores, pues el producto se muestra como complemento o extra, es decir, te interesa vender el actual y el recomendado.

Además, la ubicación cambiar de lugar, ya que aparece en el carrito, en vez de en la ficha de producto.

Su objetivo es que el cliente realice una segunda compra antes de terminar el proceso de tramitación del pedido.

Crear una tienda online en WordPress: ventas cruzadas WooCommerce

Atributos

Los atributos son aquellos elementos que permiten mostrar el mismo producto con diferentes variables. Por ejemplo: talla, tamaño, color, acabado, etc.

Por lo tanto, para crear un producto con variaciones, necesitas crear y configurar primero los atributos en WooCommerce.

En el caso de esta tienda de calzado, los atributos son dos: la talla y la tipografía del grabado.

Crear una tienda online en WordPress: atributos WooCommerce

¿Cómo crear atributos en WooCommerce?

Crear atributos en WooCommerce es muy sencillo. Para ello, debes ir a la pestaña «atributos» dentro de la ficha de producto y añadir tantos como necesites.

Solo tienes que ponerle un nombre (color, talla, tamaño, acabado, etc) e introducir los diferentes valores separados por una barra vertical (|).

Una vez tengas tu atributo creado, clica en «guardar atributos» y se quedará guardado en WooCommerce para ser utilizado en cualquier producto de tu tienda.

Crear una tienda online en WordPress: atributos WooCommerce

Para gestionar los atributos que tienes creados, debes ir al apartado: Productos > Atributos. Ahí podrás editarlos o eliminarlos según tus necesidades.

Crear una tienda online en WordPress: atributos WooCommerce

Variaciones

Como su propio nombre indica, las variaciones solo están disponibles para los productos variables. Estas permiten mostrar todas las variaciones de tus productos, siempre a partir de los atributos que hayas creado previamente.

Imagina una tienda de camisetas, donde los atributos son dos: talla y color. Con las variaciones podrás mostrar la información de cada variación. Por ejemplo:

  • Camiseta azul S
  • Camiseta azul M
  • Camiseta azul L
  • Camiseta blanca S
  • Camiseta blanca M
  • Camiseta blanca L
  • Camiseta negra S
  • Camiseta negra M
  • Camiseta negra L
  • Camiseta roja S
  • Camiseta roja M
  • Camiseta roja L

Es decir, tendrías un único producto (el mismo modelo de camiseta) con 6 modalidades diferentes.

Además, en cada variación puedes introducir información específica de dicho modelo:

  • Imagen.
  • Referencia (SKU).
  • Precio normal y rebajado.
  • Stock e inventario.
  • Tamaño y dimensiones.
  • Envío.
  • Descripción personalizada.
Crear una tienda online en WordPress: variaciones WooCommerce

Si quieres crear variaciones chulas con colores, imágenes y botones para tus atributos de producto en WooCommerce, te recomiendo el plugin Variation Swatches for WooCommerce.

Crear una tienda online en WordPress: variaciones WooCommerce

Avanzado

Por último, en la pestaña «Avanzado» de los datos del producto puedes configurar los siguientes elementos:

  1. Activar las notas de compra si quieres enviarle algún tipo de mensaje o comentario al cliente después de realizar el pago.
  2. Orden el menú: si quieres ordenar los productos de tu tienda de forma personalizada, puedes hacerlo desde aquí. Esta opción los ordena de menor a mayor, por lo que debes asignar primero el número menor. Si lo dejas por defecto, todos los productos tienen el cero.
  3. Activar las valoraciones en el caso de que quieres que tus clientes puedan valorar los productos de tu tienda.
Crear una tienda online en WordPress: datos avanzados WooCommerce

Descripción del producto

La descripción es fundamental a la hora de subir un producto en WooCommerce para mostrar toda la información del mismo: detalles, características, información, etc.

En ese sentido, WooCommerce nos permite incluir dos tipos de descripción en el producto: una corta y otra extensa, que en función del tema que uses en tu web aparecerán en diferente lugar.

Crear una tienda online en WordPress: descripción del producto en WooCommerce

Mi consejo es utilizar la descripción corta a modo de resumen o presentación del producto y la larga para explicar todas sus especificaciones y detalles

Te dejo un par ejemplos de productos con ambos tipos de descripción:

Crear una tienda online en WordPress: descripción del producto en WooCommerce
divifast.es
Crear una tienda online en WordPress: descripción del producto en WooCommerce
tarrago.com

Categorías y etiquetas

Las categorías y etiquetas son elementos que ayudan a ordenar los productos de una tienda, tanto para tu propia organización, como para facilitar la navegación a tus clientes.

Si tu tienda dispone de pocos productos, con las categorías (y subcategorías) puedes organizarte perfectamente. Por contra, si tienes una gran variedad de productos, utiliza también las etiquetas, o incluso las subcategorías.

Recuerda mostrar las categorías y etiquetas tanto en la página de tienda como en el menú de la web para que sean más accesibles de cara al usuario.

En este ejemplo puedes ver cómo las categorías de productos cuelgan de la tienda como subpestañas en el menú.

Crear una tienda online en WordPress: categorías y etiquetas de producto en WooCommerce

Aquí puedes ver como en una página de categoría (madre) aparecen todas las subcategorías que cuelgan de ella:

Crear una tienda online en WordPress: categorías y etiquetas de producto en WooCommerce

Son distintas formas de organizar y mostrar tus productos organizados para facilitar la navegación a tus clientes.

Imagen destacada y galería del producto

Por último y fundamental a la hora de crear una tienda online y subir productos a WooCommerce, son los elementos gráficos. Concretamente, las imágenes que vas a incluir en las fichas de producto donde mostrarle a tus clientes qué vendes, el modelo y sus diferentes usos.

En ese sentido, WooCommerce permite incluir diferentes recursos multimedia en las fichas:

  • Imagen destacada del producto: que suele acompañar a la descripción y tiene un tamaño superior al resto.
  • Galería del producto: el resto de imágenes del producto. Es habitual que aparezcan debajo de la principal y con un tamaño más pequeño, a modo de carrusel o de rejilla.

Te dejo un par de ejemplos para que veas el uso de las imágenes en estas tiendas online:

Crear una tienda online en WordPress: imágenes del producto
imagen destacada + galería a modo de rejilla
Crear una tienda online en WordPress: imágenes del producto
imagen destacada + galería a modo de carrusel

Hasta aquí este tutorial en el que te explico, paso a paso, cómo crear una tienda online en WordPress y cómo añadir un producto en WooCommerce correctamente, para que entiendas cada uno de sus opciones, campos y elementos.

Recuerda que, si necesitas ayuda para crear tu tienda online en WordPress, tienes disponible mi servicio personalizado de diseño web 🙂

Portada: freepik

Summary
TUTORIAL: cómo crear una tienda online en WordPress desde cero
Article Name
TUTORIAL: cómo crear una tienda online en WordPress desde cero
Description
Aprende a crear una tienda online en WordPress desde cero, paso a paso, con esta guía para introducirte en el mundo del ecommerce.
Author
Publisher Name
Max Camuñas
Publisher Logo

23 Comentarios

  1. David

    ¡La joya de la corona!
    Y eso que aún quedan 2 posts más de esta pedazo serie sobre ecommerce 🙂
    Enhorabuena por el post Max, de verdad que genial.. me lo he leído bien a fondo pero me lo guardo en favoritos porque en breves creo que lo necesitaré 😉
    Yo ya había toquiteado algún proyecto con woocomerce, pero partiendo de cero tenía algunas dudas, sobre todo cómo se montaba todo el tema de la pasarela de pago y los diferentes tipos de pago, etc. Creo que queda todo bastante claro, y a más de uno nos va ayudar!
    En fin, me espero al próximo post, que ya hay ganas 😀
    un abrazo Max!

    Responder
    • maxcf

      Muchas gracias David, por todo, ya lo sabes!

      Me encanta lo de «la joya de la corona» jaja

      Espero que me vayas informando de cómo va tu introducción en el mundo del ecommerce.

      Y si necesitas cualquier cosa, ya sabes dónde estoy.

      En el próximo post hablaré de cómo añadir productos, gestionar el stock, etc.

      Un abrazo también para ti!

      Responder
  2. Esti

    Gran post Max, me ha encantado la tienda de Nido de Ideas, como siempre felicidades por tu buen trabajo 😉

    Responder
    • maxcf

      Muchas gracias Esti!

      Ya sabes que me gusta hacerlo todo muy bien, bonito y profesional. Me encanta lo que hago y creo que se nota en mis trabajos.

      Un beso!

      Responder
  3. Miguel Angel Toribio

    Genial post Max, completo es poco, me ha encantado, me lo llevo «para la saca» y lo comparto, un abrazo!

    Responder
    • maxcf

      Muchas gracias Miguel Ángel!

      Cuánto me alegro de que te sirva mi contenido.

      Gracias por pasarte y por fomentar.

      Espero verte por aquí pronto 😉

      Un abrazo!

      Responder
  4. Bea

    Crack crack crack eeeereeees un crack!!!!
    Menuda guía te has currado compi. Enhorabuena!!
    Yo de ecommerce no tengo mucha idea pero con este post he aprendido un montón y me lo guardo en la caja fuerte, jeje!!

    Lo que me parece brutal es todo lo que puedes hacer con el plugin. Había oído maravillas de él, pero al leer tu post he visto que es un verdadero tesoro.

    Genial Max!! Estoy aprendiendo muchísimo con esta serie!!
    Un abrazote guapetón!!

    Responder
    • maxcf

      El plugin es una pasada!

      No hace falta saber de programación para montar una tienda en WordPress gracias a él.

      Yo tengo en mente montar una ecommerce a medio plazo. Ya estoy haciendo las primeras pruebas y el plugin no deja de sorprenderme.

      Seguiré informando 😉

      Un abrazo Bea!!

      Responder
  5. Robert Portela

    Super biblia de cómo montar una tienda paso a paso y con muchísimo detalle. Se nota un trabajo inmenso en la concepción de este artículo, y la verdad que el resultado es genial ¡Enhorabuena!

    Hace unos años tuve una tienda online y una de las cosas que más problemas me causó fue el transporte, sobre todo porque no manejaban los paquetes con la delicadeza que algunos de ellos requerían, y más que nada por eso tuve que dejar a un lado ese proyecto. (aunque tengo otro entre manos :P)

    Lo que comentas sobre la plantilla es importantísimo comprobarla en herramientas como PageSpeed de Google, para que no te pase como me ha pasado a mí con la de mi blog, que Google no la validaba como responsive y me ha tocado entrar en el código para ir corrigiéndolo. Por cierto, si necesitas ayuda en temas de programación, aquí me tienes. 😉

    Responder
    • maxcf

      Hola Robert 🙂

      Muchas gracias! Yo tengo en mente un proyecto de tienda online a medio plazo, y ya he hecho las primeras pruebas con WordPress + WooCommerce (he quedado muy satisfecho).

      El problema es que ahora mismo tengo mucho trabajo de diseño y no tengo tiempo para más cosas. A ver cómo me las ingenio 😀

      Google y sus cambios. Hartos estamos quienes nos dedicamos a esto desde unos años. Hoy en día, o eres totalmente responsive, o Google te da por muerto.

      Te tomo la palabra. Si necesito cualquier cosa de programación, te aviso.

      Me ha gustado mucho verte por aquí.

      Un abrazo!

      Responder
  6. ana

    Una pasada de post y una pasada de plugin. Me lo guardo como oro en paño. Un saludo.

    Responder
    • Max Camuñas

      Es un plugin súper completo, Ana. Una auténtica pasada.

      ¡Muchas gracias! 🙂

      Responder
    • Max Camuñas

      ¡Muchas gracias Gerard!

      A mis lectores les va a venir genial el curso que nos enlazas.

      Un saludo.

      Responder
  7. Cova

    Hola Max

    Vaya, vaya. Pedazo de guías te has currado.

    El mundo del ecommerce me encanta, desde hace unos años tengo en mente el crear una tienda. De hecho, para este año tendré que hacer mis primeros pinitos porque le crearé a mí hermana (es joyera) su pequeña tienda online.
    El woocommerce es una pasada. Yo jugué con él en un dominio que tenía por ahí. La verdad es que te lo hace casi todo.

    Me ha llamado la atención el que creas otra guía de posicionamiento en prestashop, ¿el seo no funciona igual que en wordpress?

    No sabía que tenías más blogs. He estado echando un ojo al de fotografía, jeje a mí también me gusta mucho.

    Un saludo fuerte Max

    Cova

    Responder
    • Max Camuñas

      Hola Cova 🙂

      ¡Muchas gracias!

      A mí también me interesa mucho el ecommerce. De hecho, tengo pendiente montar una tienda online (ya he hecho las primeras pruebas y todo).

      Las técnicas de posicionamiento en Google son las mismas, pero varía la forma según las plataformas.

      Me alegro que te hayan gustado mis otros blogs. Me gusta compartir con el mundo mis otras pasiones 😉

      ¡Saludos!

      Responder
  8. Carla

    Muchas gracias por el post Max, sin duda wordpress con los plugins que tiene como el Woocommerce o TheCartPress, permiten que novatos como yo puedan vender online sin mucho esfuerzo, aunque quisiera recomendar que siempre es mejor en la descripción del articulo a vender se haga una descripción totalmente original, he comprobado que mejora mucho el psosicionamiento, un saludo y sigue así 😉

    Responder
    • Max Camuñas

      Muchas gracias a ti por el comentario, Carla 🙂

      Precisamente para eso escribí este post, para quienes no tengan muchos conocimientos y quieran vender sus productos.

      Como bien dices, las descripciones, junto a las categorías, son dos de los más importantes para posicionar una ecommerce.

      ¡Un abrazo!

      Responder
  9. Alfonso

    Hola ¿Qué tal?
    He intentado instalar WooCommerce y me ha salido el error 500.
    Me he dado cuenta que al instalar el plugin dice: WooCommerce Incompatible con tu versión de WordPress.
    ¿Me puedes ayudar? ¡Gracias!

    Responder
    • Max Camuñas

      Hola Alfonso,

      ¿Tienes la última versión de WordPress instalada? En el caso de que no sea así, actualiza todo y vuelve a instalar WooCommerce.

      Saludos

      Responder
  10. Óscar

    Qué decirte que no te hayan dicho ya… Este post va a mi lista de marcadores, a la carpeta «tutoriales imprescindibles» 😉

    ¡Un abrazo!

    Responder
  11. gandhys

    si que es tremenda ayuda! Tengo poco de haber lanzado mi blog y estoy segura de que aplicaré unos cuantos de tus consejos amigo. Genial todos tus aportes!

    Responder

Enviar un comentario

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

Para cumplir con el nuevo RGPD y que tus datos estén a salvo, debes leer y aceptar mi política de privacidad. Tus datos serán guardados en SiteGround y WordPress, mi proveedor de hosting y el CMS que utilizo en esta web.

Soy Max Camuñas y te doy la bienvenida a mi blog (mi casa).

Por aquí hablo sobre los temas que me apasionan: WordPress, Marketing, Social Media o Blogging.

Me encanta ayudar a otras empresas a marcas a crear el diseño de su web desde cero.

¡MÁS SOBRE MÍ!

masterclass
CÓMO PLANIFICAR TU PÁGINA WEB PARA QUE TU NEGOCIO BRILLE
¡accede gratis!