How to Configure and Style Mini Compare #

Mini Compare is a streamlined tool for quick product comparisons, offering a concise overview of key features and pricing. Its minimalist design facilitates efficient decision-making without overwhelming users with excessive information.

How To Set Up Compare Page #

Before getting started, confirm that the WooCommerce and Sastra Addons PRO Plugin is activated.

To use Compare Page, you will need to replace the default Compare page with another page of yours. If you want, you can even create a new page and assign it as Compare page.

Afterward, navigate to Sastra Addons from your WordPress Dashboard and click on the ‘Integrations’ tab on the top. From here, you can assign your desired page as your Compare page.

Simply click on the ‘Select Compare Page’ option and pick any of the pages from the drop-down menu as your Compare page. You will be all set to go and hit the ‘Save Changes’ button from the bottom.

How to Activate Mini Compare #

To use this Sastra Addons element, find the ‘Mini Compare‘ element from the Search option under the ‘ELEMENTS‘ tab. Simply just Drag & Drop the ‘Mini Compare’ 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 Mini Compare, simply click on the ‘Content’ tab.

Settings #

From Settings section, you can use toggle for enable or disable show text and open in new tab. Than you can set compare text and alignment.

Moreover, you can use the drop-down to select one of these as your wishlist content: None & Pop-up Selection.

Click to See Live Demo #

How to Style Mini Compare #

To customize Mini Compare, click on the ‘Style’ tab, and you will find ‘Compare  Button’ option here.

Compare Button #

From here, you can set compare button icon color, text color, typography, background color, border color, padding, item count color, item count background color and border radius. Besides, you can styling to border.

Additionally, you have the option to utilize a slider bar to adjust the size of icons, the spacing of text, the size of item counts, the size of count boxes, and the position of item counts, all of which are supported across all devices.

Compare Content #

From here, you can set loader color, close icon color, size and distance, Heading color, typography, background color, border color, overlay color, scrollbar color, height, width, spacing and many more. Besides, you can styling to border.

Final Outcome #

By following the basic steps and a bit more modifying, you can style your Mini Compare as per your preference.

Mini Compare provides a concise overview of essential product details, facilitating quick and efficient comparison between multiple items.

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