toujou
+49 911 23980-870

Portfolio Gallery

The Portfolio Gallery combines slider and gallery in an element. On desktop devices, the element is displayed as a grid element with a maximum of five images. On mobile, the media content is presented as a slider.

Sample view Step by step Screen adaption


Sample view

Schematic arrangement

The following schematic arrangement provides a representation of the images based on the respective number of selected media contents. The grid format is displayed for devices with a minimum screen width of 840px. On devices with a maximum width of 840px, the Portfolio Gallery appears as a slider.

 


Step by step

Create element

  • To create a Portfolio Gallery, start by clicking on +Content.
  • Then, select the Portfolio Gallery option in the Media tab.

Add media

  • To add as many media elements as you want, click on the "General" tab, then under "Media Elements," choose one of the three options: Add Media File, Select and Upload Files, or Add Media by URL. (For all information on uploading images.)
  • The pictures will be displayed in the specified order.

Edit button text

  • To display text on the button, fill in the text field in the button label section. Alternatively, "Show All Media" is set by default.
  • Save your settings.

Screen adaption

You can use the element in both the header and the content area of a page. When placed in the header, it spans the full width of the screen, while in the content area, it adheres to the content width defined by the theme.

On desktop devices, a maximum of five images is displayed at once. If there are more than five media contents, the 'Show All Media' button automatically appears, which you can edit under the 'Edit Button Text' step at any time. Clicking on it will display the additional images using a lightbox.

Responsive: From a width of at least 840px, the Portfolio Gallery is displayes as a grid. On devices with less width in pixels, the element is displayed as a slider.


Linked topics

All media elements

Image editing File list