🖼 Images and logos

The main configuration elements of the platform's home page can be found in the tabs "Appearance" and "Home page" of the Settings.

The formats

The exact dimensions of the images depend on the size of your screen.

The platform constantly adapts the image to the screen size, always keeping the centre of the image as a reference point. Therefore, it is advisable to choose large-format images close to the square (e.g. 800x800 px with the essential elements around the centre rather than at the edges).

To ensure that the images will always be displayed optimally, we therefore recommend that you follow the formats and key figures shown in the table below.

The welcome banner

To add a welcome banner, go to the Settings tab and then to the Home Page sub-tab (for more information, click here). Click the"Pencil" icon in the block named"Main Image (hero)". Here you will be able to : 

• Change your welcome text: This is the text that appears above the image. In the example below: "Welcome to the Decidim demo platform".
• Upload or delete a welcome image: This is the main banner, in the recommended format of 1920 x 666 pixels.

Warning: We recommend using a plain photo or banner without text for this image, as the image is cropped. If you wish to use text, use the "Welcome text" field instead.

In desktop version

In mobile version

The enhanced content banner

The highlighted content banner can be activated and configured in the Settings tab, under " Appearance" (for more information, click here). To activate it, click on "Display the highlighted content banner" in the dedicated section, and fill in the different fields. 

The recommended aspect ratio for this image is 1600 × 308 pixels, which is a 5:1 aspect ratio. The image is then resized. Its height also depends on the length of the set text and completed fields.

To make this block appear on the Home Page, go to the Home Page tab and skip the "Featured Content Banner" block in the active content blocks. For more information on the Home Page tab, click here.

The picture in mind

This image is set in the "Information" tab of each Process, assembly, etc.. After being imported, its height depends on the length of the Title and subtitle of the space.

For this image, we advise you not to put text, and we advise you to put important information and visuals on the left side of the image. 

Indeed, a colored layer and the space step map are present on the right side of the header. The layer retrieves the primary color of the platform, which you can change in the Appearance tab. For more information, click here.

The home page image

This image is set in the "Information" tab of each Process, assembly, etc.. This image will be displayed in several places on the platform: 

• as a thumbnail on the home page: the height is fixed at 128 px, but the width varies up to a maximum of 400 px.
• in large format for a process highlighted in the list of participatory processes :
  • adapts in height to the process description text (up to 614 px on a 13" screen) and in width to the screen size (576 px on a 13" screen).
  • in tablet format, the image goes horizontal in 750 x 240 px.

As you can see in the image below, this image does indeed appear in different space map configurations.