For more details see the Color Swatches Pro extension page.
Add more options to your Color Swatches functionality. Display prices of simple products together with corresponding swatches. Let customers copy and share URLs to specific product configurations. Automatically reload information of selected simple items to make the whole shopping process fast and clear.
The module perfectly works with the Out of Stock Notification extension and lets customers subscribe to out-of-stock items to be timely informed when their favorite products come back to your store.
To get the access to the Color Swatches Pro settings please go to: Stores → Configuration → Color Swatches Pro
Enable Module - Set this option to 'Yes' to activate the extension.
Enable Using Share Link - The option lets customers copy and share URLs with selected product configurations.
Display Price of Simple Products in Swatch Title - Enable this option to show prices of simple products below corresponding swatches right on a parent item page.
Display Price of Simple Products in Drop-downs - Enable this option to show prices of simple products in the drop-down, next to the product. Furthermore, the feature allows to hide the price, and to show the price difference.
Show Selected Option Swatch in Cart and Checkout - Enable the feature to display relevant product options' swatches.
Change Main Product Image on Mouse Hover - Enable the feature to allow your customers see changes right on the product image, when they hover over the product options' swatches.
Enable Subscription to Out of Stock Products - The option works only if you have the Out of Stock Notification extension installed. It lets customers subscribe to out of stock options of a configurable product to get notified once the product comes back to stock.
Show Out of Stock Configurable Attributes - The feature crosses out swatches of the simple products, which are out of stock.
Enable Zoom - Enable Zoom, Lightbox, and Carousel functionality all together. Select No to switch to the default settings.
Enable Product Image Flipper - Set to Yes to activate the flipper image effect on the catalog pages.
Preselect for All Configurable Products - Choose either The First Options (the extension displays the first option of a configurable item) or The Cheapest One (the extension displays the cheapest option of a configurable product) to display after the customers navigate to a product page.
Zoom Type - Select the preferred type of zoom you want to use on your online store.
Zoom Window Position - Select the proper position for the window with zoomed fragment
Offset - Set a needed frame size in pixels
Zoom Window - Set a needed window size in pixels
Tint Color - You can additionaly overshadow the main picture to highlight the zoomed fragment. Set the tint color you prefer: red, black, green, etc.
Enable Lightbox - Select Yes to enable the lighbox effect when opening full-size images.
Enable Thumbnail Lightbox - Set to Yes to activate the lightbox after click on the thumbnails.
Endless Lightbox - If set to Yes, the images will be looped and can be switched non-stop.
Enable Carousel - Set Yes to enable the carousel functionality and display product thumbnails in the slider
Main Image Change - Specify how the main product image can be changed: either with click, or hover.
Carousel Position - Specify where to display the carousel: either under the main image, or to the left of the main image.
Qty of Visible Items - Choose how many items should be visible in the carousel at the same time. If the amount is below the specified, the carousel will not be displayed.
Reload Product Information - Select page elements that should be automatically reloaded when a customer selects specific product configuration.
DOM-Selectors Settings - In case all page elements reload correctly, you don't need to chage these settings. If one of the blocks chosen in the ‘Reload Product Information’ option doesn’t reload properly, please specify your own data it.
To create and edit Group Attributes go to Admin Panel → Stores → Color Swatches Pro → Manage Group Attributes.
To create a new group of attributes, click Add New Group button. To edit or delete existing groups, click Select button in the Action column. Choose Edit or Delete from the drop-down.
Attribute Options - After you title and enable a group, check necessary options in the boxes.
To limit the number of visible product swatches on the category page, go to Admin Panel → Stores → Configuration → Catalog → Catalog → Storefront → Swatches per Product.
Uncheck the Use System Values box, to input the necessary number.