#1 Empresa independiente en la venta de plugins para WooCommerce
Comprar por categoría
VIDEOFORMACIÓN DE LA UX DEL COMERCIO ELECTRÓNICO

VIDEOFORMACIÓN DE LA UX DEL COMERCIO ELECTRÓNICO

Descubre nuestra experiencia en formación y mejora tu comercio electrónico para fidelizar a tus clientes y aumentar tus ventas. ver nuestros cursos

AUDITORÍA DE LA UX DEL COMERCIO ELECTRÓNICO

AUDITORÍA DE LA UX DEL COMERCIO ELECTRÓNICOPróximamente

Auditamos tu comercio electrónico y te ayudamos a optimizarlo para conseguir mayores conversiones.

Español

< Volver al blog

TutorialesCómo crear tu propia pizza; utiliza complementos para personalizar tus productos de WooCommerce

Has soñado alguna vez con tener tu propio restaurante de pizza para llevar, o has pasado por el desafío de tener que crear productos con diferentes ingredientes?

Este tutorial es un buen comienzo sobre cómo configurar productos de este tipo usando WooCommerce.

Si nunca has usado WooCommerce, lee las guías esenciales sobre cómo configurar tu tienda.

¿A quién le servirá este tutorial sobre complementos para productos de WooCommerce?

Tal como lo sugiere el título, el tutorial tratará sobre cómo crear tu propia pizza. Estamos todos de acuerdo al decir que la pizza es una de nuestras comidas favoritas, ¿verdad? Pero, ¿cuántas veces te has puesto de acuerdo en un sabor único estando entre un grupo de amigos? Probablemente nunca. Y esto puede ser particularmente difícil para restaurantes y lugares de pedidos para llevar. Y no sólo será este un caso aplicado únicamente a la pizza, puede trasladarse a tartas de cumpleaños, hamburguesas, o incluso productos no comestibles.

Si vendes cualquier producto que incluya alternativas, pronto serás capaz de incluir los mismos tipos de opciones a diferentes productos.

El desafío de crear un producto del tipo “Crea tu propia pizza”

Si tienes instalado WooCommerce, sabes cuán desafiante puede resultar crear opciones personalizadas para tus productos. Probablemente estarás bien pensando en listas desplegables, seccionando opciones simples. Pero al momento de comenzar a agregar costos por ítem elegido, crear un texto personalizado, subir un archivo u ofrecer productos, se torna complejo incluso para plugins dedicados a la personalización ya que por lo general requieren extensas configuraciones para lograr una adaptación a tu tema.

Cuando añades YITH WooCommerce Product Add-ons and Extra Options a tu lista de plugins, tu comienzo será muy bueno, y serás capaz de resolver la primera parte del problema. El paso siguiente será brindarte una guía para recrear las mismas opciones encontradas en nuestra demo.

Pizza - producto personalizable

El proceso de crear complementos y opciones adicionales en 8 pasos

Paso 1 – Añade un producto simple de WooCommerce 

Crea un producto con un precio base. Dentro del mismo producto, agregas descripción, imágenes y stock disponible (necesario en el caso de tener 30 bases de pizza disponibles cada día).

Paso 2 – Agrega un bloque de opciones

Dirígete a los ajustes de YITH > Product Add-ons > Bloques de opciones y haz clic en “añadir bloque” para comenzar la configuración de opciones del nuevo bloque. Los bloques serán los complementos que se le atribuyen a los productos simples creados en el Paso 1. Puedes añadir la cantidad que quieras, de acuerdo a las opciones que necesites ofrecer.

Añadir nuevo bloque

Paso 3 – Nombra tu bloque y establece una prioridad

Establecer una prioridad es muy importante al momento de crear más de un bloque, ya que de esa manera se le otorga un orden de aparición a cada elemento.

Añadir nombre y nivel de prioridad del bloque

Paso 4 – Configura las reglas de visualización

En esta sección vas a elegir el producto al cual se le agregarán los complementos. En nuestro ejemplo, sólo tenemos un producto “Tu pizza en casa!”. Pero si lo deseas, puedes exhibir los complementos en todos los productos, o dentro de una categoría o producto específico.

Incluir producto en reglas del bloque

Paso 5 – Añade opciones de ingredientes

Volviendo a la pestaña de opciones, hacemos clic en “Añadir Opciones” y una ventana emergente nos mostrará los elementos HTML y las opciones para el usuario. Para los ingredientes, vamos a elegir la opción de “Etiqueta o imagen” y luego “Poblar Opciones”.

Tipos de opciones

Vamos a crear etiquetas con íconos que nos permitirá identificar fácilmente los diferentes ingredientes. Además, le daremos un título (“Elige los ingredientes”), citaremos cada ingrediente y agregaremos la imagen que representará al mismo, por último fijamos el precio en €2.00.

Poblar opciones de la etiqueta o imagen

Se debe repetir el proceso para cada ingrediente haciendo click en: “+ Añadir nueva opción”.

