A Shopify store can look completely normal while one of its most important features suddenly stops working.

The Add to Cart button may stop responding, add the wrong product, fail to update the cart, work on desktop but not mobile, or appear to work while nothing is actually added to the cart.

This can happen after a theme customization, app installation, theme update, JavaScript change, or product/variant configuration change.

The good news is that you usually don't need to rebuild your entire product page.

In most cases, the problem can be traced to a specific part of the product form, variant selection, JavaScript, cart functionality, app conflict, or theme code.

Here are 9 practical fixes to try when your Shopify Add to Cart button is not working.

1. Check If the Product Has an Available Variant

One of the first things to check is the product's variant configuration.

If a product has multiple variants such as:

Size
Color
Quantity
Material

the selected variant must be available before Shopify can add it to the cart.

For example, a customer may select:

Black → Large

but that particular variant may be unavailable or incorrectly configured.

What to check

Go to:

Shopify Admin → Products → Select Product → Variants

Check:

Is the variant active?
Is inventory available?
Is the variant correctly connected to the product?
Does the selected option actually change the variant?
Is the correct variant ID being submitted?

If the button works for products with one variant but fails for products with multiple variants, the variant selection logic is one of the first places to investigate.

2. Check the Product Form and Variant ID

Shopify's Add to Cart functionality depends on the product form sending the correct variant information.

A common problem occurs when custom theme code modifies the product form and the selected variant ID is no longer submitted correctly.

A typical Shopify product form contains information similar to:

<input
  type="hidden"
  name="id"
  value="{{ product.selected_or_first_available_variant.id }}"
>

The important part is that the cart request receives the variant ID, not simply the product ID.

If this value is missing, incorrect, or not updated when the customer changes a variant, the Add to Cart request can fail.

Quick test

Try adding a simple product with only one variant to the cart.

Then test a product with multiple variants.

If the simple product works but the multi-variant product doesn't, inspect the variant-selection and product-form code.

3. Check Your Browser Console for JavaScript Errors

If clicking Add to Cart does absolutely nothing, JavaScript is one of the first things you should investigate.

Open your browser's developer tools:

Chrome → Right Click → Inspect → Console

Then click the Add to Cart button.

Look for errors such as:

Uncaught TypeError
ReferenceError
Cannot read properties of undefined
AJAX errors
Failed network requests
Errors from third-party apps

A JavaScript error elsewhere on the product page can sometimes prevent the Add to Cart functionality from running correctly.

Example

You might see something like:

Uncaught TypeError: Cannot read properties of undefined

That doesn't necessarily mean the Add to Cart button itself is broken.

A script loaded earlier on the page may have failed and stopped another script from executing.

This is why simply replacing the button isn't always the correct solution.

Find the actual JavaScript error first.

4. Check If Custom Theme Code Broke the Button

Have you recently added custom code to your Shopify theme?

If yes, this is an important clue.

Customizations involving:

Product forms
Variant selectors
Cart drawers
AJAX cart
Product options
Quantity selectors
Quick Add
Sticky Add to Cart
Product bundles

can accidentally interfere with the original Shopify functionality.

This is especially common when code is copied from another theme, tutorial, app, or website without being adapted to the current theme.

What to do

Think about what changed immediately before the problem appeared.

For example:

Add to Cart worked yesterday → custom product section added → Add to Cart stopped working.

In that situation, compare the recent changes instead of randomly editing multiple theme files.

If you're working on a live store, duplicate the theme before making major changes.

That gives you a safer environment for troubleshooting.

5. Add to Cart Works but the Cart Drawer Doesn't Update

This is a slightly different problem.

Sometimes the product is actually added to the cart, but the cart drawer doesn't refresh.

For example:

Customer clicks Add to Cart → button shows loading → nothing appears in cart drawer

But after refreshing the page, the product is actually in the cart.

This usually points toward an AJAX/cart drawer problem rather than the basic Add to Cart request.

Possible causes include:

JavaScript errors
Cart drawer script problems
Incorrect AJAX response handling
Custom cart code
App conflicts
Theme customization
Incorrect event handling

How to test it

After clicking Add to Cart:

Open the cart page directly.
Check whether the product was added.
If it is there, the Add to Cart request may be working.
The problem may instead be the cart drawer or cart refresh logic.

This distinction can save a lot of unnecessary debugging.

6. Disable Recently Installed Apps Temporarily

Shopify apps can modify product pages and cart functionality.

For example, an app may add:

Product options
Upsells
Bundles
Subscriptions
Quantity breaks
Sticky Add to Cart
Quick Add buttons
Cart upsells

Sometimes two scripts try to control the same functionality.

The result can be an Add to Cart button that:

Doesn't respond
Adds the wrong variant
Opens the wrong cart
Shows an error
Works only after refreshing
Works on desktop but not mobile

If the issue appeared immediately after installing an app, the app should be investigated before making major theme changes.

A useful test

If possible, temporarily disable the recently added app's theme extension or functionality and test the product page again.

If Add to Cart starts working, you've narrowed down the source of the problem.

7. Check Mobile Separately

Never assume that an Add to Cart button working on desktop means everything is fine.

Shopify stores often use different layouts or JavaScript behavior on mobile.

Test the product page on:

Chrome desktop
Chrome mobile
Safari mobile if possible
Different screen sizes

Look for issues such as:

Button hidden behind another element
Sticky Add to Cart not responding
Variant selector not updating
Touch event problems
Mobile-specific JavaScript errors
Cart drawer not opening
Button covered by another section

Quick test

Open your Shopify store on your phone and try:

