When changing an image, we always suggest replacing an image, instead of inserting a new one. This is because certain properties will be carried over to the new image if it is replaced. An important property is the class responsive, which ensures that no matter what size your screen is, the image will adapt to that screen.
Kindly note that you need Edit content permission to access the Content editor.
Please ensure your new image fits the standards listed below. Kindly note that large, unoptimised images will impact the loading speed of your module.
Image dimensions:
Not wider than 1200 pixels. Not taller than 800 pixels
Some typical image proportions (ratios):
width 1200x400 height, width 1200x300 height, width 1200x250 height, width 800x500 height.
File format:
.jpg, or .png (for icons with transparency) or .gif (animated gifs)
File size:
Perfect under 100KB; Ok up to 250KB; Never above 500KB!
1. Find the module you want to edit. You can follow the steps listed in the article about Finding a module.
2. Select Edit content on the right side of the page.
3. Select the Edit button on the element you want to change.
4. Select the Content tab.
5. Select the existing image.
6. Select the image icon.
7. Select the upload tab.
8. Choose file and select the image you want to upload, or drag and drop your image on top of the Choose file button.
9. Select Send it to the server, wait and select OK on the browser popup.
10. Remove the numbers in the width and height fields.
11. Make sure a class responsive is entered in Advanced settings.
12. Select OK.
13. Select Update to save the change.
If you have completed all the module changes, please refer to the article titled What do I do when I finish creating or editing my module?.
*If you think you have the incorrect permissions, please contact your company admin or Customer success manager at [email protected].