Si vamos a la pestaña “Mostrar ajustes” nos encontraremos con nuevas opciones. Habilitaremos con un ‘Sí’ la opción de ocultar precios de opciones, y en Diseño de opciones > Opciones por fila fijamos  4. Luego, activamos el diseño de cuadrícula para que las opciones se puedan ver a lo ancho de nuestra página de producto.

Mostrar ajustes del bloque

Las pestañas de Estilo y Lógica condicional no deben ser modificadas en relación con este producto, por lo que pasaremos directamente a Ajustes avanzados. Dentro de esta sección, activamos la opción de establecer las primeras opciones seleccionadas como gratuitas y escribimos un número en el espacio de abajo dedicado a la cantidad necesaria (3 para nuestro producto). A continuación, seleccionamos “Múltiple” para la cantidad de opciones que el usuario podrá seleccionar.

Ajustes avanzados de la etiqueta o imagen

Una vez finalizado el proceso de añadir ingredientes y establecer los ajustes necesarios debemos guardar usando el botón que aparece al final de la ventana emergente. El resultado final de la configuración se verá así en nuestra página:

Cuatro ingredientes por fila

Como has podido comprobar, hemos logrado las configuraciones necesarias para que el cliente pueda elegir tres ingredientes gratuitos y pagar $2 por cada agregado adicional con la posibilidad de añadir varios ingredientes a la vez.

Paso 6 – Agrega una selección de bebidas 

Continuando con nuestro ejemplo de producto, el cliente puede elegir entre tres opciones de bebidas. Para lograrlo, vamos a “Añadir opciones” (igual que en el paso 5) pero en esta oportunidad elegiremos “Casilla de verificación”. Así se verán las opciones de configuración:

Poblar opciones de la casilla de verificación

Nombramos la etiqueta como “Cerveza”. Para ponerle un precio primero seleccionamos la opción Precio > Incrementar el precio del producto principal. El hacerlo nos habilitará un espacio donde fijaremos el precio normal en 4,50 y permitirá sumar el valor individual de nuestras bebidas al precio final del producto. En los Ajustes avanzados, dejaremos el tipo de selección única para que con la compra del producto se pueda elegir solamente una bebida.

Ajustes avanzados de la casilla de verificación

Paso 7 – Otorga a los usuarios la opción de retirar el pedido a elección

Otra función de gran utilidad al momento de ordenar una comida y que a la vez permite organizar los pedidos y entregas es el complemento “Fecha”. Gracias a esta opción, los usuarios podrán seleccionar una fecha y horario durante el cual prefieren recibir su pizza.

El proceso de añadir será el mismo que para los demás, sólo que en esta ocasión elegiremos “Fecha” y realizamos la configuración.

Opciones de campo de fecha

Hemos agregado un Título, Etiqueta y establecimos el año de inicio y finalización. Además, puedes establecer días y horarios específicos durante los cuales el restaurante está abierto y deshabilitar los días no laborales. Para nuestro producto, activamos el selector de horarios y hemos activado  las franjas horarias estableciendo intervalos de tiempo entre cada entrega, para que esté permitido hacer encargos cada 30 minutos.

Detalle de las opciones

 El resultado final en nuestra página se verá así:

Calendario en la página de producto

Paso 8 – Consulta la configuración y mejora el estilo de tus complementos

Habrás pasado por alto numerosas opciones de configuración que aún no hemos mostrado. Existen muchas formas de edición de estilo para crear lo que buscas. Lo mejor de todo, es que no dependes de un desarrollador para escribir el código y diseñarlo, cada configuración y opción está descrita al detalle en nuestra documentación.

¿Por qué usar YITH Product Add-ons and Extra Options?

A estas alturas hemos demostrado que aumentar las opciones, las etiquetas, los precios adicionales y la configuración de la pantalla solo se puede gestionar fácilmente con los complementos de productos. Tanto si quieres crear opciones de comida o cualquier otro tipo de personalización, solo te hemos enseñado a grandes rasgos lo que puedes hacer con este plugin. 

Las opciones se pueden aplicar en todo el sitio, por categoría/etiqueta o por producto. De esta manera, puedes crear y gestionar complementos de manera muy eficiente. Un aumento de precio para los aderezos de salami se aplicará en cuestión de segundos en todos los productos de pizza. 

Nuestro plugin se ha integrado con al menos otros 12 plugins, incluyendo Request a Quote, Product Bundles, Deposits and Down Payments, y muchos más.

Más información o cómo empezar

Obtén más detalles sobre las características e integraciones en la página del plugin, o prueba el plugin gratuito y limitado de wordpress.org. 

Para probar una demo similar o muchas otras, dirígete a esta sandbox. Para configurar los diferentes ajustes tenemos una amplia documentación creada, aunque también puedes ver algunos de los tutoriales en español que tenemos en nuestro canal de Youtube. También tenemos el mismo contenido en inglés e italiano.