Zyro templates are responsive, meaning that images will stretch or shrink depending on the screen size and resolution the website is viewed on. Zyro builder also automatically compresses all the images in order for the website to load fast.

This means that there is no one set of dimensions for perfect image size. Even though there is no optimal image size for image elements nor for section background images, you can try resizing image elements or changing section height.

You can also edit (e.g. resize or crop) the picture outside the Zyro website builder and then re-upload it.

Product images

You can upload as many images per product. It is also possible to embed images (and videos) into product descriptions. You can set the image size and orientation of product thumbnails in your store in the Store manager > Design. There are several preset design options available to choose from.

You can upload product images of any size up to 20 MB. If you add large product images, they are automatically compressed, so your products load fast and fit well on both desktop and mobile. We recommend using JPG, PNG, and GIF images for your product images.

Product images look best when they appear to be the same size: use a consistent aspect ratio (height-to-width ratio) and orientation for all the product images that you add to a product gallery. This way images display better side by side because they all display the same size.

difference of the images in the gallery

Show the various perspectives of the product (the front, side, underneath, close-up, etc.) so customers can see what they are buying in detail. You can showcase your product in motion using GIFs or adding a 360° product view with the Imajize app - find it in Store manager > Apps > App Market.

When you add multiple images to a product, the first uploaded image is considered the main product image. It will be shown as a product thumbnail on a category page and as the first image on the product page. To change the main image, drag a different image to the first place. You can also sort the other images by dragging them.

Specific parameters

For best performance, we recommend using the following specifications for your website's visuals:

  • The recommended aspect ratio for a blog post cover image is 5:3.

  • The recommended link preview image size is 1200 x 630 px. The minimum is 600 x 315 px, thus if your image is smaller than that, it will still display in the link page post, but the size will be much smaller.

  • The recommended favicon size is 16 x 16 or 32 x 32 px.

  • It is recommended to upload a logo in .png or .svg formats, as logos are usually transparent.

  • An image may fail to get uploaded if its extension is in the capital letters: for example, use .jpg instead of .JPG

Additional resources

Did this answer your question?