Get Started

How to Create a Custom Add to Cart Link in WooCommerce

Editorial Team
July 25, 2024
How to Create a Custom Add to Cart Link in WooCommerce

A WooCommerce add to cart link simplifies the shopping experience by allowing customers to add products to their cart with a single click.

It’s an excellent way to promote products and offer exclusive deals and discounts through social media and email marketing campaigns.

However, many WooCommerce store owners find it challenging to create custom add to cart links for their products, which limits their ability to promote them effectively.

It helps them provide a better user experience, ultimately attracting and retaining a number of your customers.

In this blog, we’ll show 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.

Default Add to Cart Options in WooCommerce

By default, WooCommerce offers an “Add to Cart” button on the product page, which users can click to add products to their cart. You can also find the add to cart button in the related product sections.

default add to cart link in WooCommerce add to cart woocommerce link

These add-to-cart options are great for any user already on the website and check the product details to buy.

However, you can’t share these products with people through a link that takes them directly to the cart or checkout page in WooCommerce.

That’s where custom URLs come into play. Move to the next section to find more.

What is a Custom WooCommerce Add To Cart Link?

A custom add to cart link in WooCommerce is a specially crafted URL that, when clicked, instantly adds specific products to a user’s shopping cart

This link is a convenient and efficient way to promote products, particularly in marketing campaigns, automated emails, or on 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:

https://www.yourdomain.com/?add-to-cart=ID

Here, ID represents the product ID.

If you want to add a product by specifying a quantity, you can modify the URL accordingly:

https://www.yourdomain.com/?add-to-cart=ID&quantity=2

We will talk more about how to create a custom add to cart link in detail later. 

Why You Should Utilize WooCommerce Add to Cart Link?

You should utilize add to cart link in WooCommerce for several compelling reasons:

  • Enhanced shopping experience: WooCommerce add to cart links streamline the purchasing process. It allows customers to swiftly add items to their cart with a single click, eliminating the need to navigate multiple product pages.
  • Effective sales promotion: These links serve as potent tools for promoting products, special offers, or discounts, significantly increasing the likelihood of conversions and boosting overall sales performance.
  • Ensure customer satisfaction: The simplified functionality of add-to-cart links elevates the user experience, fostering customer satisfaction and cultivating loyalty by reducing friction in the buying journey.
  • Improved conversion rates: By reducing the complexity of adding items to the cart, these custom WooCommerce add to cart links contribute to heightened conversion rates, driving more successful transactions through a more efficient process.
  • Versatile marketing assets: These links can be strategically used across various marketing channels, including emails, social media platforms, and websites, allowing businesses to engage customers by expanding their reach and impact.

We hope now you realize if used wisely, custom add to cart link can immensely benefit your business.

How to Create a Custom Add to Cart Link Without Any Plugin?

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.

Step 1: Find the product ID

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.

Find ID for simple products

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.

how to find single product id in WooCOmmerce

Find ID for variable products

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

copy variable product main ID

For the variation IDs, you can edit the Product, scroll down to the variations tab, and find the ID for all the variable products.

how to find variations id in WooCommerce

Find ID for grouped 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.

copy grouped product main Id

You can find the products that are included in the grouped products under the ‘Linked Products’ tab.

find group product ids to create WooCOmmerce add to cart link

Once you have the necessary IDs, move to the next section.

Step 2: Create a custom WooCommerce add to cart link

First, let’s understand the URL parameters we will use to create a custom add to cart link. Here are the parameters:

  • add-to-cart: WooCommerce uses this parameter to add the product to the cart using the product ID or Variation ID (in case of variable products).
  • quantity: This parameter specifies the quantity of the product that will be added to the cart.

Now, let’s check how you can use these parameters to create custom add to cart links.

Custom add to cart link for simple products

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:

https://www.yourdomain.com/?add-to-cart=ID

Example:

https://www.yourdomain.com/?add-to-cart=21

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: 

https://www.yourdomain.com/?add-to-cart=ID&quantity=number

Example:

https://www.yourdomain.com/?add-to-cart=21&quantity=2

Custom link for variable products 

You can use the variable product ID or the variation ID for the add-to-cart parameter.

Using the main variable product ID

To create a link using product ID, specify the attribute name with values and 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:

https://www.yourdomain.com/?add-to-cart=20&variation_id=46&attribute_pa_colour=blue&attribute_pa_size=s

To specify a quantity, append the “&quantity=number” parameter.

The above URL with quantity 3 will look like this.

https://www.yourdomain.com/checkout/?add-to-cart=20&variation_id=46&attribute_pa_colour=blue&attribute_pa_size=m&quantity=3

Using variation ID

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:

