Nowadays, using WooCommerce is very common for online stores. In WooCommerce, the Add to Cart button for variable products is added so you can display different variables of the same product.
In addition, checking prices, availability, product images and any other variables you may need is available in the WooCommerce panel. For example, if you have a page showcasing a shirt, you can display available sizes and colors for the shirt.
Enabling the variable products button is very common in WordPress. But often, you enter a site, and the add to cart button is nowhere to be found. However, this issue is very common and fixing it is an easy task.
In this article, we would like to discuss common ways to fix the add to cart button missing in WooCommerce.
How to Fix Add to Cart Button Missing in WooCommerce?
Here are the steps to fix Add to Cart Button missing in WooCommerce:
1. Enter Complete Product Information in WooCommerce
The add to cart button is only visible when you have entered all the necessary information about a product.
Make sure you type information about weight, dimension, product ID, prices and availability. Check the product description carefully and make sure you don’t leave any required field blank. Once the information is completed, the add to cart button will appear.
2. Check WooCommerce Compatibility with Other Plugins
WordPress may face many errors when plugins conflict with each other. You must be using plugins or codes that aren’t compatible with WooCommerce.
In this case, disable all plugins. If the add to cart button reappeared, then you must re-enable your plugins one by one until you find the plugin that’s causing the issue. By deleting the rogue plugin, the add to cart button in WooCommerce will stay visible.
3. Fix Code Related Issues
There is a possibility that the default coding section of WordPress is experiencing issues. By default, if you have chosen one value for different variables of a product, WooCommerce hides the add to cart button for this product and products without a variable.
If you are experiencing this issue, copy and paste the following code in the PHP function:
add_filter('woocommerce_show_variation_price’, function() { return TRUE;});
By doing so, the add to cart button missing in WooCommerce issue should be fixed.
4. Fix Theme Related Issues
Sometimes your theme can cause the add to cart button missing in the WooCommerce issue. Let us discuss a few methods to fix this problem.
Check Configuration Options in Customizer or Theme Settings
Go to Theme Customizer > Content > WooCommerce and Add Button to Cart. Is the option set to visible? If invisible is selected, change it to visible and revisit your website again. The error should be fixed.
Change the Theme’s Code
Some themes are known to cause issues, for example, the Bazar theme is known for causing numerous issues for WordPress. If you reset the theme back to default settings and the add to cart button appears, then the issue is caused by your theme.
Here is how to fix it.
Go to Appearance and Theme Editor. By default, WordPress will send you a message warning you about making any changes, accept it. You should be able to see the following section on the right-hand side of WordPress (Files may be different in each theme):
Look for single.php and index.php files. If you see a single.php file, click on it. Otherwise, click on the index.php file. In both files, scroll down until you see the get_template_part line.
Now, copy the highlighted code in the image above and replace it with the following code:
if ( is_singular( ‘product’ ) ) {
wc_get_template_part( ‘content’, ‘single-product’ );
} else {
//replace this line with yours
}
The final code should look like this:
if ( is_singular( 'product' ) ) {
wc_get_template_part( 'content', 'single-product' );
} else {
wc_get_template_part( 'content', 'single-product' );
}
Finally, save the file and return to the product page and check if the add to cart button is back.
Restore to Previous Theme Versions or Update it
Using the older version of the theme or changing the theme completely could fix the add to cart button missing in the WooCommerce issue.
5. Server-Side Issues (mod_security)
Another issue that indirectly causes this issue is the inability to read the jQuery code. This happens when your web server’s mod_security has expired and uses the old rules.
To check this case, from go to your browsers developer’s tool (For example, Chrome Developer’s tool) and see if the JS error appears or not: “.jQuery.cookie.min.js is not found”
If you see the error above, contact your hosting provider immediately.
Conclusion
As you probably know by now, fixing the missing add to cart button in WooCommerce is very simple. However, after fixing this page, the product page may look a bit different. In this case, by doing some changes to the page, you can customize it.
We hope that this article helped you fix the add to cart button missing in the WooCommerce issue.