Color Swatches Pro by Amasty. User Guide

1
Color Swatches Pro
Magento Extension User Guide Official extension
page Color Swatches Pro
User Guide Color Swatches Pro
Page 1
Support http//amasty.com/support.html
2
Table of contents
1. How to upload images for attributes
.... 3 2. General settings
......... 4 3. Category
Grid Settings... 7 4.
Zoomer For Main Image Setting..
8 5. Zoomer for Thumbnails and Outside zoomer
settings. 9 6. Lightbox Settings
. 10 7. Carousel for
thumbnails. 11 8. Use Price
of simple Products.. 12 9.
Images of associated product for
swatches.... 13 10. Front end examples
..... 14 11. Selection of
configurable products on category .. 18
User Guide Color Swatches Pro
Page 2
Support http//amasty.com/support.html
3
1. How to upload images for attributes
Tick this checkbox before pressing Update
Images button to enable image-based selection of
options of this attribute for configurable
products.
Please press Update Images button once you have
chosen the images (otherwise they will not get
uploaded).
After you install the extension, a new tab called
Attribute Images will appear for attributes
that are used for creation of configurable
products. At this tab you can upload an image for
each attribute option.
User Guide Color Swatches Pro
Page 3
Support http//amasty.com/support.html
4
2. General settings
You can find the extension settings in admin
panel -gt System -gt Configuration -gt Color
Swatches Pro.
If you would like to use only images for
selection of configurable product options, set
Hide Configuration Drop-Downs option to Yes.
By switching on this feature, you will not need
to manually specify price difference for each
option of configurable product, the prices will
be automatically taken from simple products.
With Reload Product Images set to Yes,
default images of configurable products will be
replaced with the images of the particular simple
product configured by a customer.
User Guide Color Swatches Pro
Page 4
Support http//amasty.com/support.html
5
2. General settings
If Reload Product Name is set to Yes, product
name will be replaced with the name of simple
product chosen by customer.
By default the extension displays Reset
Configuration link on front end for each
configurable product. By clicking it, a customer
can reset his attribute selections. If you would
like to disable this feature, turn this setting
to No.
User Guide Color Swatches Pro
Page 5
Support http//amasty.com/support.html
6
2. General settings
If set to Yes, attribute value tooltip will be
shown on product page on mouse over.
To display or hide attribute titles under
swatches on product page, set the option to Yes
or No, respectively.
If set to Yes, the extension will automatically
select values for attributes which have only one
option available.
User Guide Color Swatches Pro
Page 6
Support http//amasty.com/support.html
7
3. Category Grid Setting
Set this option to Yes to show color swatches
and enable customers to select them on category
pages and search results.
If you would like to display or hide attribute
value tooltips on product list pages, set the
option to Yes or No, respectively.
User Guide Color Swatches Pro
Page 7
Support http//amasty.com/support.html
8
4. Zoomer For Main Image Setting
If Enable Zoom feature option is set to
Yes, zoom effect will be activated for product
images on front end.
There are two types of zoom available Outside
and Inside. With outside zoom the zoomed product
image will be shown is a separate window. Inside
Zoom will display zoomed elements of product
images right within the main product image window.
User Guide Color Swatches Pro
Page 8
Support http//amasty.com/support.html
9
5. Zoomer for Thumbnails and Outside zoomer
settings
This option enables zoom effect for thumbnails of
product images.
It is possible to change Zoom Window Position for
Outside zoom. There are 2 options available to
the left or to the right of the main image window.
It is possible to show product name at the top of
the Outside zoom window.
User Guide Color Swatches Pro
Page 9
Support http//amasty.com/support.html
10
6. Lightbox Settings
Set Enable Lightbox feature option to Yes
for customers to be able to open full-size images
with lightbox effect.
With circular lightbox, customers can view
product images in non-stop circle.
If set to Yes thumbnail helper will appear in
lightbox. The helper shows thumbnails of all
available product images.
User Guide Color Swatches Pro
Page 10
Support http//amasty.com/support.html
11
7. Carousel for thumbnails
Set Enable Carousel feature option to Yes
for customers to view product thumbnails in an
attractive carousel.
Choose how many items should be visible in the
carousel at a time.
This feature will activate circular carousel, it
means customers will be able to endlessly rotate
product thumbnails in the carousel.
Choose between 2 available carousel placement
positions. This option doesnt influence location
of thumbnails helper in lightbox window.
User Guide Color Swatches Pro
Page 11
Support http//amasty.com/support.html
12
8. Use Price of simple Products
To enable usage of simple product prices for a
configurable product please go to Catalog-gtManage
Products an open the configurable product for
which you would like to enable this feature.
At the general tab you will find Use price of
simple products setting. Switch it to Yes to
use prices of simple products instead of price
difference for the configurable product.
User Guide Color Swatches Pro
Page 12
Support http//amasty.com/support.html
13
9. Images of associated products for swatches
The extension allows to use images of associated
products for swatches of one attribute. E.g. you
can use the images for attribute color. For this
please go to edit a configurable product and open
Associated Products tab.
Tick Use image from product next to the
attribute for which you would like to use the
images of simple products as swatches.
User Guide Color Swatches Pro
Page 13
Support http//amasty.com/support.html
14
10. Front end examples
Heres an example of extension usage. These are
two screenshots of the same product. The
extension enables you to show images and
descriptions of the simple products configured by
customers.
Dropdown fields can be used for selection either
together with images of can be disabled.
By default image selections are highlighted by
yellow frame, you can modify the frame look by
editing the following css file skin\frontend\defa
ult\default\css\amasty\amconf.css
User Guide Color Swatches Pro
Page 14
Support http//amasty.com/support.html
15
10. Front end examples
Product title
Outside zoom
Tint effect is ON
Thumbnails carousel with one visible item.
Inside zoom
User Guide Color Swatches Pro
Page 15
Support http//amasty.com/support.html
16
10. Front end examples
Attribute tooltip on product page
The tooltip on a product list page
User Guide Color Swatches Pro
Page 16
Support http//amasty.com/support.html
17
10. Front end examples
Lightbox
Navigation Next button
Navigation Previous button
Thumbnail helper
User Guide Color Swatches Pro
Page 17
Support http//amasty.com/support.html
18
11. Selection of configurable products on
category page
You can let customers select options and add
configurable products to cart right from the
category pages.
User Guide Color Swatches Pro
Page 18
Support http//amasty.com/support.html
19
Thank you!
Should you have any questions or feature
suggestions, please contact us at
http//amasty.com/support.html
Your feedback is absolutely welcome!
User Guide Color Swatches Pro
Page 19
Support http//amasty.com/support.html