Creando un producto variable

Información Adicional

No existe información adicional para este video tutorial.

Transcripción

Un producto variable en WooCommerce es muy similar a un producto simple.

Pero en lugar de tener el botón de añadir al carrito, se nos mostrarán varias opciones entre las que podemos elegir, por ejemplo tamaños o colores.

Y esas opciones o variaciones del producto pueden o no afectar su precio. Por ejemplo una camisa pequeña puede ser menos costosa que una de talla más grande.

Así que lo que haremos para iniciar es crear un nuevo producto.

Vamos a colocarle el nombre.

Y como en los otros casos, utilizamos texto desde lorem ipsum para nuestra descripción. Y también vamos a pegar algo de texto en la descripción corta para no hacerlo después.

También vamos a seleccionar una categoría para el producto, y añadiremos algunas etiquetas.

Luego subiremos la imagen principal de este producto.

Seleccionamos la imagen y después vamos a subir 3 imágenes más que las añadiremos en las opciones de imágenes para la galería.

Subiremos estas 3 imágenes aquí y después de añadirlas tendremos configuradas las opciones generales de este nuevo producto, ahora podemos enfocarnos en las opciones variables que le vamos a añadir.

Así que nos enfocamos en las opciones del producto, y en primer lugar debemos seleccionar el tipo de producto, así que seleccionamos producto variable.

Observa que la mayoría de opciones han desaparecido y tenemos un nuevo conjunto de opciones en la pestaña variaciones.

Solo como ejemplo vamos a suponer que utilizamos SKU.

No vamos a utilizar en este ejemplo las opciones de inventario y aunque deberíamos colocar la información para el envío, vamos a saltarnos estas opciones también.

Donde vamos a concentrarnos más es en las opciones de variaciones, pero antes de eso tenemos que añadirle atributos al producto para poder convertirlos en variaciones.

Así que vamos a crear nuestro primero atributo, el cuál será Talla.

En el campo que se encuentra aquí debemos colocar las diferentes tallas, pero es muy importante que separes las diferentes opciones con una pleca, en caso de que no encuentres esta tecla entonces puedes usar alt + 124 en Windows.

Para esta camisa le colocaremos tres tallas, S, M y L.

Anteriormente ya habíamos añadido atributos a los productos, pero en esos casos estos atributos solo se mostraban como información del producto, pero en este caso se convertirán en variables que afectan la compra del cliente.

Para poder dejar estos atributos como variables vamos a marcar la casilla para que sea visible y esta nueva casilla también.

Entonces si deseas añadir atributos que no se conviertan en variables, puedes dejar esta casilla sin marcar y WooCommerce no los añadirá como variables, los mostraría solo como información.

Así que guardamos los atributos y pasamos a la pestaña de variaciones.

Desde aquí podemos añadir nuevas variaciones, al dar clic aquí se creará una variación.

Desde este ícono podemos expandir las opciones de cada variación.

Puedes ver que podemos modificar muchas opciones para cada variación, iniciaremos por seleccionar la talla.

Podemos desactivar una variación si lo necesitamos aquí, también puedes indicar si es u producto virtual o descargable y si deseas gestionar el inventario para esta variación puedes marcar esta casilla, con lo que aparecerán las opciones de inventario para esta variación.

De esa forma si solo tenemos 50 camisas pero solo 10 son talla S, entonces podremos indicar aquí que tenemos 10 tallas S, con lo que tendremos un mejor control sobre el inventario que tenemos de este producto en todas sus diferentes variaciones.

En este caso desmarcare las opciones de inventario.

En precio debes indicar el valor de esta variación, el precio es requerido, así que no puedes dejarlo en blanco, en este caso diremos que tiene un valor de 20 dólares.

Luego podemos indicar un precio en promoción que será aplicable únicamente a esta variación.

Si depende esta variación el tamaño y peso del paquete, entonces puedes indicarlo desde aquí en la información de envío y finalmente podemos añadir una pequeña descripción sobre esta variación del producto.

Algo muy interesante es que podemos añadir una imagen diferente para cada variación, así que damos clic en este ícono y seleccionaremos una de las imágenes que hemos subido antes para la galería del producto.

Muy bien, ahora voy a colapsar las opciones de esta variación y añadiremos otra más, damos clic aquí para añadirla.

Rápidamente configuraremos esta nueva variación, primero seleccionaremos la talla.

Ahora vamos a seleccionar otra de las tres imágenes de la galería.

Y en valor para esta talla le colocaremos 25 dólares.

Muy bien, ahora repetimos el proceso para la siguiente talla, damos clic para añadir la nueva variación, seleccionamos la talla L.

Vamos a utilizar una imagen diferente también para esta talla.

Y el precio lo dejaremos en 30 doláres.

Muy bien, ahora colapsamos las opciones de esta talla.

Como puedes ver, hemos configurado las 3 variaciones del atributo talla para nuestra camisa.

