How to Configure and Style Product Add to Cart #

Product Add to Cart usually includes the prominent button or icon to add the item to the shopping cart. This widget streamlines the purchasing process for users, allowing them to quickly select items for purchase without navigating away from the current page.

How to Activate Product Add to Cart #

To use this Sastra Addons element, find the ‘Product Add to Cart‘ element from the Search option under the ‘ELEMENTS‘ tab. Simply just Drag & Drop the ‘Product Add to Cart’ into the ‘Drag widget here‘ or the ‘+’ section.

After you are successfully done with this step, this is how the element is going to look like.

How to Configure the Content Settings #

To configure the content of your Product Add to Cart, simply click on the ‘Content’ tab.

General #

From General section, you can set button text, quantity text. You can use toggle for enable/disable AJAX add to cart. Than you can change layout, text align, button horizontal align. You can use drop-down for option display type, button display type and quantity input style.

Moreover, you can set button icon as your preference and icon spacing as well.

How to Style Product Add to Cart #

To customize Product Add to Cart, click on the ‘Style’ tab, and you will find many different options here.

Add to Cart Quantity Label #

From here, you can set color, background color with hovered and normal options. You can change typography, border color, transition duration and margin.

Moreover, you can styling to border and border radius as well.

Others #

From the ‘Add to Cart Quantity’ settings, you can styling to quantity, trigger icons, plus icons, minus icons and many more . On the other hand, customize your ‘Add to Cart Button’, ‘Grouped Product’, ‘Variable Product’, ‘Variations Select’ and ‘Variations Item Info’ from these settings.

Besides, you can also customize your ‘Reset Options Button’ from these settings.

If you face any difficulties, feel free to contact our support team for further assistance.