Image Fact Grid

The Image Fact Grid displays up to three facts. It is recommended that you not include Link Description text if adding a link.

A fact is a special component located in the site’s Data > Facts Folder or in the Shared Sites > Global Facts Folder.

See the Fact page for more details.

Users can create a new fact inside of the site’s Data > Facts Folder. Users may also find facts inside the Shared Sites > Global Facts Folder.

See the Fact page for more details.

To work properly, an Image Fact Grid at minimum needs a background image set for desktop view and at least one fact added to the component.

Websites may display one, two or three facts in an Image Fact Grid.

• Before adding the Image Fact Grid component, the content author should have the desired facts details ready.
• Existing facts available to use are in the site’s Data > Facts Folder or in the Shared Sites > Global Facts Folder. 
• Content authors may create new facts in Content Editor in their site’s Data > Facts Folder.
• Content authors may also create new facts by choosing “Create new” when placing a fact in the Image Facts Grid in Pages. Select the site Facts Folder for the location.
• Data for a fact can be added/edited in the Content Editor, directly in Pages or in Explorer.

Specific notes for facts used in an Image Fact Grid:

• A fact must have the “Title – Text” and “Description” fields completed. 
• The “Source URL” and “Description” text are optional.
• The “Subheading” and “Image” fields are not used in the Image Facts Grid. These fields are used in other components that use facts.

In Pages:

1. Select the page in the Content Tree.
2. Click “+” button in any Placeholder box below the Breadcrumb links.
3. Select Image Fact Grid component from list.

Alternate method:

1. Click Components tab at top of Content Tree.
2. Locate Image Fact Grid component.
3. Drag the Image Fact Grid component to any empty placeholder area of the page below the Breadcrumb links. 

1. Add a background image to the Background Image Desktop area by clicking on the background image selector in the bottom right corner. 
2. In the Background Image Desktop window (to the right), use the image Element Options to add the desired image (or change, if an image had already been selected).
   1. If different mobile or tablet background images are needed, those can be added in Explorer. See instructions below.
3. Select the Image Facts Grid and choose the desired background style under the Advanced Styling in the right-side Component Options panel.
4. Add (or create) the desired fact(s), starting with the left-side placeholder.
   1. To use one fact, leave the middle and right placeholders empty.
   2. To use two facts, leave the right placeholder empty.
5. Add or edit fact data, as needed.
   1. Note: When using existing facts, take care when editing. Facts could be used in other locations on the site. Any changes made will change the data for the fact anywhere it is used.
   2. Global Facts are only editable by system administrators.

Mobile and/or tablet background images can be added in Content Editor or Explorer.

In Pages: 

1. Click the Image Fact Grid component to display the toolbar.  
2. Click Box with arrow icon to go to Explorer. Explorer will open in a new browser tab.

In Explorer:

3. In the Explorer tab, locate the Content panel to the right. Scroll to the BackgroundImageTablet field to add an image for tablet-sized screens.
4. Select the tablet image.
5. To add a new image: Click Upload to add a new image and click Add Image. 
6. To use an existing image: Click Browse media library, search and select the image and click OK. 
7. Scroll to the BackgroundImageMobile field to add an image for mobile phone screens.
8. Select the mobile image.
9. To add a new image: Click Upload to add a new image and click Add Image. 
10. To use an existing image: Click Browse media library, search and select the image and click OK. 
11. Return to Pages. 

In Pages:

12. Refresh the Pages canvas to preview the changes. 
13. Preview and publish.

Mobile and/or tablet background images can be added in Content Editor or Explorer.

In Pages: 

1. Click the Image Fact Grid component to display the toolbar.  
2. Click Box with arrow icon to go to Explorer. Explorer will open in a new browser tab.

In Explorer:

3. In the Explorer tab, locate the Content panel to the right. Scroll to the BackgroundImageTablet field to add an image for tablet-sized screens.
4. Select the tablet image.
5. To add a new image: Click Upload to add a new image and click Add Image. 
6. To use an existing image: Click Browse media library, search and select the image and click OK. 
7. Scroll to the BackgroundImageMobile field to add an image for mobile phone screens.
8. Select the mobile image.
9. To add a new image: Click Upload to add a new image and click Add Image. 
10. To use an existing image: Click Browse media library, search and select the image and click OK. 
11. Return to Pages. 

In Pages:

12. Refresh the Pages canvas to preview the changes. 
13. Preview and publish.