MENU

Images

Adding images can help bring life to the page and break up text-heavy pages, when done properly. Well-crafted photos also play an important role in bringing our brand DNA to life.

Below are examples of how to use and display images for different purposes.

Image Gallery 

The image gallery component presents your images in a gallery with thumbnails or as a slideshow that plays each image for a duration of five seconds. The gallery is set to display the max height and max width of the photos, to maintain a unified size with a grey background that displays if the photos are at different ratios. 

 How to

1. Add photos to DAM

  • Add photos that you want to display in an image gallery or slideshow into a folder in the DAM

adding files to DAM

2. Add Gallery Component to page 

  • a. Select the Image Gallery component from the sidekick under General and add it to your page
  • b. Place the image gallery in a 50% column component or larger if you wish to include thumbnails in your layout. At smaller size thumbnails will not be displayed. 

 

3. Add images to gallery component

  • a. Click on the edit button
  • b. Under Image Folder, click on the magnifying glass and select the folder where you have uploaded the photos to display in your image gallery. 
  • Note: all images within the selected folder will be displayed.

4. Select which display type you would like

  • Image Gallery

  • Slideshow

5. To display photo captions:

  • a. Select show caption checkbox

 

  • b. Navigate to the DAM, and double click on the photo to add a caption
  • c. Type in caption into description text box
  • d. To add bold text to a section of the caption, add the bold HTML tags around the text you wish to bold (Add <b> tag before your text, and add </b> tag after your text).
  • Ex. Text to <b>bold</b>