If you have an online store it is essential to pay constant attention to the experience of your customers, making sure that they can easily find and buy your products, and that there are not too many steps to complete the entire checkout process.
Divi and WooCommerce
The WooCommerce online store plugin integrates perfectly with the Divi theme, as not only can you create cool and attractive product designs with Divi, you can also use various WooCommerce modules included in the layout to showcase your products in the best possible way in your store.
Of course, one of the most popular Divi modules is the Shop module, as by simply adding it wherever you want (page, post, etc.) you can turn any section of your site into a sales section.
The problem
But if there is something that I have always missed in the Divi store module is to show an add to cart button, because by default it only shows the product image, its name and price.
Since there is no button to quickly add the product to the cart, if the customer wants to make the purchase now, it forces him to go through the product page first.
The solution
Wouldn’t it be a good idea to save your customers this extra step? By offering in the Divi store module a button to quickly add to cart your products.
With a simple but powerful trick, we are going to add the add to cart button automatically to all products in the Divi store module.
Well you just have to add a simple line of code at the end of the functions.php file of the Divi child theme, this one:
/* Add to cart button in Divi Shop module */
add_action('woocommerce_after_shop_loop_item_title', 'woocommerce_template_loop_add_to_cart', 10);Code language: JavaScript (javascript)Save the changes and you will have a much more practical Divi shop modules, which will improve your sales and make easier the shopping experience for your customers.
Now each product in the Divi store modules will show a button to add it to the cart if it is a simple product, to select options if it is a variable product, or to go to the affiliate site if it is an external product.
Read this post in Spanish: Cómo añadir un botón de «Añadir al carrito» al módulo de tienda de Divi
