Different Collection Image Sizes

Shopify Discussion
1

Hi,

I have multiple collections on my webshop. 2 of them i have the portrait image size enabled 2:3 but for my 3rd collection i want an different image size 4:3. If i change this in the theme settings, it changes it for every picture i have. How can i have multiple different images sizes.

Thanks

2

Hi @Bahrikaan

I see exactly what you’re trying to do—you want different aspect ratios for different collections, but Shopify’s theme settings apply changes globally. This is a common limitation, but there are a few ways to work around it. Let’s go through your options:

1. Use Custom CSS for Collection-Specific Image Sizes

Shopify doesn’t allow different image aspect ratios per collection by default, but you can manually override this using CSS.

  • First, assign a unique class to each collection’s container by editing your theme.liquid or collection template.
  • Then, add custom CSS to specify different image ratios for each collection.

Example CSS:

.collection-1 img {

aspect-ratio: 2 / 3;

object-fit: cover;

}

.collection-2 img {

aspect-ratio: 4 / 3;

object-fit: cover;

}

You’ll need to assign the correct class to each collection manually in the theme.liquid file or via Shopify’s customizer.

2. Use Separate Templates for Different Collections

If your theme allows custom templates, you can create separate collection templates with different image settings.

  • Go to Online Store > Themes > Customize.
  • Click Collections > Create Template.
  • Name it something like collection-4-3.
  • Adjust the image ratio in the settings.
  • Assign this template to the specific collection.

This method is cleaner if your theme supports multiple templates.

3. Manually Resize and Upload Images

If the above methods don’t work, you can manually crop and upload images in the aspect ratio you want. Shopify will display them as uploaded if there are no forced constraints in your theme.

4. Check for Theme-Specific Options

Some premium themes have per-collection image settings. If you’re using a third-party theme, check the documentation or contact the developer—they might already have a built-in solution.

If you need any other assistance, I am willing to help.
Best regards,
Daisy.