The Image image gallery component is a series of images users can side- scroll through.
Info |
---|
To view the front-end design of the gallery, visit the Ripple design system. |
The gallery has to first be Image galleries are built in the Custom Block Library section in the CMS – it can't be created within a page template, only embedded. This means the same . Once built, the gallery is embedded onto a landing page. As with all custom blocks, one image gallery can be embedded on multiple pages, and it only needs to be updated in the one spot in the CMSlocation.
On this page:
Table of Contents | ||
---|---|---|
|
Check your images are the correct format and size
Visit the image ratios, sizes and component use guide.
Add a new image gallery
In the CMS, roll over or click on Structure, then click on Custom Block Library.
Select Add custom block.
Select Image Gallery.
In the Block description field, add a name for your gallery. This is only visible in the CMS and is used to search for your gallery.
Ignore the Featured images section – this field has no current functionality.
In the Gallery images section, click Select images and either:
search the library to add existing images
add a new image by selecting Add image
If you're adding an image:
include alternative text if your image is informative or leave this field blank if the image is purely decorative.
keep in mind that both the image name and the caption are displayed in an image gallery.
if you fill in the Title field, this is what displays when a user hovers their mouse over the image.
The Topic, Tags and Revision information fields aren't mandatory to fill in.
Click the Save button at the bottom to create your gallery.
Embed your image gallery onto a page
In the CMS, go to the page where you want to add the image gallery. This can only be a Landing page, Publication page (e.g. child or grandchild page) or specific custom page templates.
Click on the Add component button in the body content section and choose Image gallery.
Start typing the name of your image gallery and select the correct option from the dropdown list.
Find and edit an image gallery
In the CMS, roll over or click on Structure, then click on Custom Block Library.
You can search for a gallery using its name or keywords in the Block description field.
You can filter your search results to only show Image Gallery options by selecting this in the Block type dropdown menu.
To edit the gallery, you can select the name in the Block description column or the Edit button in the Operations column.
You can edit all fields as well as add and/or remove images.
Select Save to apply your changes.
Live exmple of an image gallery
...