https://www.yourdomain.com/?add-to-cart=ID

Again, to specify quantity, append “&quantity=number”.

https://www.yourdomain.com/?add-to-cart=47&quantity=2

Note: While using the variation ID seems easier, the link with the product ID and specific attributes gives the user more information about the product, which helps with transparency.

Custom link for grouped product

As mentioned earlier, you will need to know the Grouped Product ID and the IDs of the linked products for grouped 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:

http://yourdomain.com/?add-to-cart=GroupProductID&quantity[SimpleProductID]=QuantityNumber&quantity[SimpleProductID]=QuantityNumber

Suppose a grouped product with ID 39 consists of two items: one with ID 15 and another with ID 16.

Then, the grouped product add-to-cart link will be like this:

http://yourdomain.com/?add-to-cart=39&quantity[15]=1&quantity[16]=2

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.

Step 3: Set the redirection page

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 or checkout page.

Redirect to the cart 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’.

redirect to cart page using woocommerce add to cart link change add to cart link woocommerce

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”.

Redirect to the checkout page 

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 that you uncheck the option ‘Redirect to the cart page after successful addition’.

Click on ‘Save Changes’ to update. 

uncheck and send to checkout change add to cart link woocommerce

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.

https://example.com/checkout/?add-to-cart=21

With quantity 

https://example.com/checkout/?add-to-cart=21&quantity=1

For variable product 

https://www.yourdomain.com/checkout/?add-to-cart=20&variation_id=46&attribute_pa_colour=blue&attribute_pa_size=m&quantity=3

For grouped product 

https://www.yourdomain.com/checkout/?add-to-cart=39&quantity[15]=1&quantity[16]=2

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:

https://www.yourdomain.com/custom/?add-to-cart=21

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.

Troubleshooting Common Issues

Sometimes, the add to cart link may not work due to some reasons like:

  • Incorrect product IDs

Ensure that the product ID included in these add to cart links is accurate. Furthermore, confirm that the product is published and visible in your store.

Please note that hidden or draft products won’t be accessible via the link.

  • Conflicts with caching plugins or themes

Implement caching on your WooCommerce website to avoid issues with outdated or cached content that may affect the functionality of add-to-cart URLs.

Also, 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.

  • Issues with variable products

When dealing with variable products, ensure the variation ID is correctly included in the URL. Use appropriate attributes when adding variable products to your WooCommerce store.

Always check that the specified version exists and is available for purchase. Issues with stock or visibility settings can prevent variations from being added.

  • URL formatting problems

Double-check that the URL structure is correct and follows the proper format. 

Check your permalink settings in WooCommerce to ensure they are properly configured and do not cause conflicts with WooCommerce add to cart links.

  • User permissions and restrictions

Verify that there are no restrictions preventing guest users from adding products to their carts.

Check if specific user roles have restricted access to certain products or cart functionalities.

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.

How Do You Create a WooCommerce Add to Cart Link that Adds Multiple Products to the Cart 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.

Step 1: Create a sales funnel 

First, navigate to FunnelKit ⇒ Funnels from the WordPress admin panel and click the ‘Create New Funnel’ button.

add new funnel

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.

minimalist template click on preview

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’.

import minimalist for add to cart link funnel

Now your sales funnel with two steps - checkout and thank you page should be imported. 

Step 2: Customize the checkout page

To customize the checkout page, click on the Checkout step.

click on edit checkout

You can customize the content and style of the checkout template using Elementor by clicking on the "Edit Elementor Template" button.

edit minimalist checkout template one step

Here, you can customize all the sections of the checkout page.

customize order informations

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.

mini cart customizations

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 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”.

Step 3: Add multiple products to the checkout page

Now move to the Products tab and click on the ‘Add Product’ button. Then, search for and select the product you want to add 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.

add multiple products to checkout for add to cart link

You can offer discounts on the products.

add discount to multiple products

Scroll down to the settings section and choose the option “Force sell all of the above product(s)”.

force users to add all products to cart

Click on ‘Save Changes’ when done.

Step 4: Optimize the WooCommerce checkout page 

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 on WooCommerce Checkout Field Editor.

If you want, you can also add any custom field to the checkout page.

customize checkout form fields

On the Optimizations tab, you can add express checkouts, such as Apple Pay and Google Pay, enable Google Address autocomplete, auto-apply coupons, etc. These will ensure your user experiences a frictionless checkout process.

 For more details, you can read our blog on checkout page optimization.

WooCommerce checkout page customizations tab

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”.

Step 5: Test the WooCommerce add to cart link 

Click on the ‘Preview’ option on the checkout page to access the WooCommerce add to cart link for the products you added to the cart. 

