Por ello, añadir un temporizador de cuenta atrás a WooCommerce es una de las mejores estrategias para aumentar las ventas y potenciar la conversión . Para eso, puedes usar una cuenta regresiva de productos para mostrar información más clara sobre tus campañas de ventas.
Tabla de contenido:
¿Cómo agregar la cuenta regresiva a producto WooCommerce?
La forma más fácil de agregar una cuenta regresiva del producto WooCommerce es usar un plugin de cuenta regresiva dedicado. Si está buscando una opción gratuita para agregar una cuenta regresiva de productos para su sitio web de WooCommerce, le recomendamos el Sales Countdown Timer como inicio. Lo usaremos para esta demostración también.
Sales Countdown Timer es un plugin de WordPress que le permite crear un temporizador de cuenta regresiva para su sitio web. El plugin es muy fácil de configurar e integrar en cualquier proyecto con opciones avanzadas.
Le permite mostrar un temporizador de cuenta regresiva personalizable que se puede incluir en un widget, publicación o página de la barra lateral a través de códigos cortos. Se pueden crear para un solo producto, así como un temporizador de cuenta regresiva masiva para productos variables.
Características clave:
- Genera códigos cortos
- Interfaz simple y limpia
- Fácil cambio de fuente y color desde las opciones del plugin
- Opción de restablecimiento de cuenta regresiva automática
Cómo configurar Sales Countdown Timer:
Antes de comenzar, asegúrese de configurar WooCommerce correctamente utilizando uno de los temas de WooCommerce compatibles para evitar conflictos de temas o plugins. Por ahora, comencemos instalando y activando el plugin.
1. Instale el plugin Temporizador de cuenta regresiva de ventas
Lo primero que debe hacer es visitar la página Plugins> Agregar nuevo
2. Configure los ajustes del plugin
Después de activar el plugin, debe configurarlo. Puede encontrar una nueva opción » Temporizador de cuenta regresiva » agregada en el menú del Panel de WordPress. Tan pronto como lo abra, puede ver un botón de alternar que le permite habilitar o deshabilitar o incluso eliminar el temporizador de cuenta regresiva de su sitio web de WooCommerce.
Después de eso, hay 3 configuraciones principales para configurar y configurar el plugin. Incluyen configuraciones generales, diseño y productos de WooCommerce. Veamos cómo podemos configurar los ajustes del plugin.
2.1) Configuración general
En la configuración general , puede establecer un nombre para el temporizador de cuenta regresiva para que pueda encontrar el perfil de cuenta regresiva de ventas cada vez que desee agregar el temporizador de cuenta regresiva en la página de un solo producto.
A continuación, deberá configurar la fecha y la hora para programar el temporizador de cuenta regresiva del producto.
Hay algunas funciones más en la configuración general, como «Cuenta regresiva siempre verde» y «Reiniciar cuenta regresiva después». Están disponibles solo en la versión premium del plugin.
2.2) Configuración de diseño
Puede personalizar la apariencia general del temporizador de cuenta regresiva en la configuración de Diseño . Hay un total de 10 opciones que puede configurar para hacer coincidir el temporizador de cuenta regresiva con su sitio web. Ellos son:
- Mensaje : agregue un mensaje de texto que aparece en la parte delantera
- Separador de tiempo : elija el separador como dos puntos (:), coma (,), punto (.). entre unidad de tiempo
- Estilo de formato de fecha y hora: seleccione varios estilos de formato para la hora
- Posición de la unidad de fecha y hora: elija la posición superior o inferior para mostrar la unidad de tiempo.
- Estilo de animación: elija el estilo de animación predeterminado o de diapositivas para el temporizador de cuenta regresiva
- Tipo de pantalla : elija varios diseños para el temporizador de cuenta regresiva
- Temporizador de cuenta regresiva : elija un color para el fondo, el borde, el relleno y el radio del borde del temporizador de cuenta regresiva
- Elementos del contador de tiempo : permite establecer el color de los elementos del contador de tiempo
- Valor de fecha y hora: personalice el color de fondo y el tamaño de fuente para el valor de fecha y hora
- Unidad de fecha y hora: personalice el color de fondo y el tamaño de fuente para las unidades de fecha y hora.
2.3) Configuración del producto WooCommerce
Finalmente, la configuración del producto WooCommerce le permite configurar cómo desea que se muestren los productos de cuenta regresiva.
Puede habilitar un temporizador fijo para los productos y ajustar su posición en un solo producto o páginas de archivo.
Del mismo modo, si desea mostrar el temporizador de cuenta regresiva en la tienda o en las páginas de categorías , también puede hacerlo. El tamaño del temporizador puede incluso ajustarse para estas páginas en dispositivos móviles.
Además, también puede habilitar un temporizador de cuenta regresiva para su próxima venta. Todo lo que tiene que hacer es agregar un mensaje personalizado a su sitio web.
Por último, también obtiene opciones de barra de progreso para su temporizador de cuenta regresiva. Puede configurar estos ajustes para ver la disponibilidad del producto junto con el estado del pedido de los productos. No solo eso, sino que también puedes personalizar el diseño de la barra de progreso.
Lo primero que podemos ver en la barra de progreso es una sección con un mensaje de barra de progreso. Aquí puede configurar el mensaje con la ayuda de códigos cortos como {quantity_sold}/{goal} sold
A continuación, podemos ver cuántos de sus productos se han vendido seleccionando un tipo de barra de progreso. Hay dos opciones que son aumentar y disminuir. Si selecciona la opción de aumento, su barra de productos se llena con cada compra del producto.
Además del tipo de barra de progreso, también puede ver la opción «Estado del pedido». Esta opción le permite seleccionar primero el estado de un pedido y solo el estado del pedido seleccionado se contará en la barra de progreso.
También puede seleccionar la posición de la barra de progreso de la venta. Hay dos posiciones donde puede mostrar la barra de progreso que está arriba y debajo del reloj de cuenta regresiva.
Para la última configuración, puede cambiar el color del texto, el fondo y el radio del borde de la barra de progreso.
3. Agregue el temporizador de cuenta regresiva a los productos
Después de la configuración, ahora puede agregar fácilmente un temporizador de cuenta regresiva a sus productos WooCommerce directamente desde la página de edición de pedidos. Simplemente vaya a Productos> Todos los productos desde su panel de WordPress. Aquí puedes ver todos sus productos. Puede hacer clic en Editar o seleccionar el producto en el que desea configurar el temporizador de cuenta regresiva
Esto lleva a la página de edición del producto . Luego, desplácese hacia abajo donde puede ver los datos del producto con varias opciones en el menú desplegable. Dado que estamos agregando un temporizador de cuenta regresiva a un solo producto, debe seleccionar ‘Producto simple ‘ en el menú desplegable.
En la configuración general , puede establecer el precio regular junto con el precio de venta. Debajo de eso, haga clic en la opción Programar después de la opción Precio de venta. Podemos ver configuraciones adicionales del temporizador de cuenta regresiva donde puede establecer una fecha y hora para la cuenta regresiva.
Además, también puede seleccionar el perfil del temporizador de cuenta regresiva que creamos durante la configuración. En nuestro caso, se trata de “ Liquidación de Stock ”. Puede nombrar el nombre del perfil de acuerdo con su campaña de ventas.
La barra de progreso también se puede habilitar desde aquí marcando la casilla.
Luego, todo lo que tiene que hacer es establecer una meta y una cantidad inicial que les permita a sus clientes saber qué cantidad del producto se ha vendido o está disponible. Una vez que haya terminado, haga clic en el botón Actualizar . Como resultado, puede ver que el temporizador del contador se muestra en la página del producto.
3.1) Agregue el temporizador de cuenta regresiva del producto WooCommerce a una sola página con códigos cortos
Si desea agregar la cuenta regresiva del producto WooCommerce a otras páginas de WooCommerce en lugar de productos, simplemente puede usar códigos cortos. Se proporcionan en la página de configuración del temporizador de cuenta regresiva. Simplemente copie el código abreviado.
Ahora todo lo que necesita hacer es editar la página donde desea que se muestre la cuenta regresiva del producto. Luego, pegue el código abreviado aquí.
Finalmente, haz clic en Actualizar . Si obtiene una vista previa de la página, puede encontrar el temporizador de cuenta regresiva en el frente de la página.
4. Agregue un temporizador de cuenta regresiva de ventas a granel para productos variables
Vimos cómo podemos agregar un temporizador de cuenta regresiva del producto WooCommerce para un solo producto. Ahora veamos cómo podemos agregar ventas a granel a un producto con variaciones o productos variables .
Anteriormente, en la página de edición del producto, configuramos el producto individual como ‘Producto simple’, pero ahora debemos cambiar el tipo de producto a ‘ Producto variable’ en el menú desplegable de Datos del producto.
Puede notar que estas configuraciones son diferentes del Producto simple. Pero el proceso para establecer la cuenta regresiva es el mismo que el de los productos individuales para los productos Variables.
Seleccione Variaciones de las opciones y vuelva a configurar la fecha y la hora para el temporizador de cuenta regresiva junto con el objetivo y la cantidad inicial del producto. También puede habilitar o deshabilitar la barra de progreso marcando la casilla.
A partir de entonces, debe ir a Producto > Todos los productos. Para agregar un temporizador de cuenta regresiva de ventas al por mayor, debemos filtrar el tipo de producto, seleccionar Producto variable en el menú desplegable y hacer clic en el botón Filtrar .
Ahora solo puede ver la lista de productos variables en la lista de productos.
Seleccione los productos variables y seleccione Editar en el campo Acción masiva y haga clic en el botón Aplicar justo al lado.
Si se desplaza más en la página de edición, puede encontrar un temporizador de cuenta regresiva de ventas al por mayor para productos variables.
Después de editar el temporizador de cuenta regresiva de ventas al por mayor según sus preferencias, haga clic en Actualizar.
Hola! Genial explicado, pero ¿no hay ninguna manera de poner la cuenta atrás dinámica? Es decir, que en cada producto se muestre la fecha de finalización de su oferta, no una general para todos. Yo lo estoy haciendo con una plantilla de Single Products del editor de temas de Elementor Pro y, la verdad, me estoy volviendo loca. Todos los plugins son iguales y no ofrecen la funcionalidad que busco.