How to manage images on Prismic?

Before digging into image management in Prismic, here is the technical specifications document for website media, please refer to it to add images of the right size in each place.

Images that are heavier than expected can greatly slow down the site operation.

Whenever a gray and white checkerboard is visible in a prismic document, it means that images can be imported at this level.

On each image there are 3 buttons:

1. Select an image from the gallery
2. Resize image
3. Delete image (does not delete image location)

When you modify an image, you can only rarely modify its size directly (number of pixels at the top right). The cursor indicates that we cannot modify the pi value.

Most of the time, we only choose the part of the image that will be shown in each format. (by selecting and dragging the image up or down in the example below)

The first photo you add is then automatically cropped to match all expected formats (desktop, mobile etc.) which can give a very random result.

If you want to add different images for each of the formats, you must:

• click on the button to go to the image format that you are interested in:
• click on "Select image" and select an image in the right format