top of page

Designing your store

Wix Stores: Setting How Store Images Are Displayed

Displaying great product images is one of the most important keys to e-Commerce success.

How images look in your store depends on the images you upload (the resolution, aspect ratio, etc.) and how you set image to be displayed in your store.

This article will walk you through the image resizing and ratio options available in your editor.

In this article, learn more about:

Understanding image resizing

Where images are displayed, you'll see two resizing options: Crop and Fit.

Crop

Images are cropped so that they are all the same size. If you upload images in different sizes and with different aspect ratios, part of the image may be cut off.

Screenshot showing images displayed in a Wix Store with the crop image setting

Fit

If you select the fit option, the entire image is displayed and keeps it's original aspect ratio. Images in your gallery will not have the same aspect ratio unless the original images had them.

Screenshot showing images displayed in a Wix Store with the fit image setting

Tip:

To create a Product Gallery with a clean look featuring same-size images, and to avoid any images being cut off, we recommend uploading images with the same aspect ratio when creating your products.

Understanding image ratio

Image ratio, also known as aspect ratio, is how wide an image is in relation to how tall it is. When selecting a setting, take into consideration the layout you choose for the Product Page, Category Page, or Product Gallery.

For example, the classic layout in the Product Page supports all image ratios. Other layouts look best with wider images.

Tip:

For viewing on a mobile device, the recommended image ratio is 1:1 (a square picture).

Selecting image settings in a Product Gallery

  1. Go to the relevant Product Gallery in the editor.

  2. Click the Product Gallery.

  3. Click the Settings icon .

  4. Click the Layout tab.

  5. Select an image ratio.

  6. Choose an option under How's image resized?:Crop: Images are cropped to the same size.
    Fit: Displays the entire image.

Selecting image settings in the Product Page

Make sure your images look great in the Product Page by selecting settings that work with your image's aspect ratios.

Wix Editor

Studio Editor

  1. Go to your editor.

  2. Go to your Product page:Click Pages & Menu  on the left side of the editor.
    Click Store Pages.
    Click Product Page.

  3. Click the Product Page element on your page.

  4. Click Settings.

  5. Click the Layout tab.

  6. Choose an option from the Image ratio drop-down.

  7. Choose an option under How's image resized?:Crop: Images are cropped to the same size.
    Fit: Displays the entire image.

Need A Professional Website?
Contact Us 
Today!

Wix Forms: Troubleshooting

Wix Forms: Removing a Form from Your Site

Wix Forms: Saving Your Form Data to Your Contacts

Wix Forms: Creating Automated Email Responses for Form Submissions

Wix Forms: Choosing Who Gets Notified About Form Submissions

Wix Forms: Viewing and Managing a Submissions Table

Wix Forms: Customizing the Success Message and Thank You Page of Site Forms

Wix Forms: Designing Your Site Forms

Wix Forms: Adding a Signature Field

Wix Forms: Protecting Your Site Forms from Spam

Wix Forms: Adding a Subscriber Opt-In Checkbox to a Site Form

Wix Forms: Adding a File Upload Field

Wix Forms: Managing Your Form Fields

Wix Forms: Managing Your Standalone Form Fields

Wix Forms: Translating Your Forms with Wix Multilingual

Wix Forms: Adding and Setting Up a Standalone Form

Wix Forms: Adding and Setting Up a Form on Your Site

Wix Forms: An Overview

Wix Functions: Creating a Custom Loyalty Program Reward

Wix Functions: Adding Custom Validations to Your Forms

Wix Functions: Adding Additional Fees at Checkout

Wix Functions: Creating a Function

Wix Automations: Understanding Conditions Operators

Wix Automations: Using the Run Velo Code Action

Wix Automations: Troubleshooting Wix Automations

Wix Automations: Creating a Multi-Action Automation

Wix Automations: Sending Data via Webhook

Using Zapier to Automate Connections with Third-Party Apps

Wix Automations: Sending Data to Google Sheets

Wix Automations: Managing Your Automations

wix experts
Graphic2Traffic web design
©
bottom of page