Hi there! I’m having problems when upload an image, when I tried to resize de image, always part of them is cut. How I can solve this issue? I’m attaching an image to show hat happend. Thanks!
Hi!
Always remember that your pictures or logo need to be with a correct size from the beginning to be perfectly visible.
Disclaimer for what is following: No complaints about it, just to make people aware that a little work is always needed to make your logos, pictures perfect when viewed by your visitors or users.
Many of you think everyhting can work by the Softr magic. It’s never like this. I don’t know any no-code tool capable of doing this. A little work is always needed for improving the downloaded image format.
I don’t know, for example, if you create it with Canvas, you may change the size of the canvas frame. And testing is needed to know what is the best fit.
Anyway, you can also use the contain/cover option to see if it can help (and it should)!
1 Like
Hey @sjcortes,
I could ask you to send me a preview link 
Also, as @JohnK and @matthieu_chateau asked you can test contain/cover option.
Thanks,
Thanks @JohnK for your comments, but I’m working with feature-grid, and in that container doesn’t appear the background size option.
matthieu_chateau I’d try different size, but I couldn’t find the correct one (I’d work that image in Figma).
@Suzie This is the link Home - made with Softr
Thanks!
This is not the best practice approach. Resizing images to fit cleanly in a given layout is pretty basic and has been done by many sites since the 1990s. There are even free OSS libraries like ImageMagick that the Softr team can use with some very simple math.
Example
You want your image to appear in a container that is 50 x 50px (a square). The image that is uploaded is from a recent iPhone at 3024 x 4032 px (rectangle) and is in landscape (3024h x 4032w). Instead of 1:1 the image is 1:1.333333
If the long side (w) needs to be 50px, what is the short side (h)? 50 / (1 + 1/3) = 37.5px
So you need to run a resize command to resize it to 37.5 (h) x 50 (w) pixels. Then if you center the image in your container it should appear perfectly. That’s actually what the Contain setting does I believe.
Getting the actual size of an uploaded image is part of the operating system so doing this resizing about as easy as can be with a very small bit of programming. And libraries like ImageMagick can handle converting between file types, changing the compression etc. so it’s easy to optimize the loading for different uses.
1 Like
Thanks for this! Bookmarked answer!
Thaks for your answer @johntreadway . Sorry if my questions are to basic, but I just begin to understand No Code tools. In this case, I couldn’t find where I can see the size of the image in the Softr block. I haven’t problems with resizing it, but I need to know at what size I need to resize it, where I can find it? . Thanks for your help.