Home » Addons » Documentation » Product images

Product images

Shoptet saves the product images in their original size and then prepares several sizes for standardized usage (called image cuts). These cuts are created in advance and saved on the disk, so they are readily available. The list of cuts is the same for each e-shop, and each e-shop can theoretically have different cut sizes. In practice, their size is given by the template and most templates use the same sizes. The list of provided cuts is given by
the Image cuts code list.

The /api/eshop?include=imageCuts Eshop info endpoint returns the imageCuts field in the response, where each cut has the actual
size defined, and the URL base path. There are two base URLs (example for classic.shoptet.cz, cut detail):

Use the urlPath in case you need an up-to-date image right now, you use the url for your backend processing and you will retrive the images only once. Images retrieved via urlPath are not cached. You can use image name or SEO version of the image name – see below.

Use the cdnPath in case you want to use the image url on the frontend and users of your application will display it, e. g. if you provide an alternative frontend, mobile application etc. The images are cached and provided with lower latency. Use cdnName retrieved from the product detail endpoint (or similar) – see below.

Once you determine the URL based on the purpose and image cut size (for example detail for product detail, or related for product preview), just append the filename you need. The filename can be retrieved from Product detail endpoint.

The product detail endpoint /api/products/{guid}?include=images returns the image field data.images[] in the same sequence, as these are entered in administration. The file name name (for example 100.jpg) needs to be connected to the URL cut and then you have complete path to the image of a given cut (size), for example https://classic.shoptet.cz/user/shop/detail/100.jpg. You can also use seoName, which also contains a description of the image – you will be redirected to the same image. The cdnName is intended for use with the cdnUrl only.
The fields look like: (excerpt)

    "name": "106.png",
    "description": "shamrock 2115611 640",
    "seoName": "106_shamrock-2115611-640.png",
    "cdnName": "106_shamrock-2115611-640.png?5b2a41f5"

So valid scenarios are:

The cdnName contains change time encoded. Whenever the images is replaced (manually in administration or by an import), a new change time is assigned and the cdnName gets changed.

One of the images mentioned for the product can be selected as the default image for the product variant. The selected image is in data.variants[].image item and contains the name of the image – this can be searched for in the image list, in the name item. Should the variant have no preselected default image, the parameter image is null.

The item data.items[].mainImage contains the main image in order detail – this is either a default variant image,
or, if not set (or product does not have variants), the default product image is given. The structure is the same as in product details, but not all images are given here, only the default one – representative image. The full path can be gained by assembling the urlPath from the e-shop info and the name or seoName items, given for the order item.

Similarly, the product list gives data.products[].mainImage, which mentions the initial image for each product.