Add and manage images

Upload and add images on your pages

Edouard Williamson avatar
Written by Edouard Williamson
Updated over a week ago

RacontR welcomes all popular image formats : jpeg, png, gif. Once uploaded in the “Media” section, you can add your images to your pages.

Here are the different options offered by RacontR covered here :

  • Insert an image on a page

  • Insert multiple images on a page

  • Image properties

  • Size and position

Insert an image on a page

  1. To insert an image, click on the “+” icon in the top left menu of the page editor. A list of available media appears, click on “Add images”.

  2. The image library includes all the files you uploaded in the “Media” section. Select the image you wish to use and click on “Apply” to insert it on your page


Insert multiple images on a page

To insert multiple images, sounds or videos, keep the shift key pressed on your keyboard while selecting several files on your computer.

Click on “Apply” to insert them all at once. You can then manage their depth with the layer stack on the left menu.


Images properties

  1. Rename your element (by default it will have the same name as the file you uploaded), or add a CSS class.

  2. Replace your element

  3. Duplicate (while preserving its properties and actions) 

  4. Manage the opacity of the element (from 0 for invisible to 100%)

  5. Manage the rotation of the element


    6. Manage the opacity of the element (from 0 for invisible to 100%)
    7. Manage the rotation of the element
    8. Choose a color for the border, set the rounded effect for the border, set the size of the border, the position on the scene (X or Y).
    9. Choose a color for shadow
    10. Choose horizontal position for shadow
    11. or vertical position.
    12. Then, choose a blurring effect.


Size & position

    13. To move an image, you can drag-and-drop it wherever or edit its precise coordinates in X
    14. and Y in the bottom right fields.
    15. To resize an image, you can click-and-drag from one of its corners (keep the shift key pressed to preserve its proportions) or edit its precise width
    16. and height in the bottom right fields.
    17. You can lock the element on the scene.

Did this answer your question?