Product Images

This chapter is a walkthrough on how to prepare product images
and link them to the products in your products catalog. The entire
process of preparing product images consists of the following
steps:

Step 1: Prepare product images.Step 2: Give the correct names to the product
images.Step 3: Put the images to the Web server in the
correct directory.Step 4: Link the images to the products by running
the 'Image link' task.Step 5: Check that the product images are shown in
the webshop.

To prepare product images and link them to your products
catalog:

Step 1: Prepare product images which will be
used in your products catalog. You should create one image for each
product and product variant. All images should have a size not less
than: width - 432 px and height - 432 px.

Step 2: Give the correct names to the images.
The image name format should be exactly as described below:

This is a required value and should match the item number used
in Microsoft Dynamics NAV/AX.

Separator

This a character which is used to separate the
product image name values in the image file name. Default value:
'_'

Variant Code

This is an optional value and should be specified
for product variant images if such are present. If this is an image
for a product variant, in the image file name you should also
specify the item variant code used in Microsoft Dynamics
NAV/AX.
In Microsoft Dynamics NAV item variant code can be seen in the
'Item Variants' table.
If you use NAV Connector with the Fashion add-on, the item variant
code must match the vertical item variant code in Microsoft
Dynamics NAV.
In Microsoft Dynamics AX product variant ID cannot be seen directly
in the AX table but only in the system table in the Application
Object Tree. For more information on where the product variants IDs
are stored in AX, see 'Product
Variants IDs'.

Order number

This is a required value which is used to add
multiple images to the product. When you need to add only one image
you should still use '1' as an order number in the product image
name. If more images should be added the second image should have
the order number '2', and so on.

Extension

This is the extension of a product image file. Supported
extensions are: JPG, JPEG and GIF.

Step 3: When the images (not less than 432 x
432) per product and product variant are ready with the correct
file names, they should be put to the Web server. All product
images should be put to the following location of the Sana Commerce
frontend directory:

/content/files/images/ProductImages

Step 4: Now you should run the 'Image link'
task to resize the images and link them to the products. In the
Sana Commerce backoffice click on 'Tools -> Scheduled tasks' and
run the 'Image link' task.

When the 'Image link' task is finished you should see the
product images in your webshop.

Step 5: Open the webshop and check that the
product images are shown. The product images should be also shown
in the Sana Commerce backoffice product
descriptions.

Now the product images are linked to the products catalog and
should be available in your webshop.

Below you can read more detailed information about the image
link process and conversions which happen with the product images
when the 'Image link' task is running.

When you run the 'Image link' task, in the Sana Commerce
frontend directory (/content/files/images/ProductImages/), where
you put the product images, three more folders are automatically
created: 'Small', 'Medium' and 'Large'. The 'Image link' task
automatically resizes all your product images from the
'PruductImages' folder and put them according to the size to the
'Small', 'Medium' and 'Large' folders. This is done because product
images of three different sizes are used in the Sana Commerce
webshop:

Small images are shown in the image carousel
on the product details pages and on all other pages where the
product thumbnails are present.

Medium images are shown on the product details
pages.

Large images are shown when you click on the
'Large image' link on the product details page.

The product images are automatically resized to the sizes which
do not exceed:

Width

Height

Small

64 px

64 px

Medium

278 px

278 px

Large

432 px

432 px

Therefore, when you prepare the product images you should create
only one image of a large size (can be any size not less than 432 x
432) for every single product and product variant and put them to
the 'ProductImages' folder. When you run the 'Image link' task the
product images are retrieved from the 'ProductImages' folder,
resized and distributed according to their sizes among three
folders. When the images are resized and placed to the appropriate
folders according to their sizes, the images in the 'ProductImages'
folder are automatically deleted, if the 'Image link' task has been
successfully finished.

If you need to change already existing product image, you should
put the new image with the correct product image file name to the
'ProductImages' folder and run the 'Image link' task. The image
will be resized and replace the appropriate image with the same
name in the 'Small', 'Medium' and 'Large' folders.

If you redesign your webshop the default image sizes can be
redefined or if needed you can add other image sizes. This can be
done in the 'web.config' files of the Sana Commerce frontend and
backoffice. In the 'web.config' files locate the
<image-sizes> section and add a line in the following format,
where you should specify the image size name (small/ medium/ large
or any new), width and height of the images:

Product Versions

Links

Sana Commerce does not accept any liability for the content of this website, or for the consequences of any actions taken on the basis of the information provided. The information below should be interpreted as an example. No rights can be derived from this information.
Sana Commerce – the integrated e-Commerce solution for Microsoft Dynamics NAV & AX