Although Wix and EditorX are power web design tools, functionality to resize and edit images are limited. In this case, an image manipulation tool like Photopea can be used.
This article provides a guide to resizing an image to ensure they are consistent and also square (1:1 ratio) for use with Elements such as Repeaters.
Open Photopea. You can either Drag-and-Drop an image or click File -> Open
To view your image size, select Image and then Canvas Size. An action box will be displayed which allows you to change the canvas height and width.
Resizing an Image via the Canvas Size Method
To crop your image using the Canvas Size, ensure the Height and Width are the same. In this case, 1024 x 1024 pixels. Click OK when to update the image size.
The image now needs to be reduced in size. To do this, select the Move Tool and then select Transform Controls. Click any of the Grab Handles to bring up the additional options for Transform Controls. Where is says W: 100%, this value needs to be updated to something like 75% for example. You will need to find a value which works best with your image. Click on the Move Tool and deselect Transform Controls. The image with automatically center.
You will notice a checker-box design in the background. This will need to be filled in with the same colour (or similar colour depending on the image) as the image background. To do so, select the Eyedropper Tool and click on the background colour. In this case, a light grey is selected. This will be displayed in the Colour Picker.
Now click and hold the Gradient Tool to bring up a secondary menu, and select the Paint Bucket Tool.
Simply click in the checker-box area to fill these in with the chosen colour.
Once complete, select File -> Export As, and then the desired file type. In this case, JPG has been chosen. Ensure the Image Quality is 100% and select Save.
Resizing an Image using the Crop Tool Method
Images can also be resized using the Crop Tool. Once you open your image, select the Crop Tool and change the crop type from Free to Fixed Ratio. This will automatically crop your image to be square (1:1). Some parts of the image however, may be outside of the crop area as shown in the image below. The image will need to be resized to fix this.
To do this, select the Move Tool and then select Transform Controls. Click any of the Grab Handles to bring up the additional options for Transform Controls. Where is says W: 100%, this value needs to be updated to something like 75% for example. You will need to find a value which works best with your image. Click on the Move Tool and deselect Transform Controls. The image with automatically center.
You will notice a checker-box design in the background. This will need to be filled in with the same colour (or similar colour depending on the image) as the image background. To do so, select the Eyedropper Tool and click on the background colour. In this case, a light grey is selected. This will be displayed in the Colour Picker.
Now click and hold the Gradient Tool to bring up a secondary menu, and select the Paint Bucket Tool.
Simply click in the checker-box area to fill these in with the chosen colour.
Once complete, select File -> Export As, and then the desired file type. In this case, JPG has been chosen. Ensure the Image Quality is 100% and select Save.