🛍️¡Cupón de Descuento WooCommerce y Popup en WordPress!📢

Hola amigos de Marieú Technology Corporation, ¡WooCommerce cupón y popup en WordPress! Sí, en esta guía, paso a paso, aprenderás a crear un cupón en WordPress, configurarlo según el tipo de descuento, importe, fecha de caducidad de cupón WooCommerce, cupón por gasto individual, excluir artículos, aplicar filtro de productos por cupón, por categoría, limitar el uso del cupón en WordPress y más. Como tema extra o «bonus track», les enseñaremos a crear una ventana popup  con cupón en WordPress con Elementor.🛍️📢

WooCommerce brinda el servicio de comercio electrónico de código abierto para la plantaforma de WordPress. Entre algunas ventajas, es una herramienta completa para añadir muchas características del producto o servicio, tiene amplio catálogo de extenciones gratuitas y de pago, variedad de pasarelas de pago, entre otras. La instalación del plugin WooCommerce se realiza por medio de WordPress o siguiendo pautas desde su página principal. Donde, podrás comenzar a construir, cada una de las páginas que te habíamos mostrado en nuestro blog: ¿Cuáles son las páginas de WooCommerce?.

¿Cómo crear Cupones de Descuento en WooCommerce y Popup en WordPress?

Por el lado de WordPress, nosotros vamos a crear el popup y le vamos a asignar el código del cupón. El objetivo es que podamos asignar a unas páginas específicas, para poder mostrar esta ventana, y que los usuarios puedan usar el cupón de descuento. Por el lado de WooCommerce, nosotros vamos a instalar el plugin dentro de WordPress, vamos a crear el cupón y configurarlo.

Diagrama: ¡Cupones de Descuento WooCommerce y Popup en WordPress! Fuente: Elaboración Propia.

Ya estamos en WordPress, vamos a irnos a plugin, aquí lo tenemos, en la sección izquierda. Colocamos añadir nuevo plugin y vamos a buscar WooCommerce. La primera opción es la que nosotros vamos a instalar. Una vez que lo instalemos, lo activamos y, por defecto, se van a crear un total de cuatro páginas. Entre ellas, tenemos una página de tienda, aquí está, una página de carrito, una página de mi cuenta y finalizar compra. El cupón, ¿dónde lo vamos a aplicar?, dentro de la página de carrito, ponemos ver. Exactamente, lo vamos a aplicar aquí, en esta sección. De hecho, esta página ya se crea por defecto, solo esta sección.

Ahora, nos vamos a ir a los cupones, para eso, nos vamos a ir aquí, dentro de marketing y seleccionamos cupones, ponemos añadir nuevo cupón. Donde dice código de cupón, va a ser el nombre del cupón que tus usuarios o clientes lo van a aplicar. Entonces, vamos a colocar Marieú23. De hecho, este mes Marieú está de cumpleaños, por eso vamos a crear un cupón de descuento de hasta un 50% en todos sus servicios. Ahora, ya tenemos el código del cupón, tenemos una pequeña descripción y ahora vamos a entrar a los datos del cupón.

Esta clasificación se genera en tres etapas: el general, restricción de uso y los límites de uso. Dentro de general, tenemos la siguiente configuración, por ejemplo, si nosotros queremos aplicar este 50%, lo que tenemos que hacer es fijarlo un descuento en porcentaje. Por ejemplo, si el usuario selecciona un producto o servicio, se estaría aplicando este 50%, a cualquiera de estos productos. Ahora si nosotros seleccionamos el descuento fijo en el carrito, imaginemos que sea solamente $10 y en el carrito tengamos un total de 20 productos, sumando en total $100, el descuento que se aplicaría salía solamente $10. Osea el usuario tendría que pagar, en este caso, solamente $90. Ahora, si nosotros queremos un descuento fijo de producto y el descuento, en este caso, es $10, se estaría aplicando el descuento de $10, por cada uno de estos productos.

Para ese caso, nosotros vamos a seleccionar solamente el primero, descuento en porcentaje. ¿Cuál sería ese descuento en valor?, sería 50.

Luego, tenemos la fecha de caducidad del cupón, dado que Marieú está de cumpleaños y tenemos este cupón de descuento, lo vamos a poner hasta un mes. Como Marieú cumpleaños el 24, nosotros vamos a dar un plazo de un mes, en este caso, que termine el 24 de mayo. Entonces, terminando esta fecha, ya no va a estar activo.

Vamos a la restricción de uso, tenemos gasto mínimo y máximo. En este caso, si queremos de repente, que se aplique este cupón siempre y cuando el usuario compre por lo menos $50. Gasto máximo, si queremos que no pase de los $100, se aplica este cupón.

Tenemos el uso individual, en este caso, vamos a marcar la casilla para que no se pueda combinar con otros cupones.

