Themify – how do I make Post images the same size?

Hi,

On the Post module options, you just need to enter the “Image Width” and “Image Height” option.

EDIT:——–

Hey there

Actually, this looks OK in Edit mode, but when I visit my site in incognito model as a random user it still has mismatched image sizes?

It appears that the posts with longer titles push the images down which misaligns them.

Any ideas how to fix this?

————-

Amazing! Thanks for solving this.

One more question – can you recommend any tutorials for Themify?

A tutorial on using the UI, but also using HTML, CSS, Javascript as well if possible?

Thanks

• This reply was modified 4 years, 11 months ago by bn47.
• This reply was modified 4 years, 11 months ago by bn47.

Hi,

Could you post the URL where we can see the Post image size issue? Also, please post a screenshot of your Post module image width/height options.

For tutorials, you can find at our blog and documentations:
– https://themify.me/blog/tutorials
– https://themify.me/docs

Hi, thanks for your help

japanfun.org – scroll down and you’ll see this

Here’s a screenshot https://imgur.com/a/BATUUbg

Thanks again!

Hi there

Any ideas on how to fix this? The boxes are not aligned despite the fact that I entered “Image Width” and “Image Height” option

Thanks

Hi,

The images are cropped at the size you entered: https://share.getcloudapp.com/DOuvmB1Y. The problem is that some of your post title are longer than other (ie. some posts have 1 line of title, some have 2 lines), so it causes the inconsistent layout.

Is there anyway to rectify this so that the images align? Perhaps there’s a way to shrink the longer text automatically so that all images are uniform?

Thanks

You can adde the following custom CSS to display the image above title:

.module-post .post-content-inner {
display: flex;
flex-direction: column;
}
.module-post .post-content-inner .post-image {
order: 1;
}
.module-post .post-content-inner .post-title {
order: 2;
}

You should get this outcome: https://share.getcloudapp.com/mXumYAqG