Si no te vale 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.
Estos trucos que vamos a ver de cómo crear URLs personalizadas, al igual otros que hemos visto y veremos, te ayudarán a mejorar tu funnel de ventas y, en definitiva, vender más.
Índice de contenidos
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.com/?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.com/?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.com/?add-to-cart=246&quantity=2;variation_id=1761&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.com/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.com/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.
https://tudominio.com/?add-to-cart=1771&quantity[1736]=2&quantity[1730]=3
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:
https://tudominio.com/?add-to-cart=1771&quantity[1736]=2&quantity[1730]=0
¿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.
¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!
AVISO: Esta publicación es de hace 3 años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado. ¡Ah! ¿te funciona? pues entonces no he dicho nada :)
Muy buen articulo, quiero felicitaros por vuestra página y Blog! Muchas gracias siempre por vuestras ayudas! Voy a apuntarme a vuestro proximo curso que ahora tenéis completo… Saludos!!
Gracias @disqus_teamseoblasteo_1_2_3:disqus
En el próximo aún quedan plazas. Es online pero totalmente en directo, igual que presencial pero mediante streaming…
https://servicios.ayudawp.com/tienda/curso-wordpress-profesional-streaming/
En el próximo aún quedan plazas. Es online pero totalmente en directo, igual que presencial pero mediante streaming…
https://servicios.ayudawp.com/tienda/curso-wordpress-profesional-streaming/
Hola buenas, gran post, si me permites, una pregunta, en el blog yo tengo un post que habla sobre un producto, y quisiera dar la oportunidad de comprar el producto desde esta entrada del blog, con esto lo puedo hacer?, como seria la URL que le daria al boton para que vaya al carrito de la compra con ese producto??
Gracias
Sí claro, el primero que indico, este: https://ayudawp.com/urls-personalizadas-woocommerce/#URL_para_anadir_al_carrito_un_solo_producto
Mil gracias Fernando, eres un crack!! 🙂
Hola. Excelente artículo! Pero tengo una duda. Cómo puedo hacer para que mi producto aparezca con su imagen, una breve descripción y sus atributos, como color, y la cantidad? Quisiera insertar un producto en una página que estoy creando desde Elementor y me encantaría que apareciera la imagen del producto como se ve en el ejemplo de este artículo con la camisa ninja.
Muchas gracias!
Elementor tiene su propio modo de insertar productos, y primero tienes que activarlo en sus ajustes
Hola… Gracias por la informacón. Es casi al 90% lo que andaba buscando… Pero tengo una consulta. Existe forma o plugin que vaya más allá? Es decir, que un botón o url (con sus variables) en ruta demás permita al cliente comprar directamente un producto. Obviamente hablo de un servicio pre-aceptado por el cliente para compras recursivas… Gracias!!!
¿Como para enviar por email en un boletín o así?
Como puedo poner un botón de PAGAR en donde me lleve directo a un popup para que el cliente pague directo con su tarjeta y no llenando el formulario que esta en el checkout.
Hola Fernando! En mi caso, necesitaría hacer que el botón AÑADIR AL CARRITO redireccione a otra web, pues es un producto que no se puede comprar directamente en la mía. ¿Alguna solución? Gracias 🙂
Buen dia Amigo tengo un problema similar, necesito agregar al carrito un producto reservable pero no encuentro que URL usar, uso la URL /?add-to-cart=91 pero me pide agregar el dato 1 y el dato 2 que son fecha de entrada y de salida, sabes como debe ser el orden como se debe poner?
@fernandot:disqus Enhorabuena por el post! Me ha ayudado muchísimo. Lo único que me surge una duda… Hablas de añadir productos al carrito directamente, incluso en la cantidad que se quiera, pero yo necesitaría añadir varios productos simples distintos a la vez con la misma url, es decir ?add-to-cart=ID1+ID2 sería posible? Cuál sería la estructura de la url?
Muchas gracias de antemano.
Un saludo!
Antes de nada darte la enhorabuena por el post, pues me ha ayudado mucho!
Lo único que me surge una duda…Necesito crear una URL que agregue directamente varios productos al carrito. Por lo que dices se puede agregar un producto agregando ?add-to-cart=ID pero necesito agregar varios productos diferentes, es decir, varias ID diferentes ?add-to-cart=ID1+ID2.
¿Podría decirme la forma correcta de crear esa URL?
Muchas gracias!
hola muy buenas tardes tengo un problema quiero añadir dos botones uno que diga add to cart y el otro details que muestre los detalles del producto
DESPUÉS DE HORAS VIENDO VÍDEOS APARECE EL MAESTRO Y CONSIGO PONER EN MI PAGINA UN BOTÓN DE CARRITO DE COMPRA QUE ME FUNCIONA. GRACIAS
Una pregunta como puedo anadir al carrito diferentes produtos con diferentes cantidades:
Promocion lleva 2 polos con 2 pantalones: al carrito
de esta forma al cliente le sadra un descuento.
ya con un plugin tengo la opcion para que salga el descuento en el carrito
El unico probkema es que creare un banner y quiero mandar cuando haces clic en el Banner se agregen esos 4 prodcutos al carrito por ende se aplica el descuento y el cliente no tenga que buscar los productos por diferentes categorias.
Muchísimas gracias por tu ayuda Fernando! Como dicen arriba, no hay nada como ir a buscar al «maestro» y dejar de perder el tiempo buscando «por ahí», jeje.
Enhorabuena por el post alto y claro! Lo he aplicado y me ha funcionado a la primera 😉
Un saludo
Hola,
Sería Posible añadir el producto al carrito y que de alguna forma recoja el dato, inlcuyendolo en el pedido, de la URl desde la que ha pulsado el botón de añadir al carrito?
Muchas gracias!
Seria posible generar un link al producto con la variable elegida sin enviar al carrito? quisiera generar links que lleven a la informacion del producto pero con la variable ya elegida, sin enviar al carrito aun
Claro, pero ¿no es la configuración por defecto? Sino simplemente modifica un poco la URL para quitar el
add_to_cartHola, felicidades por el artículo Fernando. Tengo una duda, he utilizado las URL tal cómo has indicado y todo perfecto pero cuando la trabajo como UTM Analytics no registra los clics. ¿Sabes cómo solucionar este problema?
Muchas gracias