To create a new image on a page click + (W) in the widget bar and select Picture. You can upload an image file, paste a direct URL, or add images from Flickr, Unsplash, or a built-in Bing search. You can also drag and drop any image file on the workspace to create a Picture widget.
Note: we support JPG, GIF, PNG, SVG, and BMP files up to 6 MB.
We highly recommend users to optimize their images before uploading them so as to maximize the project’s loading time. Scroll to the end of this article to find out more about adapting your images for Retina screens.
Basic editing
Click on the Picture to access widget controls on the right side. You can add a Border, Radius, change the Opacity, or use Crop and actual size (1:1) / half size (1:2) controls, as well as the standard Rotation for simple editing tasks.
To stretch your picture proportionally with the screen, select the Full-Width or Full-height position under Position in your widget controls.
Image replacement
There are three ways to replace an image:
1. Click on the Picture icon in the Picture widget control and choose a file.
2. Drag and drop a new image directly on to the Picture icon in the Picture widget control.
3. Drag and drop a new image over the old one.
Image optimization
When uploading an image, Editor automatically compresses it to the actual size of the widget and preserves a higher resolution version for Retina-like displays. This way the published project loads faster for most visitors, while anyone with a Retina Display or similar screen with high PPI density views a larger image within the same Picture widget.
Hint: upload high-resolution images.
We always recommend uploading high-resolution versions of images—at least twice the intended size of the widget. You can easily scale it down by hovering over the 1:1 icon and selecting 1:2 in the Actual size/Half size control. Click 1:1 to revert to the original size.