Gallery

These galleries can be used to display images with titles and captions. A page can only have one gallery.

Teamsite

To add the gallery to a page, create and upload a Javascript file containing the image data to the agency assets. Refer to this file for how to format it.

Add the CSS to the page metadata and add the javascript files to the page text DCR. The gallery will appear at the position the scripts were inserted in the HTML.

<link rel="stylesheet" type="text/css" href="/assets/home/css/pages/agencies/gallery.css" />

<script type="text/javascript" src="/assets/home/js/pages/agencies/galleryInit.js"></script>
<script type="text/javascript" src="PATH_TO_AGENCY_GALLERY_FILE"></script>

Content API

Content API sites use a different gallery that looks similar. See this page for an example of a gallery on a Content API site.

To add the gallery to a page, create and upload a Javascript file containing the image data to the agency assets. Refer to this file for how to format it.

Add the CSS to the head tag in the agency's index.html.

Add the HTML and the javascript files to the page text DCR. The gallery will appear at the position the HTML was inserted.

<link rel="stylesheet" href="/assets/home/css/content-api/gallery.css">

<div id="gallery"></div>
<script src="PATH_TO_AGENCY_GALLERY_FILE"></script>
<script src="/assets/home/js/content-api/gallery.js"></script>

Alternatively, after adding the CSS to the site, you can add the gallery to the page as pure HTML. See this page for reference.