Before you begin, make sure that you have installed and activated Sastra Addons Pro plugin on your website. Without the Sastra Addons Pro activated, you cannot use this elements.
How to Configure and Style Compare Button #
Compare Button is a user interface element commonly found on e-commerce websites or product catalog pages. It allows users to select multiple products and compare their features, specifications, or prices side by side.
How to Activate Compare Button #
Note: Before getting started, confirm that the ‘WooCommerce‘ Plugin is activated.
To use this Sastra Addons element, find the ‘Compare Button‘ element from the Search option under the ‘ELEMENTS‘ tab. Simply just Drag & Drop the ‘Compare Button’ 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 #
Under the content tab, you will see several options like ‘Settings’ . You can configure these settings to customize the content of your Compare Button.
Settings #
From this section, you can use toggle for display or hide text and icon. Besides, you can change add text and remove text as well.
Click to See Live Demo #
How to Style Compare Button #
To personalize the Compare Button, navigate to the ‘Style’ tab, where you’ll discover the ‘Button’ option.
Button #
From here, you can set button text color, border color, background color and box shadow with hover, remove and normal options. Also you can set icon color, typography, transition duration and padding. Moreover, you can styling to border as well.
Final Outcome #
By following the basic steps and a bit more modifying, you can style your Compare Button as per your preference.
Compare Button is a valuable tool for e-commerce platforms, empowering users to make informed purchasing decisions by easily comparing the features, specifications, and prices of multiple products.
If you face any difficulties, feel free to contact our support team for further assistance.