Sin embargo el orden me parece que es el incorrecto, la talla S debería estar antes y al final la L.

Si arrastramos las variaciones desde este ícono, podremos cambiarlos del lugar.

Muy bien, ahora debemos dar clic en guardar cambios, es muy importante que guardes los cambios aquí antes de publicar o actualizar el producto.

Si los cambios no son guardados aquí entonces al actualizar o publicar tu producto, todas las opciones de variaciones se perderán.

Ahora tenemos nuestro producto completo así que vamos a publicarlo.

Muy bien, veamos cómo ha quedado nuestro nuevo producto.

En primer lugar podemos ver que tenemos toda la información normal del producto, la imagen principal, la galería de imágenes y sus descripciones.

Pero no tenemos el botón para añadir el producto al carrito, esto se debe a que primero debemos seleccionar una opción.

Como puedes ver en el precio del producto, en lugar de mostrarse un precio único, se muestra un rango de precios, eso es debido a que nuestros precios según la talla es diferente.

Al seleccionar una de las tallas se muestra el valor que pagaríamos por esta variación del producto, el botón para añadirlo al carrito y también la imagen que hemos decidido mostrar con esta variación.

Si cambiamos a otra talla podremos ver como la información del precio y la imagen también cambian.

El mostrar una imagen diferente puede ser muy útil cuando nuestro producto puede tener diferentes colores, tamaños o incluso formas.

Por ejemplo, regresemos a la edición de este producto, y lo que vamos a hacer es modificar el precio de todas las variaciones, dejaremos todos los precios en 25 dólares.

Una vez modificamos los precios debemos dar clic en guardar los cambios, es muy importante ya que en caso de no guardarlos, cualquier edición o variación nueva que hallamos añadido se borrará.

Muy bien, ahora actualizamos nuestro producto.

Regresemos a la vista del producto.

Ahora como puedes ver en el precio tenemos un precio único, y ya no se muestra el rango de precios.

Pero siempre debemos seleccionar una de las variaciones, y hasta que lo hagamos se mostrará el botón para añadir al carrito.

De modo que podemos añadir variaciones que no afecten el precio del producto, en este ejemplo podría ser el color de la camisa.

El cliente siempre deberá seleccionar el color pero eso no afectará el precio, ya que todas las variaciones tienen el mismo precio.

Y de esta forma hemos visto los 4 diferentes tipos de productos que podemos añadir en WooCommerce.

Cómo pudiste observar, WooCommerce es bastante versátil y tiene la capacidad de adaptarse a las necesidades de tu tienda.

Si deseas crear una tienda con productos simples, vender descargas como música, software o libros, vender ropa, vender productos de terceros como afiliado y prácticamente para cualquier tipo de tienda podrás utilizar WooCommerce.

6 Comments on “Creando un producto variable”

  1. Yaninab

    Hola hasta ahora cada paso que sigo de sus tutoriales me ha salido a la perfección pero estoy intentando con el producto variable agregar atributos y se me queda pensando, no logro hacerlo. Me sabrían decir porque? Muchas gracias!

    1. Lievanosan

      Gracias por su mensaje, ese inconveniente pueden ser dos cosas:
      1 – Un problema en su configuración PHP o un error en su cuenta de hosting.
      2 – Un error de compatibilidad entre uno de sus plugins adicionales y WooCommerce.
      Si usted tiene una cuenta de hosting con nosotros, por favor ingrese en su àrea de cliente y envíenos un ticket de soporte, un agente con gusto podrá solucionar su problema.

  2. Manuel Otacoma

    Holas, estoy subiendo una imagen de un producto (900×630 )px, el producto queda cortado; entonces se debe subir imagenes con algun tamaño predeterminado. Gracias

    1. Lievanosan

      Buen día, gracias por su mensaje, todo depende su plantilla, le recomiendo verificar la información de ayuda de su plantilla o consultar con su creador.

  3. Rociofalcon

    Hola he realizado cada paso como lo muestran los tutoriales, y tengo en mi tienda productos variables, pero no me da la opcion de elegir que variable y así darle comprar, que puedo hacer??

    1. Lievanosan

      Buen día, debe asegurarse de que las variables se encuentran activas y que el stock de cada variable es el suficiente. Sin poder ingresar a su área de admin para verificar su configuración, es difícil poder saber cuál es el inconveniente; sin embargo, si usted tiene una cuenta de hosting con nosotros, por favor envíenos un ticket de soporte y con gusto un agente de soporte le ayudará a verificar su configuración.
      Saludos.

Deja un comentario

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

¿Quieres aprender a crear sitios web?

Regístrate gratis como estudiante y aprende a crear sitios web sorprendentes. Gana certificados y medallas al completar los cursos gratuitos.
¡REGÍSTRATE GRATIS!
close-link
Crea tu sitio web con diseño profesional en menos de 15 minutos
Ver Tutorial
close-image