Any ideas how we can make dynamic-size image element responsive - when photo size and ratio might differ of each different photo? Thanks!
If you store it and call it from the database you can choose a render mode called resize and it will adjust to fit perfectly without needing to use the aspect ratio bit
1 Like
The general rule of the thumb is to use background image in a group when you need to cover an area with an image regardless of aspect ratio, and when the aspect ratio is important to preserve, just use an image. Not sure if I’m 100% understanding your use case though.
2 Likes
Thanks @philip2 and @flowtron.
Furthermore: Having uploader where different ratio is displayed when photo is being uploaded:
Example:
And then when photo is uploaded, it looks like this on the profile:
At uploader, you can’t change settings for photo ratio, rather you can play with adding a group or photo element to make uploaded photo visible as well.
Still we would have this problem if we use “Zoom” option settings in the photo element, so it would cut a lot of photo, but then if we leave it as it is, it won’t cut the photo.
What are your practices, to make a balance here, because there are photos who are 1:1, which is perfect, but then there are photos who are not 1:1 so the photo needs to be cutted or not, while if not, it looks really bad with the squared space around the photo.
Do you teach users to upload a particular size of the photo, or are there any other tricks?
Thanks!
I would either ask the user to upload certain dimensions if doing Zoom is going to be too drastic. You could also look in to a popup workflow that allows the user to crop the image after it’s uploaded. I haven’t done this exactly before but that’s a workflow you see on a lot of popular sites that you could try and emulate. There is likely a plug-in to accomplish that UI.
1 Like
Okay, thank you for the answer @flowtron
This makes sense. Will keep my eyes open 