Web Services
Directory
A-Z Index
 

Editing a template page

The web team has developed several templates to consistently apply our styles and provide a clean user experience across devices. Here you'll find recommendations and guides to using some of our specialty templates. Be sure check out our examples page to see the templates in action. 

*Note: this is not a complete list of all possible uses, just some ideas to get started. The Web Team also regularly adds new options. 

  • After selecting a template, the editing screen will display various "data definitions" based on the template options selected. 
  • There are several types of data definitions
    • WYSIWYG ("What You See Is What You Get") rich-text fields, checkboxes, radio buttons, multi-select and drop-down lists, and page and file choosers that reference content managed in Cascade CMS. 
  • Content entered in a Data Definition will be will be styled to create a webpage.
  • Examples below of how some data definitions may be used to achieve a design using our site-home template. 
Screenshot: Managing Groups

*Tip: Collapse and rearrange groups in the page editor interface for a section such as panel, accordion, etc. Collapse section headings you aren't working in to simplify the interface. On the flip side, it is good to note that content needing edited can sometimes hide in these collapsed sections. 

Also, rearrange the order of group items by selecting the up/down arrows or use the drag/drop feature.

*Tip: Use the previews along the way to test your edits, there are two methods:

  1. Edit Before Previewing (Default Editing Experience - after making edits to a page, select "Preview Draft." Click edit to reenter the editor screen, or submit if satisfied with the changes.)  
  2. Edit While Previewing (Select "Show Edit Preview" in the page editor to show a side-by-side preview that updates in real time.)

Some "Site-home template" examples

Panel Styles & Designs (Formats)

There are several different formats you can use to display your content properly. To change or adjust the format of your content, navigate to the designated panel and select the format best suited for your content. Some options include (keep in mind we add new options regularly): Screenshot: Panel Format

  • Rich HTML Content (Basic body copy)
  • Accordions or tabs
  • By-the-numbers
  • Grids or rows
  • Quotes
  • Features

Important Links

Example: Important Links

Implementing important links can be good way to add quick navigation on your webpage. To utilize the important links select “Yes” after “Include Important Links?.” Then in the Important Links group you can enter/edit the link(s) text and location.Screenshot: Important Links

Panel Format: Rich HTML Content

This panel type is great for welcome statements, intros, etc. It is also designed to accommodate videos or photo galleries. To utilize:Screenshot: Rich HTML Content

  • Select “Rich HTML Content” for the format.
    • Select Default for a WYSIWYG editor, you can stylize the text in this panel as needed using headings, body copy, tables and more.
    • Select Video to embed a video from YouTube or another hosted source. 
    • Select lead section to apply a blue container around a block of content. Great for updates and announcements. 
    • Select a photo gallery to utilize a pre formatted photo slider that you can select the photos to appear. 

Panel Format: Rich HTML Content - Lead Section

Screenshot: Lead Section

A lead section is an area of highlighted/priority content that adds a blue background separating it from the rest of the page's content. There are two options you can choose from:

  • Icon/text - great for adding an alert with a small image to accompany the statement.
  • HTML text - great to use when basic text is all you need. Can be more flexible if needed.

Contact Footer

This is used for displaying contact information, hours and social media. You can show any combination of the three (Contact/Hours/Social). To utilize the Footer option select “Yes” for “Include Contact Footer.” This section is up top in the site-home panels area. After you select which “yes” you can scroll to the bottom of the page to see the added section.Screenshot: Contact Footer

*Tip: The templates are responsive (i.e., mobile-friendly) so the presentation of a website will change depending on factors such as display size and device type. Varying lengths of text or image proportions may not work well in certain scenarios. 

Be sure to manually resize your browser to see how your a webpage looks on different display sizes.


After you have finished editing you will submit. 

submitting content

Ready to be a Bearcat?
Bobby Bearcat