Product → Select variant → Add to Cart → Open cart

If desktop works but mobile doesn't, focus your investigation on responsive CSS, mobile-specific JavaScript and theme sections.

8. Check What Changed After a Theme Update

Another common situation is:

"My Add to Cart button was working before I updated my Shopify theme."

Theme updates can introduce new versions of:

Product forms
JavaScript
Cart functionality
Variant selectors
Sections
Theme app extensions

If you've also customized your theme, an update can create compatibility problems between the new theme code and your previous customizations.

What you can do

If you have an older theme version where Add to Cart worked correctly, compare the relevant files.

Look particularly at:

product-form
Product section
Variant picker
Cart drawer
Cart JavaScript
Theme JavaScript

Don't blindly copy old files into the new theme.

The goal is to identify what changed and why it broke.

9. Test the Issue in a Duplicate Theme

This is one of the safest ways to troubleshoot a serious Shopify theme problem.

Instead of experimenting directly on your live theme:

Online Store → Themes → Duplicate

Then reproduce the issue in the duplicate theme.

This is especially useful if:

The store is live
You're not sure which file is causing the problem
Multiple customizations exist
Several apps are installed
The problem affects checkout-related customer journeys
You need to test JavaScript or Liquid changes

You can then investigate the problem without unnecessarily disrupting customers.

How to Find the Real Cause of a Shopify Add to Cart Problem

When troubleshooting, don't immediately replace the Add to Cart button.

Use a simple process:

Step 1: Reproduce the problem

Find out exactly what happens when the customer clicks the button.

Does:

Nothing happen?
A loading spinner appear?
An error appear?
The wrong variant get added?
The cart drawer fail to open?
The product get added but the quantity stay wrong?

Step 2: Check the browser console

Look for JavaScript errors.

Step 3: Check the Network tab

Look at the request triggered when Add to Cart is clicked.

This can help determine whether the request is:

Not being sent
Being sent incorrectly
Returning an error
Successfully adding the product

Step 4: Check the product form

Verify that the correct variant ID is being submitted.

Step 5: Check recent changes

Ask:

What changed before the problem started?

This could be:

Theme update
Custom Liquid
New app
Product options
JavaScript
CSS
Cart customization

Step 6: Test another product

If one product works and another doesn't, the problem may be related to the product or variant configuration.

If every product fails, investigate the theme or JavaScript.

Why Is My Shopify Add to Cart Button Not Working?

The most common causes include:

ProblemPossible CauseButton does nothingJavaScript errorProduct isn't addedProduct form/variant issueWrong product addedIncorrect variant IDCart drawer doesn't updateAJAX/cart JavaScriptWorks on desktop onlyMobile CSS/JavaScriptStopped after app installationApp conflictStopped after theme updateTheme customization conflictWorks on one product onlyVariant/product configurationButton disappearedTheme section/CSS issue

The important thing is to identify which type of failure you're dealing with before changing the code.

When Should You Hire a Shopify Developer?

If you've already checked the basic product and variant settings and the Add to Cart button is still broken, the issue may require theme-code debugging.

You may need a Shopify developer if:

Add to Cart stopped working after custom coding
JavaScript errors appear in the console
The variant selector is broken
AJAX cart isn't updating
The cart drawer doesn't work
An app is conflicting with your theme
The issue happens only on mobile
A theme update broke custom functionality
You have a heavily customized Shopify theme

Instead of rebuilding the whole store, a developer can inspect the affected functionality and identify the actual source of the problem.

Need help troubleshooting a Shopify Add to Cart or theme issue?

Get Shopify bug-fixing help on Fiverr

Final Thoughts

A Shopify Add to Cart button that isn't working doesn't always mean your entire theme is broken.

The problem could be as simple as an unavailable variant or as complex as a JavaScript conflict between your theme and an installed app.

Start by identifying exactly what happens when the button is clicked.

Then check:

Product and variant availability
Product form and variant ID
Browser console errors
Custom theme code
Cart drawer/AJAX functionality
Recently installed apps
Mobile behavior
Recent theme updates
A duplicate theme for safe testing

The most important step is to find the root cause instead of randomly changing theme files.

If you have tried the basic fixes and your Shopify Add to Cart button is still not working, you can get professional Shopify theme troubleshooting and bug-fixing help here:

Fix Shopify bugs, Liquid, JavaScript and theme issues on Fiverr

FAQ

Why is my Shopify Add to Cart button not working?

Common causes include JavaScript errors, incorrect variant IDs, product-form problems, app conflicts, theme customizations, cart drawer issues and mobile-specific problems.

Why does my Shopify Add to Cart button do nothing?

If clicking the button produces no response, check the browser console for JavaScript errors first. A script error can prevent the Add to Cart functionality from executing.

Why does Shopify Add to Cart work on desktop but not mobile?

This can be caused by mobile-specific JavaScript, responsive CSS, sticky Add to Cart functionality, hidden elements or touch-event issues.

Why does Add to Cart work but the cart doesn't update?

The product may be successfully added while the cart drawer or AJAX refresh functionality is failing. Check the cart request and browser console to determine where the failure occurs.

Can a Shopify app break the Add to Cart button?

Yes. Apps that modify product forms, variants, upsells, bundles, subscriptions or cart functionality can conflict with existing theme code.

Can a Shopify theme update break Add to Cart?

Yes, especially when the store contains custom code or modifications that depend on the previous theme structure.

Should I edit my live Shopify theme to fix the problem?

It's safer to duplicate the theme first and test your changes there, especially when you're troubleshooting JavaScript, Liquid or cart functionality.