Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Cómo añadir una barra de envío gratuito en WooCommerce

Nota editorial: Ganamos una comisión de los enlaces de socios en WPBeginner. Las comisiones no afectan a las opiniones o evaluaciones de nuestros editores. Más información sobre Proceso editorial.

De vez en cuando, alguno de nuestros lectores nos envía un mensaje preguntando si es posible ofrecer envíos gratuitos en una tienda WooCommerce. Lo es, y sabemos que ofrecer envíos gratuitos es una de las mejores formas de aumentar las ventas.

Hemos ayudado a miles de usuarios a crear una tienda online y aumentar sus conversiones. El envío gratuito es una forma probada de reducir el abandono del carrito y aumentar las tasas de conversión generales. El problema es que la mayoría de los propietarios de tiendas no destacan la oferta de envío gratuito.

En este artículo, te enseñaremos cómo añadir una barra de envíos gratuitos en WooCommerce para aumentar las ventas.

Adding a free shipping bar in WooCommerce

Añadir una barra de envío gratuito en WooCommmerce

Los gastos de envío son una de las principales causas de abandono del carrito de la compra. Muchas tiendas online lo solucionan ofreciendo envíos gratuitos.

Informar a los clientes acerca de su oferta de envío gratuito es una excelente manera de aumentar las ventas de su tienda en línea.

He aquí un ejemplo de banner de envío gratuito. Es un elemento destacado del sitio web que se mantiene en la parte superior de la pantalla mientras el usuario se desplaza hacia abajo:

Free shipping bar example

Como puede ver, la tienda de ejemplo anterior anima a los usuarios a gastar una determinada cantidad para obtener el envío gratuito. Esto es ideal para aumentar el valor del pedido / orden del carrito y el volumen total de ofertas.

Puede activar el envío gratuito incentivado utilizando el plugin Advanced Coupon para WooCommerce.

Independientemente de cómo active el envío gratuito, es clave destacarlo correctamente en su sitio, y ahí es donde entra en juego una barra de envío gratuito.

Para crear la barra de envío, vamos a utilizar OptinMonster. Es una potente herramienta para crear todo tipo de mensajes / ventanas emergentes en WordPress.

Crear una cuenta de OptinMonster y conectar WordPress

En primer lugar, tendrá que visitar el sitio web de OptinMonster y acceder a una cuenta. Es el mejor software de generación de clientes potenciales y plugin de optimización de conversiones para WordPress.

OptinMonster

Nota: OptinMonster fue co-creado por Syed Balkhi, fundador de WPBeginner. Es una herramienta optin muy popular que utilizamos aquí en WPBeginner, y la recomendamos encarecidamente.

Puedes leer nuestra reseña / valoración completa de OptinMonster para más detalles.

Después de haberse registrado en OptinMonster, el siguiente paso es instalar y activar el plugin gratuito de OptinMonster para WordPress. Consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Este plugin conecta la aplicación OptinMonster a su sitio WordPress. Tras activarlo, haz clic en el menú OptinMonster de tu escritorio de WordPress. A continuación, haz clic en el botón “Conecta tu cuenta” y conecta WordPress a tu cuenta de OptinMonster.

Connect OptinMonster to your WordPress site

Creación de una barra de envío gratuito para WooCommerce

Ahora, puede crear su barra de banner de envío gratuito.

En primer lugar, vaya a la página de OptinMonster en su escritorio de WordPress y, a continuación, haga clic en el botón “Añadir nuevo” situado en la parte superior derecha o haga clic en el botón “Crear su primera campaña”.

Create new campaign

Se abrirá una nueva ventana emergente en la que podrá elegir plantillas o libros de jugadas.

OptinMonster ofrece hermosas plantillas para su campaña. Puede seleccionar una y personalizarla según sus necesidades. Por otro lado, también ofrece campañas listas para usar inspiradas en marcas de éxito.

Para este tutorial, seleccionaremos la opción “Plantillas”.

Select a template or playbook

Esto le llevará al maquetador de campañas de OptinMonster.

Aquí deberá seleccionar “Barra flotante” como tipo de campaña.

Choose floating bar campaign

A continuación, desplácese hacia abajo y elija su plantilla de campaña. OptinMonster tiene una gran variedad de plantillas profesionales para elegir. Coloque el cursor del ratón sobre la plantilla y haga clic en el botón “Usar plantilla”.

OptinMonster le pedirá que nombre su campaña. Aquí puede utilizar el nombre que desee.

Enter a name for your campaign

Cuando esté listo, haga clic en el botón “Empezar a construir”.

