The Icon Row is a visual content row that is frequently used in the CMS. It requires a minimum of three links or a maximum of four. It is navigational, and meant to send site visitors to a standard page with more information. It is commonly used as a space for resources, or to highlight site content that might not be in the top navigation of a site. 


Example of the Icon Row properly used on the UMKC CAFE website:


As a site editor, you have access to all of the blue and yellow icons created specifically for UMKC Cascade websites. You must use the approved icons (available in the Asset Library) for the Icon Row. Outside icons disrupt the flow of your pages and distract from  cohesive UMKC branding. There is a wide library of icons available to you, and you may submit a ticket to have a specialized icon created as necessary. 


Editing the Icon Row

1.) Open the editing window in Cascade and navigate to the Content Row labeled 'select-icon-row'. Alternatively, if you are looking to add a new Icon Row, select the green plus sign to generate a new content row, then scroll through the options until you find Icon Row and select. 



2.) You will see you have opened one accordion, but will still not be able to see the icon row content in full. Select the next layer of the accordion, where the Icon Row Headline is found. 



3.) Now you have opened the Icon Row fully and are able to make changes. The first thing you will need to do is give your Icon Row a headline. This is the large blue text above the icons. This should be a concise title that lets site visitors know what to expect from the links. 




4.) Next, you will add/edit your icons. Once again, the Icon Row must have at least three icons but no more than four. Create your first icon by giving it a title. This is what your site visitor will see and use to identify the icon link.




5.) Next, you will add your icon image. Select the Icon image file to open the right hand navigation, then navigate to 'Browse'. This is where you will access the Asset Library for UMKC created and approved icons. 





6.) In the top right corner of the right hand flyout menu, you will see your site name in a drop-down field (to the left of the search bar). Select this drop down, and then select the option labeled '_Asset Library'. 




7.) Select the 'images' folder.




8.) Select the 'icons' folder.




9.) Use Cascade's preview image function to browse the icons and find one that suits your needs. Most of the icons are general purpose for a university setting, but if there is extremely specific imagery that could be represented by an icon, please submit a web ticket. There are currently 4 pages of icons to search.


Once you have found the icon that works for your link, select 'Choose'. 



10.) Next, you will need to give your icon some alt text to keep your webpage accessible. Type a brief description of your chosen icon. 



11.) Finally, you will select the 'Icon Link' to navigate to your chosen file, page, or link for this icon. Please note, the Icon Row does not accept external links to be added at this stage. You will need to have previously added an external link to your site's 'Links' folder to use the external link at this stage in your Icon Row. 


Learn how to add an External Link to your Links folder here



12.) You can use the right-hand arrows to re-arrange and add or delete an icon as needed. You can then follow the steps to preview your draft, submit, and publish your changes.