Visuals are extremely impacting. Sets of images can convey a powerful message, if combined and displayed properly.
📚 Create Content > Blocks > Gallery
Definition & Purpose
Definition
Use the Gallery block to display images in a carousel, grid, or 3 columns.
Purpose
Allows users to engage with multiple images in a structured and organized manner.
Slider style
A carousel of images relevant for the topic with arrow selectors on the sides to switch from one image to another.
Slider front end
Below you can find an example of gallery using the sliders style.
Gallery block
Slider
KEY INFOS
|
3 Columns
Use this style to combine photographic elements in three columns. Great for accentuating text and telling a visual story.
Pages: ISSUE pages, Evergreen page
Below you can find an example of gallery using the sliders style.
Gallery block
3 Columns
Grid style
Use this style to show thumbnail of lots of images, properly aligned. Good to use for storytelling, when showing lots of activity on a particular theme.
Grids are used to give an overview at a glance, called helicoptering. For example, they can be used by a campaign to show e.g. “the story so far”, “what we achieved”, or “where we are going”.
Gallery block
Grid
Edit mode
The Gallery block is a WYSIWYG block, so the Title and the description can be edited in place. Then, the images have to be selected.
After all the images for the slider have been selected, you can next choose the image focal point on the right side of the block. There is a circle displayed on the image, so you can simply move it around to choose where to set the focal point.
You can easily edit and delete or add more images by going at the top of the block re-selecting photos.
Block styles – Campaigns
KEY INFO – Each Campaign has its own Gallery Slider style. The other styles (Grid / 3 Column) are the default ones.
Please check out the Design Systems to see the Gallery slider style of each campaign
Design Elements
All design files of the block are available in the P4 Design Systems > Blocks > Galley
Links & Resources
- Handbook
- Set up the P4 key Content (Navigation, Footer, Menus, Favicon, Post types)