­čĄĹCrear bot├│n personalizado a├▒adir producto carrito - Woocommerce

Crear bot├│n personalizado a├▒adir producto carrito

Vamos a ver como crear un bot├│n personalizado para Woocommerce que al hacer clic en el directamente nos a├▒ada un producto al carrito para finalizar la compra.

Podemos crear un enlace al carrito del producto que queramos mediante su ID que nos la muestra en la pagina de todos los productos en Woocommerce.

crear boton a├▒adir al carrito woocommerce
ID de producto en Woocommerce

Solo hay que a├▒adirle al final de la URL de producto ?add-to-cart=aqui ponemos la id del producto

https://www.simracingirona.com/producto/camiseta-basica-vrg-blanca/ le a├▒adimos al final ?add-to-cart=7924 el numero es la id de producto

Si es un producto con atributos y variables no se añadirá al carrito directamente primero se tendrá que escoger la opción del producto, en el caso de las camisetas seria la talla y el color. Si es un producto simple se añadirá al carrito directamente.

Ejemplo URL a├▒adir al carrito: ­čĹç

https://www.simracingirona.com/producto/campeonato-f1-2019-t1/?add-to-cart=8014

Con esta URL podemos hacer cualquier link con los estilos que se quiera. En este caso he utilizado la clase btn de bootstrap para crear un bot├│n mas grande y acorde con lo que yo quer├şa hacer.

HTML para crear bot├│n de a├▒adir al carrito en Woocommerce.

crear boton a├▒adir al carrito woocommerce
Bodigo HTML para crear bot├│n a├▒adir al carrito

Tambi├ęn podemos dejar solo la URL y nos creara una bonita caja del producto con dos botones uno para a├▒adir al carrito y el otro para mas informaci├│n del producto, se genera autom├íticamente y queda muy bonito.

Caja del producto con URL

https://www.simracingirona.com/producto/campeonato-f1-2019-t1/?add-to-cart=8014

Otra manera de crear un enlace de a├▒adir al carrito en woocommerce es mediante Short codes.

Shortcode a├▒adir al carrito Woocommerce

Vista visual del short code

crear boton a├▒adir al carrito woocommerce
Vista del shortcode para a├▒adir al carrito

ShortCode Categor├şas Woocommerce

Ya por ultimo dejo otro shortcode muy ├║til para mostrar categor├şas de productos en paginas.

donde pone camisetas lo cambiamos por la categor├şa que queramos mostrar.

Otros Apuntes

Ruta del archivo modificado para cambiar el texto del bot├│n book events por reservar ahora:

public_htmlwp-contentpluginswoo-event-managerwoocommerce-events-manager.php

Imagen del archivo

modificar texto bot├│n book events
C├│digo modificado para el texto bot├│n Events Woo