Además eso, tenemos la exclusión de artículos rebajados. Por ejemplo, si vamos a la sección de productos, entramos a la opción de editar nuestro servicio de diseñador gráfico, y aquí, por ejemplo, este precio ya está rebajado, es decir, ya está aplicado un descuento del precio normal. Entonces, si queremos excluir ese servicio, tendríamos que marcar la casilla. Entonces, el cupón no se estaría aplicando a ese precio que está rebajado.

Si queremos que se aplique a todos los productos, lo dejamos en blanco. Si queremos que se aplique en un producto en particular, ponemos el nombre de nuestro producto, por ejemplo, curso de optimización plan master, seleccionamos y solamente estaría aplicando a ese curso.

También tenemos la opción de excluir aquellos productos, de repente por categoría. Por ejemplo, aquí para el mismo producto diseñador gráfico, tenemos las categoría del producto en esta sección. Si queremos agregar una nueva, clasificando tus productos, lo podemos ir creando aquí, ponemos el nombre y ya se estaría agregando. Según esa categoría que has agregado el producto, podemos ir filtrando, es decir, que solamente a esa categoría se aplique el descuento.

Ahora, también tenemos la exclusión de esas categorías y, finalmente, lo que son los correos electrónicos. Por ejemplo, actualmente está sin restricciones, pero si nosotros seleccionamos un correo en particular, podemos permitir solamente el cupón de descuento, para esos correos. También lo podemos hacer por dominio, es decir, todos los que tengan @gmail.com, @outlook.com, entre otros. En ese caso, colocamos asterisco y ponemos gmail.com. Entonces, todos los correos que tenga el @gmail.com, van a ser permitidos para aplicar este cupón, el resto no estaría aplicándose.

Finalmente, vamos a los límites de uso. Recuerden que estos límites de uso, nosotros podemos establecer un límite de uso por cupón, es decir, que quizás haya un total de 100 cupones, 200 cupones y, luego de eso, ya no se va a poder usar.

También tenemos para limitar el uso de X artículos, es decir, si queremos que sea solamente cinco cupones para los artículos, quizás 10, llega ese tope y ya no podemos aplicar este cupón.

Finalmente, el límite de uso por usuario, es decir, quizás puede ser que se apliquen, solamente, ocho veces por cada uno de estos usuarios, que compre tu producto o servicio.

Una vez que hemos terminado, recuerden publicar, seleccionamos. Entonces, aquí lo tenemos, ya tenemos el código del cupón, el tipo de cupón, en este caso es un porcentaje, y el importe del cupón. Vamos a irnos ahora a comprar un servicio. Por ejemplo, entramos a página web, queremos optar por un plan básico de esta página web, que de hecho tiene las siguientes características. Ponemos lo quiero y aquí es donde vamos a aplicar el cupón. El precio de este servicio es de $31.99 y queremos aplicar un descuento, pegamos aquí el cupón Marieú23 y ponemos aplicar cupón. Entonces, ahí vemos que ya se estaría reduciendo hasta un 50%, es decir, $15.99.

Cupón descuento WooCommerce.
Fuente: Elaboración Propia.

Vamos a irnos rápidamente con el popup. Para eso, entramos aquí en plantillas y, en plantillas, vamos a añadir una nueva plantilla de de la clase popup. Colocamos el nombre cupón 50% Marieú23, creamos plantilla. De todos los popup, nosotros vamos a seleccionar el de aquí. Aquí vamos a colocar una imagen de feliz cumpleaños o Happy Birthday y, en la parte derecha, vamos a colocar el cupón, insertamos. Dentro del navigator, se ha incluido una imagen, esta imagen se ha reemplazado en esta sección, aquí está. Aquí se incluye la imagen, subimos el archivo de la imagen e insertamos la imagen de Happy Birthday. Seleccionamos, y en la parte derecha es donde hemos incluido un texto, de feliz cumpleaños Marieú, y algunos emojis por aquí.

Eso es en cuanto al encabezado, pero en cuanto al texto, el editor de texto: celebra el cumpleaños de Marieú con un 50% de descuento en todos nuestros servicios. Es aquí abajo, donde ya hemos colocado el cupón Marieú23. Luego, tenemos el botón, donde, el enlace que se va a direccionar, va a ser de todos nuestros precios. Selecciona el usuario aquí y se direcciona a la página de precios.

Cupón PopUp Elementor.
Fuente: Elaboración Propia.

Resultados Finales

Una vez terminado, ponemos en triggers y ahí es donde vamos a clasificar, en qué secciones se va a visualizar. Por ejemplo, queremos que se visualice aquí, en la página de precios, y en cada uno de estos servicios. Entonces, aquí add condition y ponemos en singular páginas, y buscamos nuestra página que va a mostrar el popup. En triggers, hemos colocado que se muestre, siempre cuando esté en un 50% on scroll o en desplazamiento de la página, aquí está, activamos y ponemos save and close.

Estamos más o menos a un 50% y ahí nos aparece el popup. Ya tenemos aquí el cupón, seleccionamos el botón de mis servicios y se direcciona a la página de precios. ¡Listo, gracias amigos de Marieú Technology Corporation!