Creating Custom “Add to Cart” URLs in WooCommerce
Are you facing problems while creating custom add to cart URLs for WooCommerce setup? In today’s post, we will help you to show how to create a custom add to cart URL. Custom “Add to Cart” link to add a product in the cart, redirecting to a specific page that includes variables and grouped products.
However, adding products to the cart is the first step to convert the user into a customer. In WooCommerce you can add products to their products from their description page or from the shop page, to some type of products.
Sometimes it is not enough for the landing page, it will be great for the specialty of the terrible product you have created. In this case, you can use the shortcode [add_to_cart].
However, also create your own button using custom add to cart URL by using Visual Builder or Pricing Table Plugin.
In this case, add to cart shortcode can not work properly due to the some issue of the styling, as it can not be compatible with the plugin you are using. In those cases, you have to create your Add to Cart URL. It is very easy to do this. Therefore, here’s the best guide for creating a custom “Add to Cart” URL.
Create WooCommerce Custom Add to Cart URLs
Simple Products: Add to Cart URL
It’s easy to add them to the cart through the easiest, simple product custom URL in all of them. Just locate the product ID by hovering over the product title under WooCommerce>>Product (see image below), and then use the following link.
URL: Add a Simple Product to the Cart
href=”http://yourdomain.com/?add-to-cart=25″
Here, change the domain name in the link, and the button will work out of the box. 1 product ID = 25 will be added to the cart.
URL: Add A Simple Product to the Cart with Quantity = 3
href=”http://yourdomain.com/?add-to-cart=25&quantity=3″
1 product = 25 and quantity = 3 will be added to the cart with ID. Note: You can not add 2 different products to the cart with the URL.
URL: Add a simple product to the cart and redirect after the cart
href=”http://yourdomain.com/cart/?add-to-cart=25″
Remember, if you’ve changed the URL for the cart, be sure to replace “/cart /”for “/basket /” for example. For this job, you have to tick the “Add to Cart button button” option under WooCommerce -> Settings -> Products -> General.
URL: Add a simple product to the cart and then redirect to checkout
href=”http://yourdomain.com/checkout/?add-to-cart=25″
Remember, to work you need to tick the “Add to Cart” button on the “Add to Cart Button” option under WooCommerce -> Settings -> Products -> General – Also disable “Redirect to Cart Page” after successful :
URL: Add a simple product to the cart and then redirect to any page later
href=”http://yourdomain.com/your_custom_page/?add-to-cart=25″
Remember, in order to work, you have to tick the “Add to Cart Button Add” option under WooCommerce -> Settings -> Products -> Normal and disable the redirect on the cart page even after it is successful.
Variable Products: Add to Cart URL
Here things get complicated. Variable products have 1 or more attributes, and possibly a quantity also. In addition to finding product IDs, you also have to search the Variation ID, Attribute NAME Slug, and Attribute Period SLUG.
Once you have a product ID, variation id and its specific features, you can use the following.
URL: Add a Variable Product to the Cart (with 1 attribute only)
href=”http://yourdomain.com/?add-to-cart=47&variation_id=88&attribute_pa_colour=blue”
We are adding variable product ID=47 here and especially its variation ID = 88, where the color attribute is equal to blue. The Kinda is complicated but it becomes easy once you play with them.
URL: Add A Variable Product to the Cart (with 2 attributes)
href=”http://yourdomain.com/?add-to-cart=47&variation_id=88&attribute_pa_colour=blue&attribute_pa_size=m”
Here we are adding Variable Product ID 47 and especially its Variation ID = 88, where the color attribute is equal to blue and the size feature is “M”.
URL: Add a convertible product to the cart (with 2 attributes and quantity = 3)
href=”http://yourdomain.com/?add-to-cart=47&variation_id=88&quantity=3&attribute_pa_colour=blue&attribute_pa_size=m”
You can redirect the cart, checkout and other pages in the same way as we have seen for the simple product page:.
URL: Add A Variable Product to the Cart & Redirect it to the Cart
href=”http://yourdomain.com/cart/?add-to-cart=47&variation_id=88&attribute_pa_colour=blue”
URL: Add A Variable Product to Cart & Redirect it to the Checkout
href=”http://yourdomain.com/checkout/?add-to-cart=47&variation_id=88&attribute_pa_colour=blue”
URL: Add a convertible product to the cart and redirect to any page
href=”http://yourdomain.com/any-page-url/?add-to-cart=47&variation_id=88&attribute_pa_colour=blue”
