A WooCommerce add to cart link simplifies the shopping experience for customers by allowing them to add products to their cart with just a click.
It's an excellent way to promote products and offer exclusive deals and discounts with social media and email marketing campaigns.
Unfortunately, many WooCommerce store owners find it challenging to create custom add to cart links for their products, limiting their ability to promote the products effectively.
It helps them provide a better user experience, ultimately attracting and retaining a number of your customers.
In this blog, we will share how you can add a custom add to cart link in WooCommerce that adds single or multiple products to the shopping cart with a single click.
Let’s begin.
Contents
By default, WooCommerce offers an Add to Cart button on the product page, which users can click to add products to their cart. Add-to-cart buttons can also be found by default in the related product sections.
These add-to-cart options are great for any user who is already on the website and checking the product details to buy. But you can’t share these products with people with a link that takes them directly to the cart or checkout page.
That’s where a custom link comes into play.
Move to the next section to find more.
A custom add-to-cart link in WooCommerce is a specially crafted URL that, when clicked, instantly adds one or more specific products to a user's shopping cart. This link is a convenient and efficient way to promote products, particularly in marketing campaigns, emails, or websites.
A add to cart WooCommerce link allows you to bypass the need for users to visit a product page and manually click the button. Instead, they can add items automatically to their cart with a single click on the custom link while they read about the product details.
Here is an example of a custom add to cart link in WooCommerce
Here ID represents the the product ID. We will talk more about how to create custom add to cart link in detail later.
You should utilize add to cart link in WooCommerce for several compelling reasons:
We hope now you realize if used wisely, custom add to cart link can immensely benefit your business.
Here, we will show how you can create a custom add to cart link for different types of WooCommerce products and redirect to the cart or checkout page. This is quite easy to do and does not require any plugins.
Every product has its unique ID number, and we will need this to create a custom add to cart link. Where you find the product ID depends on your product type.
To find ID for simple products, navigate to Products ⇒ All Products from the WordPress dashboard and hover over the product from which you want to create a link. You can find the ID here.
For variable products, you can collect the product ID, variation ID and all the attribute names with the values.
You will find the variable product ID from Products ⇒ All products.
For the variation IDs, you can edit the Product, scroll down to the variations tab, and find the ID for all the variable products.
With Grouped products, you need to collect the main group product ID, and since grouped products are a combination of other simple products, you also need to collect those simple product IDs.
Note: You can find the ID for grouped products the same way you can find it for simple products.
You can find the products that are included in the grouped products under the Linked Tab.
Once you have the necessary IDs, move to the next section.
First, let’s understand the URL parameters we will use to create a custom add to cart link. Here are the parameters:
Now, let’s check how you can use these parameters to create custom add to cart links.
To create the link, you need to append “add-to-cart=ID” to your domain address. All you’ll need to do is replace the ID with the product ID you want to add to the cart upon clicking on the link we will create.
Here is how the new URL will look:
Example:
Note: if you don’t specify the product quantity, a single product will be added to the cart.
If you want to specify the quantity, you’ll need to append “&quantity=number” to the above URL.
Here is how WooCommerce adds to cart link with quantity will look like:
Example:
For the add-to-cart parameter, you can either use the variable product ID or the ID of the variation.
To create a link using product ID, you need to specify the attribute name with values and also add the variation ID.
For example, for a variable product ID 20 with a variation ID 46. If you want to create a link that will add a small size product in the color blue, your custom URL will be like this:
To specify a quantity, append the “&quantity=number.” parameter.
The above URL with quantity 3 will look like this.
To use a custom add-to-cart link for a variable product using variation ID, you just need to use the variation ID as the add-to-cart parameter. Since each variable product with a unique ID already has the attributes assigned to it, you don’t need to specify.
So, if you want to create a custom link for a variable product with ID 20 that has a variation with ID 47, you can use this pattern:
Again, to specify quantity, append “&quantity=number.”
Note: While using the variation ID seems easier, the link with the product ID and specific attributes actually gives the user more information about the product, which can help with transparency.
As mentioned earlier, for grouped products, you will need to know the Grouped Product ID and the IDs of the linked products.
You must specify the quantity while creating a WooCommerce add to cart link for group products.
Here is the URL format you need to use:
Suppose a group product with ID 39 consists of two products: one with ID 15 and another with ID 16.
Then, the group product add-to-cart link will be like this:
Hitting the URL above will add the group product with one piece of the first product with ID 15 and two pieces of the item with ID 16.
If you don’t specify the page, the user will be redirected to the home page after adding the product using the custom link.
Since the product is added, the user should be redirected to the cart or checkout page.
Let’s check out how you can redirect users to the cart/checkout page.
If you want to redirect users to the cart page after the product is successfully added, navigate to WooCommerce ⇒ Settings ⇒ Products and check the option “Redirect to the cart page after successful addition”.
After checking the option, click on Save Changes to ensure your WooCommerce store will send users directly to the cart page after they add the product by clicking on the custom add to cart link.
Now, let’s check how you can send them directly to the checkout page.
Note: By skipping the cart page and sending users directly to the checkout page, you can ensure a better user experience, as it will save users time. However, if the users skip the cart page, they lose the ability to customize the order by updating the product quality.
FunnelKit Slide-in mini Cart solves this issue by allowing users to check their order details and modify the items anywhere on the website without going to the cart page. For more details, read our blog “How to skip cart page using a WooCommerce mini cart”.
To send the users directly to the checkout page, you need to ensure the option you checked to send users to the cart page is unchecked.
So navigate to WooCommerce ⇒ Settings ⇒ Products. Now ensure to uncheck the option “ Redirect to the cart page after successful addition.” Click on Save Changes to update.
After that, you also need to make some changes to the add to cart link. You need to add “/checkout” after your domain and before the add-to-cart parameter.
So it would look something like this.
With quantity
For variable product
For group product
If you want, you can redirect to any page you want, not just the cart and checkout page. For that, you need to follow the steps you would for the checkout page just replace “/checkout” with “/your_custom_page/”.
For example, if you want users to redirect to a page named “custom” your URL will look like this:
This is how easily you can create a WooCommerce add to cart link. However, this process only adds one product to the cart. Later in this blog, we will show you how to add multiple products to a cart with a single custom add to cart link.
Sometimes, the Add to Cart link may not work due to some reasons like
The first thing you should check and make sure that you have linked the cart page or checkout page properly.
After checking this, you need to inspect if there is a theme of plugin conflict. You should disable all the plugins other than WooCommerce to see if the issue is solved; if yes, then you know there is some conflict in the theme or plugin.
Ensure all the plugins you use are compatible with your current version of WordPress and WooCommerce. Sometimes, plugins that haven’t been tested with the latest version of WordPress can throw issues.
In case of theme conflict, switch to a different default WordPress theme.
In case of a memory issue, contact your hosting provider to increase the memory to solve this issue.
While you can solve the issue when using a custom WooCommerce add to cart link, it’s not the most efficient way as you can’t create a link for multiple products.
A custom add to cart link that will add multiple products will help you promote many products simultaneously.
Move to the next section to find out how to create a custom link using a sales funnel that will add multiple products to the cart and redirect the user to the checkout page with a single click.
To create WooCommerce add to cart link that will add multiple products to the cart with a single click, we use FunnelKit Funnel Builder.
This is the most potent funnel builder for WordPress that allows you to create beautiful sales funnels with landing pages, opt-in pages, checkout pages, thank you pages, one-click upsells, and so on, without requiring any coding knowledge.
FunnelKit has many prebuilt templates that you can easily import and use within a few clicks.
Depending on your requirements, you can create a custom link via a sales funnel for a single product or multiple products. Here, we will show how you can create a sales funnel that adds multiple products to a cart and use the funnel link as a WooCommerce add to cart link.
Before we start the process of creating a WooCommerce one click upsell funnel, let’s install and activate the FunnelKit Funnel Builder.
FunnelKit has two versions: Free and Pro. You need to install both the plugins.
First, navigate to FunnelKit ⇒ Funnels from the WordPress admin panel and click the ‘Create New Funnel’ button.
Now choose “sales funnels” as the type and choose your favorite page builder. FunnelKit is compatible with all the popular page builders, such as Elementor, Divi, Gutenberg, Oxygen, etc.
After that, hover over the template you like and click on Preview. Here, we are choosing the Minimalist template.
Now, choose whether you want a single-page checkout or a multi-page checkout. We are going with the simple single-page layout.
To import the template you choose, click “Import this funnel,” then provide a name and click Add.
Now your sales funnel with two steps - checkout and thank you page should be imported.
To customize the checkout page click on the Checkout step.
You can customize the content and style of the checkout template using Elementor by clicking on the "Edit Elementor Template".
Here, you can customize all the sections of the checkout page.
One of the useful features that FunnelKit offers on the checkout page is the WooCommerce mini cart. This feature allows users to modify the product quantity on the checkout page without going back to the cart page.
So, if you want to send your user directly to the checkout page, skipping the cart page and not worry about not giving the user enough control over their purchase decision, then you should definitely ensure your checkout page has this mini cart by FunnelKit.
After making the design changes, hit Update to save all the changes.
Note: Another great way of skipping the cart is to use a slide in the Shopping cart on your WooCommerce store. With a slide-in cart, customers can access the order at any time without going to the cart and can go directly to the checkout page by clicking on a button.
For more details, check our blog “How to Customize WooCommerce Checkout Page”.
Now move to the Products tab and click on the “Add Product” button. Then, search and select the product you want to be added to the cart upon clicking on the WooCommerce add to cart link.
Add as many products as you need using the same process. Finally, click on “Add New” to add the product to the checkout.
You can offer discounts on the products.
Scroll down to the settings section choose the option “Force sell all of the above product(s)” and click on Save changes to update.
Come back to the Design tab and scroll to the "Checkout Form Fields" section. Here, you can rearrange or customize the form fields. For more details, check this blog, “WooCommerce Checkout Field Editor.” If you want you can also add any custom field to the checkout page.
On the optimization tab, you can add express checkout like Apple and Google Pay, Google Address autocomplete, auto-apply coupon, etc. These will ensure your user experiences a frictionless checkout process.
For more details, you can read our blog on checkout page optimization.
Note: You can even offer an order bump on the checkout page to increase the average order value.
After customizing the checkout page, you can customize the thank you page as well. If you need help, check out the blog “How to Create Custom WooCommerce Thank You Pages”.
To get the WooCommerce add to cart link with products you added to the checkout, click on the Preview option of the checkout page.
This will open the link on a new tab.
Now you can copy this WooCommerce add to cart link and use it for any promotional campaign. Whenever the user clicks on the link, the products you added to the checkout will automatically be added to the cart, and they will be redirected to the checkout page.
The WooCommerce add to cart link is a valuable feature that can boost your sales by offering a seamless way for customers to add products to their cart with just a single click.
It's a user-friendly solution that make customer interaction more effective with your products during promotional campaigns.
Now you know how to create WooCommerce add-to-cart links that add single or multiple products to a cart with a single click.
With FunnelKit Funnel Builder, you can offer users an effective way of shopping by allowing them to update the product quantity on the checkout page.
Moreover, you can use the sales funnel builder to offer order bumps, upsell, and downsell to improve the average order value.
So, don’t waste time. Start using FunnelKit to create a WooCommerce add to cart link today.
