Si no te es suficiente con los botones estándar de WooCommerce para añadir productos al carrito, en esta guía rápida aprenderemos cómo crear URLs con las que personalizar botones y enlaces para redirigirlos a donde quieras y cómo quieras.
URL para añadir al carrito un solo producto
Más fácil imposible. Identifica el ID de tu producto en la página de productos.
A continuación crea la URL para añadir ese producto al carrito así:
https://tudominio.com/?add-to-cart=296
Recuerda cambiar lo de tudominio.com por el tuyo y, por supuesto, el ID del producto de ejemplo por el que tú quieras.
URL para añadir al carrito varios productos
Si quieres que la URL añada más unidades del artículo (en el ejemplo 2) entonces la URL sería así:
https://tudominio.com/?add-to-cart=296&quantity=2
URL para añadir al carrito un solo producto y redirigir al carrito
Si quieres que, tras añadir el producto, se redirija automáticamente al cliente al carrito entonces usa esta otra variación:
https://tudominio.com/carrito/?add-to-cart=296
Aquí revisa, adicionalmente, si el slug de tu carrito es ‘carrito‘ u otro, para adaptar el truco a tu tienda.
Para que funcione este truco debe estar activa la casilla “WooCommerce > Ajustes > Productos > Mostrar > Redirigir a la página del carrito tras añadir productos con éxito”
URL para enviar al pago directamente un solo producto
Otra variación de la URL sería enviar al pago directamente, sin pasar por el carrito, en cuyo caso usa una URL como la de este ejemplo:
https://tudominio.com/finalizar-compra/?add-to-cart=296
De nuevo, revisa si el slug de la página de finalizar compra en tu tienda es ‘finalizar-compra‘ u otro, en cuyo caso pon el tuyo.
Para que funcione este truco en este caso debe esta inactiva la casilla “WooCommerce > Ajustes > Productos > Mostrar > Redirigir a la página del carrito tras añadir productos con éxito”
URL para redirigir a cualquier página un solo producto
Si quieres que, tras pulsar el botón, redirigir al usuario a cualquier otra página que no sea el carrito o el pago, puedes crear una URL así:
https://tudominio.com/otra-pagina/?add-to-cart=296
Para que funcione deben estar los ajustes de mostrar producto igual que en el caso anterior.
URL para añadir al carrito productos variables con atributos
Para crear este tipo de enlaces necesitas el ID de la variación, el slug del atributo y el slug del término del atributo. ¿Dónde están?…
Localizar el ID de la variación
Localizar el slug del atributo
Localizar el slug del término del atributo
URL para añadir al carrito un producto variable con un atributo
Por ejemplo. Si creamos esta URL…
https://tudominio.es/?add-to-cart=246&variation_id=1761&attribute_pa_talla=xl
Estamos añadiendo la variación con el ID 1761, con el atributo talla, término xl, del producto con ID 246.
Por supuesto, cambia la URL para que se adapte a tus necesidades. Parece un poco raro, incluso lioso, pero hecho el primero los demás son fáciles.
URL para añadir al carrito un producto variable con dos atributos
https://tudominio.es/?add-to-cart=246&variation_id=1761&attribute_pa_talla=xl&attribute_pa_color=azul
Si te fijas, hemos usado el mismo ejemplo anterior pero añadiendo otro atributo, el color azul. Fácil ¿eh?
URL para añadir al carrito varios productos variables con dos atributos
https://tudominio.es/?add-to-cart=246&variation_id=1761&quantity=2&attribute_pa_talla=xl&attribute_pa_color=azul
Usando la misma URL del ejemplo anterior hemos añadido una cantidad de productos de la variación, en este caso 2 (quantity=2)
URL para añadir al carrito un producto variable con un atributo y redirigir al carrito
Ya mezclando cosas que hemos ido aprendiendo, podemos redirigir al carrito al cliente tras añadir el producto variable con atributo así:
https://tudominio.es/carrito/?add-to-cart=246&variation_id=1761&attribute_pa_talla=xl
URL para añadir al carrito un producto variable con un atributo y redirigir al pago
Y una cosa parecida para redirigir directamente a la página de pago:
https://tudominio.es/finalizar-compra/?add-to-cart=246&variation_id=1761&attribute_pa_talla=xl
No hace falta que lo hagamos con cualquier otra página ¿verdad? Está chupao.
URL para añadir al carrito productos agrupados
Esto puedes usarlos para añadir no uno, sino varios productos de una agrupación, pudiendo incluso indicar cuántas unidades de cada.
&quantity[1730]=0
En este ejemplo del producto agrupado (ID 1771) hemos añadido 2 unidades del agrupado 1736 y 3 del 1730.
Los IDs de cada producto los tienes como hemos visto antes, y los de los agrupados al producto agrupado los puedes ver también al añadirlos.
Si quieres que no se añada ninguna cantidad de alguno de los productos de la agrupación deberás indicarlo con un cero. Por ejemplo, añadiéndolo así a tu URL:
&quantity[1730]=0
Aplicar cupones descuento en WooCommerce enviando una URL a los clientes.
Ya hemos ocultado el campo de los cupones descuento en el formulario del carrito y en el de la página de pago. Ahora es el momento de configurar la URL para aplicar el cupón descuento que hayamos creado en WooCommerce, pero antes es necesario instalar un plugin capaz de procesar los códigos descuento a través de la URL.
Para conseguir eso tienes 2 opciones:
- Usar el plugin premium URL Coupons de Wootheme. Cuenta diferentes ajustes personalizables desde el panel de cupones de WooCommerce, permitiéndote entre otras cosas: definir URLs únicas, seleccionar los productos y variaciones de productos que se añadirán al carro cuando el cliente haga clic en la URL, definir una página de redirección, etc
- Usar el plugin gratuito WooCommerce Coupon Links. Es un plugin mucho más simple que el anterior y no permite tanta personalización. De hecho, ni siquiera dispone de interfaz de configuración. Pero lo he probado y puedo asegurar que funciona bastante bien.
En este caso yo te voy a explicar cómo hacerlo con el plugin gratuito WooCommerce Coupon Links.
Para instalarlo simplemente descargar el archivo .zip desde el repositorio de Github. Después accede a tu panel de WordPress y entra en «Plugins > Añadir nuevo«. Para terminar, haz clic en «Subir plugin«, selecciona el archivo .zip, después clic en «Instalar plugin» y por último, clic en «Activar plugin«.
Una vez instalado, no tienes que configurar ningún ajuste. El plugin ya estará listo y operativo.
Para definir la URL con el cupón descuento voy a mostrarte un ejemplo de cómo lo he hecho yo para que el descuento se aplique a un producto en concreto.
La estructura de la URL sería la siguiente:
http://www.tutienda.com/carro/?add-to-cart=ID-PRODUCTO&coupon_code=CÓDIGO-CUPÓN
Lo único que hay que hacer es sustituir el valor «ID-PRODUCTO» por el número de ID del producto y «CÓDIGO-CUPÓN» por nombre del código descuento.
Para identificar el ID del producto en cuestión, simplemente entra en «Productos» y coloca el cursor del ratón encima del producto que te interese. Haciendo eso verás que justo debajo del nombre del producto aparece su valor de ID.
Para este ejemplo he creado también un cupón descuento del 20% del valor del producto y lo he llamado «cinrundesc20«. Por tanto, este sería el aspecto que debería tener la URL final:
http://www.tutienda.com/carro/?add-to-cart=277&coupon_code=cinrundesc20
Con esta configuración, cualquier usuario que visite esa URL irá a parar directamente a la página del carro de compra de tu tienda, con el producto ya añadido y el cupón descuento aplicado.
Como ves, el sistema para aplicar cupones descuento en WooCommerce a través de la URL es bastante sencillo y te permite seguir usando cupones descuento en tu tienda sin necesidad de mostrar el campo en el formulario de compra.
Una técnica de venta interesante, aplicada a este caso, podría consistir en enviar alguna campaña de email marketing a tu lista de clientes ofreciéndoles el cupón descuento para un determinado producto, simplemente haciendo clic en el enlace de la URL.
De esta forma haces el trabajo por ellos y aumentas la probabilidad de que cada clic al enlace acabe en compra. Con esta técnica el cliente ya no tiene que preocuparse de introducir ningún cupón, ni tampoco perder tiempo en añadir el producto al carro.
¿Puedo hacer lo mismo con un plugin?
Vale, sí. Puedes instalar el plugin WooCommerce Quick Buy y, una vez instalado, dispones de un generador de shortcodes para crear enlaces a donde quieras.
Y en su página de ajustes especificar si aplicarás alguna redirección y en qué productos vas a incluir los botones.
Una vez todo configurado los botones se mostrarán donde hayas especificado, o podrás incluir shortcodes donde gustes.
Si optas por personalizar dónde se mostrarán los botones, tienes dos shortcodes, con sus correspondientes posibles argumentos:
Shortcodes disponibles
[wc_quick_buy]— Para usarlo en el loop del producto (lista de productos, página de producto[wc_quick_buy_link]— Lo puedes usar donde quieras
Argumentos del shortcode [wc_quick_buy]
- product : id del producto para generar el botón de compra rápida. Ej:
[wc_quick_buy product="22"] - label : texto para el botón. Ej:
[wc_quick_buy label="¡Comprar ya!"]
Argumentos del shortcode [wc_quick_buy_link]
- product :id del producto para generar el botón de compra rápida. Ej:
[wc_quick_buy_link product="22"] - label :texto para el botón. Ej:
[wc_quick_buy_link label="¡Comprar ya!"] - qty : Cantidad del botón/enlace html. Ej:
[wc_quick_buy_link qty="10"] - type : Usa button para generar un botón:
[wc_quick_buy_link type="button"]o link para la URl:[wc_quick_buy_link type="link"] - htmlclass : Puedes darle al shortcode un nombre de css
Ejemplo de uso para un botón
[wc_quick_buy_link product=”22″ label=”¡Compra ya!” qty=”10″ type=”button”]
Ejemplo de uso para un enlace
[wc_quick_buy_link product=”22″ label=”¡Compra ya!” qty=”10″ type=”link”]
Espero que esta guía te ayude a mejorar las ventas en tu tienda online. Cualquier duda que tengas déjala en los comentarios.
Hola, muy buen artículo!
Se podría crear una URL que además de añadir un producto al carrito lo haga aplicando un cupón de descuento?
Gracias!
Hola, disculpa la tremenda demora en la respuesta.
Se aplicaría de la siguiente forma:
http://www.tutienda.com/carro/?add-to-cart=ID-PRODUCTO&coupon_code=CÓDIGO-CUPÓN
hola, primero que todo excelente articulo, tengo una situacion.
Tengo instalado el plugin wp crowdfunding, pero estos aportes deben de ser con un precio fijo o unos bonos fijos, ejemplo $50,$100,$150. entonces estos deben de ir solo con botones para que redirija al checkout para agilizar la compra de los bonos a los crowdfunding. Como podria crear este link con esos precios dijos?
Hola Edwin! lamento no poder resolver tu incógnita. Tendría que ver el funcionamiento del plugin wp crowdfunding y ver como recibe las variables para poder tener una idea de como enviar el monto/aporte con la url.
Si los aportes funcionan como producto variable solo debieses enviar la id: http://www.tutienda.com/carro/?add-to-cart=ID-PRODUCTO
Te recomiendo que hagas la misma consulta en los foros del plugin o en Themeforrest, de seguro alguien tuvo la misma pregunta antes.
Esto también te puede ser útil: https://businessbloomer.com/woocommerce-custom-add-cart-urls-ultimate-guide/
Espero te puedan ayudar, suerte!!!!!
Hola, se pueden crear urls personalizadas para cada checkout de cada producto para poder utilizarlo con fb pixel?
Hola Franco!
Woocommerce Facebook Pixel hace prácticamente todo por ti, no veo porque desarrollarlo de forma manual y por producto.
https://blog.recart.com/how-to-track-facebook-pixel-events-on-woocommerce/
https://wedevs.com/es/121412/track-facebook-pixel-conversion-woocommerce-store