On all websites, images set up with the display mode ‘keep image ratio’ are either too wide or too high. For example, the image is inside a container and thus has the corresponding unfilled margin at the top/bottom or right/left. A chat request to the support team suggested that I should crop the images to make them fit, but surely that can’t be the solution? Has anyone else encountered similar problems?
The published pages don’t yet show the error – but WixStudio has already changed the layout of the as-yet unpublished version.
I think the image element you’re displaying on the left (the one with blank space on the sides) was originally showing a different image, and then you replaced it by selecting “Change Image”. When you do this, the new image is forcibly fitted into the size of the original image, which can result in the phenomenon you’re experiencing.
If the image you’ve prepared doesn’t have any blank space, try selecting it directly from the Media Manager and placing it in the editing screen. This will likely remove the blank space in the image element as well. Instead of adding an image via “Quick Add > Image” and then replacing it with “Change Image”, access the Media File Manager directly from “Media” and select your image to place it directly.
OR
If you want to solve this issue without cropping the image itself, Wix provides an option called fitMode for image elements. There are three types of fitMode settings: “fill”, “fit”, and “fixedWidth”, each with different characteristics. Since I don’t know which pattern you prefer, I’ll attach a link with more details about fitMode so you can review it yourself.
To use this fitMode option, you’ll need to write some very simple Velo code. If your editor is already set up to use Velo code, you can copy the code provided in the linked guide, and it should work without any issues.
If your editor isn’t ready to use Velo code yet, you’ll need to enable Developer Mode first. Look for an option like “Enable Developer Mode” in the menu at the top left of the editor screen. Once you enable it, you’ll be able to use Velo code.
Hi onemoretime,
thank you very much for your support. Yesterday, I updated the images on some websites; the settings were then okay. However, the websites/images that I did not correct show the old layout today and everything is correct again. It feels as if the fitMode options you outlined were active for a day and have been turned off again today – none of the pages show yesterday’s shifts – that can’t be right?
I await the possible surprises that are yet to come. Thank you very much.
So, does this mean that the display is still not working properly at the moment…? It’s good news that the fitMode worked, but it’s hard to imagine it only functioning for a single day. For now, how about clearing your browser’s cache and reloading the site?