click to preview add to cart link multiple product

This will open the link on a new tab. 

WooCommerce add to cart link multiple products review

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.

9 Use Cases for WooCommerce Add to Cart Links

Here are some use cases for add to cart URLs in WooCommerce.

1. Email marketing campaigns

Integrate add to cart links in your email campaigns to give recipients a one-click option to add promotional products directly to their cart.

This helps reduce friction and increases the likelihood of conversions.

2. Social media posts

Share add to cart links in your social media posts, stories, and ads to highlight particular products.

This enables targeted audiences to easily add items to their cart, driving higher engagement and sales.

3. Affiliate marketing programs

Equip your affiliate products with WooCommerce add to cart links, enabling them to direct traffic straight to the cart with their recommended products.

This not only boosts conversion rates but also enhances the effectiveness of your affiliate partnerships.

4. Custom product catalogs or price lists

Include add to cart links in your online catalogs or price lists, offering a seamless shopping experience.

Customers can quickly add products to their cart while browsing, improving their overall shopping journey and increasing the probability of multiple purchases.

5. Website banners and pop-ups

Use custom links in banners and pop-ups on your website to highlight special promotions or best-selling products.

This helps grab the attention of visitors and encourages immediate action or response.

6. Limited-time offers and flash sales

Include add to cart links in your promotions for flash sales or limited-time offers.

This creates a sense of urgency and makes it easy for customers to quickly take advantage of special deals.

7. Event promotions

Use add-to-cart links in your promotional materials for events such as holidays, product launches, or webinars.

This allows attendees to purchase featured products or exclusive event items.

8. Customer support

Use WooCommerce add to cart links in customer support communications to assist customers in finding and purchasing the correct products.

This can help resolve queries faster and improve customer satisfaction.

9. Influencer marketing

Provide influencers with add to cart links for the products they promote.

This enables their followers to easily purchase recommended products, leveraging the influencer’s reach and credibility to boost sales.

5 Best Practices for Using Add to Cart Links in Your WooCommerce Store

Follow these best practices to use add to cart links in your WooCommerce store.

1. Use product ID for accurate identification of items

Always use product ID when creating add to cart links to ensure accurate product identification.

Avoid using SKUs or product names, as these can lead to errors or conflicts.

2. Ensure links are properly coded, especially for variable products

Make sure that all special characters in your add-to-cart links are properly encoded.

This is especially useful for variable products, where additional parameters may be included in the URL.

3. Test links thoroughly across different devices and browsers

Test your custom URLs across different devices like desktops, tablets, and mobile phones to ensure they function correctly on all platforms.

Verify that these links work seamlessly in various browsers, such as Google Chrome, Firefox, Safari, Edge, etc., to avoid any user experience issues.

4. Use SSL for improved security

Use SSL (HTTPS) for all your add-to-cart links to enhance security and protect customer data.

Check and update your links regularly to ensure they are still valid, especially after making changes to your product catalog or website structure.

5. Provide a clear call to action (CTA)

Ensure that you use proper call-to-action (CTA) buttons and hyperlink the relevant add-to-cart product URLs to them.

This encourages customers to click and adds to the overall effectiveness of the URLs.

Join our Facebook group and subscribe to our YouTube channel for more tips on how to generate revenue with your WooCommerce store.

Frequently Asked Questions (FAQs)

Find answers to frequently asked questions related to the WooCommerce add to cart link.

1. How to add add to cart link in WooCommerce?

To add an add to cart link in WooCommerce, use a URL with specific structure that will automatically add a product to the cart when clicked.

We have covered the complete process in detail in this article.

2. How do I link an add-to-cart?

You can link an add-to-cart by creating a custom link using the product IDs of different items. 

Once you've done this, hyperlink this URL in various places on your website, such as buttons, banners, or custom HTML blocks.

3. How to redirect add to cart page in WooCommerce?

Navigate to WooCommerce settings. Under the Products tab, you’ll see the settings for redirecting to the cart page.

Enabling this option will redirect users to the cart page, and disabling it will redirect them to the checkout page when they click on the add-to-cart URL.

4. How do I add a product to a cart in WooCommerce?

You can add a product to a cart in WooCommerce using two methods. The first method is manually going to the product page through the shop page and clicking the add to cart button.

The next method is to create a custom WooCommerce add to cart link (which we’ve discussed in this article).

Ready to Use WooCommerce Add to Cart Link?

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 makes 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.

Author: Editorial Team
The Editorial Team at FunnelKit (formerly WooFunnels) is a passionate group of writers and copy editors. We create well-researched posts on topics such as WordPress automation, sales funnels, online course creation, and more. We aim to deliver content that is interesting and actionable.
chevron-down