'tall' portfolio thumbnail coming up short

[aimeandalex]

I have a multi-size masonry portfolio element on my homepage. The ‘tall’ thumbnail is appearing shorter than the ‘wide & tall’ thumbnail next to it.

It’s cropped to the correct size as taken from this page: http://swiftideas.com/documentation/2014/06/21/content-image-sizes/

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

Hi,

The width and height are relative= to each other so the initially uploaded image has to be large enough to be able to reduced down proportionally.

Please test increasing proportionally the dimensions of the tall photo and upload a new one to test.

[aimeandalex]

The uploaded image is more than double the size of how it’s appearing and it’s the size the documentation states. Can you update the documentation if this isn’t correct?

What size should the image be? I don’t want to keep recropping all day until I happen to find the right size.

[David Martin – Support]

Hi,

Can you send me a dropbox link of the image before you uploaded to WP so I can test this?

Thanks.

[aimeandalex]

Hey David, I don’t have the original as I trashed after it was uploaded. The file in the media gallery is definitely correct.

[David Martin – Support]

Hi,

I have adjusted the image size which has improved the layout.

You can add this CSS to Theme Options => Custom CSS to add a px perfect layout:

.portfolio-wrap .multi-masonry-items .portfolio-item figure img {
    max-height: 450px;
}

[aimeandalex]

Hi David, this looks fine when the browser window is full size but the ratio doesn’t maintain at different window sizes. See attachments.

Edit: I’ve also just spotted that all of the thumbnails look horrendous at tablet level, I’ve attached a screenshot for this too.

Attachments:

You must be logged in to view attached files.

[aimeandalex]

Hey David, sorry I couldn’t edit my reply a second time so had to add another reply. I’ve added another portfolio item and now one of the thumbnails that was previously ok is distorted (see screenshot). It seems that whatever image is in that top right spot breaks.

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

The image is not big enough to be scaled up to the size you select. At a minimum it should be 1040*1040 for that space.

Regarding the layout on Tablet, have you considered removing the text for smaller screens? You can set three rows, one for each specific screensize.

Thanks.

[aimeandalex]

Hi David, again, that image is cropped to the size it says on this page:

http://swiftideas.com/documentation/2014/06/21/content-image-sizes/

Could someone update this page as it’s clearly wrong, even though it’s quoted in numerous support tickets.

I don’t really care about the quality of the image, can you just fix the aspect ratio? I don’t have this image in a bigger size.

The issue with the tablet view is not the text, all of the images are stretched and distorted, it looks awful.

[David Martin – Support]

Hi,

You will need to make the image bigger using Photoshop.

This what I see for tablet sizes:

[aimeandalex]

Hi David,

I can’t make the image bigger as I don’t own photoshop, I paid someone to make the image giving them the sizes from your documentation.

Is there no code or anything that can just force it to maintain the aspect ratio?

[David Martin – Support]

Hi,

Here is an online tool you can use: https://pixlr.com/editor/

The cannot be forced using CSS as it will distort it.

[aimeandalex]

Hi David, I’ve replaced the image with one that is 1040 x 1040 but still having the same issue. I think the site is still pulling in the old image, even though I’ve totally removed it from the media library. Please could you take a look?

[aimeandalex]

Developer at our end here:

I’ve taken a close look into this and there is definitely an issue here as no matter what image I use it is always using a 900×915 image that has been generated. There is no 900×915 option under Settings > Media so I have no idea why this file size is being generated in the first place.

There is also no 1040×1040 image generated in wp-content/uploads folder on the server, which I would expect if this is the size required by the theme. There are however 1024×1024 and 1000×1000 images generated, both of which would be better than the 900×915 image that is being used.

Can you take a closer look at this please as we’re using the right size image (and have tested numerous wrong sized ones) and every time the result is the same.