Photo Tiles are a CMS content row that can be used to display dynamic imagery while helping your site users navigate to relevant content. You must have at least two, but no more than 10 photo tiles in a content row. It is commonly used to highlight special programs or opportunities for site visitors.
Example of the Photo Tiles being properly used on the UMKC CAFE website:
Adding and Editing the Photo Tiles
1.) Open the editing window and navigate to the content row section of your landing page. Select the green plus sign to add a new content row.
Alternatively, if you need to edit an already-existing Photo Tiles content row, find and select the content row labeled 'select-photo-tiles'.
2.) In your new content row, select the 'Select a value ...' drop down menu. Scroll to find 'Photo Tiles' and select.
3.) Add a title to the Photo Tiles Headline space. This will tell your site visitors what type of content and links they can expect to find in your photo tiles. You can also add an optional Intro for your photo tiles to further give your site visitors context for your content.
4.) Now you are going to build your first tile. First, give your photo tile a Title. The title will always be visible on the page. Next, you will select an image from your images folder for your photo tile.
5.) Select the 'Choose File' button under the 'Tile Image' title to open the right-hand fly-out menu. Navigate to 'Browse' then use the breadcrumbs to navigate your site's folders and open the 'Images' folder. You can then find and select the image you wish to use for your photo tile. At this point, your image must already live in your images folder. For help uploading images, please view the 'Uploading Images' article.
6.) Now you may add 'Tile Content' for your photo tile. This is not a place for multiple paragraphs of text, it will not fit in the tile. Please keep tile content to a concise introductory description of the Photo Tile link. Also keep in mind, this text is only visible as site users roll their cursor over the tile itself.
7.) Add a Call to Action button title in the 'Title CTA Button Text' field. You should use CTA language, such as 'Learn more', 'Explore', etc. You will then select a link for this button using the 'Choose File, Page or Link'* button and navigating your site with the right hand fly-out menu.
*If you would like to use an external link (a link that is not found in your website's folders) you will need to have previously added the external link to your site's 'Links' folder. Learn how to add an external link to your site's 'Links' folder here.
8.) Repeat steps 4-7 at least once.
Photo tiles are displayed two across a page and will not center-align with odd numbers, so you must add photo tiles in groups of at least two, up to a group of ten.
You can add new tiles by using the green plus sign on the 'Tiles' accordion. You will see a gray pop-up that reads 'Add new group' and select. Cascade will refresh the page and you can then scroll to see a blank new tile for your next set of content.
9.) Optional: you can add a Photo Tiles follow-up to the bottom of any Photo Tile row. This is useful when you have a relevant program that doesn't quite belong with the rest of the tiles, or a natural next step for site visitors to explore.
First, you will give the 'Photo-Tiles Follow-Up' a headline.
Next, you can add 'Follow-Up Content' to explain what you would like your site visitors to read, consider or explore next.
10.) If you have a link you would like to include in your follow-up content, give the button a title with CTA text in the 'Photo Tiles Follow-Up CTA Button Text' field.
You can then 'Choose file, page, or link' to add the link of your choice.
11.) You can then follow the steps to 'Preview Draft' and 'Submit' your new Photo Tile content row.
