Some images displaying skewed on More Info pages, not all

[thunsinger]

We are using three image sizes- original, 30% and 15%. On the more info pages, the size should be 30% and this is the case for most products. We are finding some (http://www.webundies.com/ude08l3m.htm) that looked squashed. They appear fine in all other displays- the category page (http://www.webundies.com/mens_lounge_americana.html) and search results. Any idea on why this is happening only on certain products? We have tried to manually resize, aswell as re-upload, but the issue does not resolve this way.

[Jim]

Because you are squishing an image that is 150 px wide and 289 px tall into a box that is 240 px wide and 240 px tall.

In order to get it to look properly you should either resize your main image, resize the display box size or use a different images size for the moreinfo image.

[thunsinger]

Jim, Thanks. All of our images, site wide are 1001 pixels wide. For that very reason, we have 2 other sizes- the moreinfo page is set to use the 30% setting (we use this on all moreinfo pages). What I am struggling with is why it appears this way on only a handful of pages. All have images that start at 1001 pixels wide and are set to use a resized image of 30% of the original. The box should not be a square- the aspect ratio is being lost somehow. But only on a few? Odd.

Because you are squishing an image that is 150 px wide and 289 px tall into a box that is 240 px wide and 240 px tall.

In order to get it to look properly you should either resize your main image, resize the display box size or use a different images size for the moreinfo image.

[Jim]

Ok, Go to Images, Configure and tell us what you have for the image settings
Image Layout Defaults checkbox If needed, reduce image on upload to: and max width and max height
Resized Image 1: Referenced as:, %, max width, max height
Resized Image 2 Referenced as:, %, max width, max height
Resized Image 3: Referenced as:, %, max width, max height

Go to Prefernces > More Info Pages
What do you have for
Number of Images in a row
Use Image box size Width px Height px
Image popup Width px Height px
Image popup size

Next go to the particular product that has the problem Products > Edit Product Layout.
What do you have for
Product Image:
Product Image Size:

More Info Page Image:
More Info Page Image Size:

(More Information Image 1):
(More Information Image 2):
(More Information Image 3):
More Info Extra Image Size:

Now go to Products > Edit Product Layout
What template is assigned to the product?

Now go to Pages > Edit Pay Layout for each page the product is assigned to and see what the template for that page is.

Now go to Merchandising > Custom Templates > Pages and look at each page template the is referenced in the above question and look at the [-- Loop Products --] section for the [-- PRODUCT ... --] tag. Is there a template name where the ... is in the tag? If so what is that product template name for each case?

If the product template assigned in the [-- PRODUCT ... --] tag of the various page template is not the same you can expect different results for the More info page depending on which page is being generated first during a publish.

[thunsinger]

Wow, Jim. I am bowled over by your logical mastery of this! Looks like you found the key to the issue. Will have the designer make the change and see what happens.

Ok, Go to Images, Configure and tell us what you have for the image settings
Image Layout Defaults checkbox If needed, reduce image on upload to: and max width and max height- not selected
Resized Image 1: Referenced as:, %, max width, max height not used
Resized Image 2 Referenced as:, %, max width, max height 30%
Resized Image 3: Referenced as:, %, max width, max height 15%

Go to Prefernces > More Info Pages
What do you have for
Number of Images in a row 5
Use Image box size Width px Height px not checked (set to 300 x 300)
Image popup Width px Height px 300 x 300
Image popup size Original

Next go to the particular product that has the problem Products > Edit Product Layout.
What do you have for
Product Image: products/ude08l3m.jpg
Product Image Size: productoverview (15%)

More Info Page Image: products/ude08l3m.jpg
More Info Page Image Size: longlean (30%)

(More Information Image 1): products/ude08l3m.jpg
(More Information Image 2): products/ude08l3m.jpg
(More Information Image 3): products/ude08l3mr.jpg- also squashed
More Info Extra Image Size: Original

Now go to Products > Edit Product Layout
What template is assigned to the product? SleekProductTemplate.sst

Now go to Pages > Edit Pay Layout for each page the product is assigned to and see what the template for that page is. http://www.webundies.com/mens_lounge_americana.html, webundies-subcategory-overview-product.html

Now go to Merchandising > Custom Templates > Pages and look at each page template the is referenced in the above question and look at the [-- Loop Products --] section for the [-- PRODUCT ... --] tag. Is there a template name where the ... is in the tag? If so what is that product template name for each case? webundies-page-overview-product.html

If the product template assigned in the [-- PRODUCT ... --] tag of the various page template is not the same you can expect different results for the More info page depending on which page is being generated first during a publish.