A continuación, verá la interfaz del maquetador de OptinMonster, donde hay diferentes bloques que puede añadir a la plantilla.

Customize the floating alert bar

Por defecto, la barra flotante se pegará a la parte inferior de la pantalla. Si la quieres en la parte superior de la pantalla, es fácil cambiarla.

Sólo tiene que seleccionar la barra flotante y, a continuación, hacer clic en “Ajustes de la barra flotante”, en el menú de la izquierda. A continuación, active la opción “Cargar barra flotante en la parte superior de la página”.

Move the alert bar to the top

Para cambiar el texto de la barra, basta con hacer clic en ella.

Puede personalizar el texto según sus necesidades. También puedes cambiar el estilo, el color y el tamaño de la fuente, entre otras cosas. La vista previa de su campaña se actualizará automáticamente para mostrar cómo se verá en vivo.

Aquí hemos cambiado el texto y el tipo de letra. También hemos aumentado ligeramente el tamaño de la fuente:

Edit text of free shipping bar

También puede cambiar el botón de la barra de envíos gratuitos.

Basta con hacer clic en el botón para que se abran los ajustes en el panel de la izquierda. Ahí puedes cambiar el texto del botón.

Edit button text and settings in free shipping alert bar

Para dirigir a los clientes a una página de su sitio web WordPress acerca del envío gratuito, puede introducir la URL de redirección correcta.

Si desea utilizar un color diferente para su barra de envío gratuito, también es fácil. En primer lugar, haga clic en la pestaña “Avanzado” del menú de la izquierda y cambie el color de fondo del botón.

Edit button color and effects

A continuación, deberá seleccionar las reglas de visualización que controlan quién debe ver la barra de envíos gratuitos en su sitio.

Basta con hacer clic en la pestaña “Normas de visualización”, en la parte superior de la pantalla.

Setting your display rules in OptinMonster

Por defecto, OptinMonster muestra su barra flotante después de que el usuario haya estado en cualquier página de su sitio durante 5 segundos.

Es posible que desee que la barra de envíos gratuitos se cargue al instante. Para ello, simplemente quite esta regla. Para ello, haga clic en el icono del signo menos situado a la derecha:

Have your free shipping bar appear instantly

Ahora, debería quedarte la regla ‘La ruta URL actual es cualquier página’.

Minientrada, también puede elegir diferentes reglas de visualización. Por ejemplo, puede mostrar la barra de envío gratuito al salir o a usuarios de regiones geográficas específicas o cuando visiten una página de productos concreta.

Physical location display rules

El último paso es publicar tu campaña en tu sitio. Haga clic en la pestaña “Publicar” situada en la parte superior de la pantalla.

Mientras estás creando tu campaña, está en pausa por defecto. Puedes cambiarla de borrador a publicación.

Publish free shipping bar

Una vez hecho esto, basta con hacer clic en el botón “Guardar” y cerrar el maquetador de campañas.

A continuación, verá los ajustes de salida de la campaña para su barra de alertas de envío gratuito. Asegúrese de que el estado es Publicado, o simplemente haga clic en el menú desplegable y cámbielo de Pendiente a Publicado.

Free shipping bar output settings

No olvides hacer clic en el botón “Guardar cambios” cuando hayas terminado.

Ahora, puede visitar su blog o sitio web WordPress y ver su barra de envíos gratuitos en directo.

Aquí tiene una vista previa del aspecto de una barra de alertas en nuestro sitio de compras de demostración.

Free shipping bar preview

Esperamos que este artículo te haya ayudado a aprender cómo añadir una barra de envío gratuita en WooCommerce. Puede que también quieras marcar / comprobar nuestra lista de los mejores plugins de WooCommerce para tu tienda online y nuestra comparativa de los mejores servicios de telefonía para empresas con características inteligentes de enrutamiento de llamadas.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Descargo: Nuestro contenido está apoyado por los lectores. Esto significa que si hace clic en algunos de nuestros enlaces, podemos ganar una comisión. Vea cómo se financia WPBeginner , por qué es importante, y cómo puede apoyarnos. Aquí está nuestro proceso editorial .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

El último kit de herramientas de WordPress

Obtenga acceso GRATUITO a nuestro kit de herramientas - una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Reader Interactions

1 comentarioDeja una respuesta

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

Deja tu comentario

Gracias por elegir dejar un comentario. Tenga en cuenta que todos los comentarios son moderados de acuerdo con nuestros política de comentarios, y su dirección de correo electrónico NO será publicada. Por favor, NO utilice palabras clave en el campo de nombre. Tengamos una conversación personal y significativa.