Enhancements
- College Slider
- Image Buttons
- Full Width Background Image panel
- DC Distinctive panel
- Overlap Panel
- Animated Header Styling
- Testimonials
- Custom Timeline
College Slider
This slider is built with Posts
- Clone one of the College Slider element options from the Production branch > College Slider page
- Paste Element onto the desired page
- Edit Element Setting to select which Posts Board to show in this panel
- Post will show Body content in Post pop up if there is no link added to the Post Summary.
- If there is a link added to the Post summary, then clicking on the post on this custom slider will direct to that link.
Image Buttons
Each Image Button is built as a Content Element
- Copy Image Buttons from the Enhancements page
- Copy a container of image buttons or an individual button element, paste on desired page
- Edit Element Settings to update button title, hover text, image and link
- Image sizes will be based on column width
Full Width Background Image panel
The full width panel with text and a background image is built as a Content Element
- Copy element from the Enhancements page, paste on desired page
- Edit Content Element Settings to update background image
- Edit Content to update panel text, should be in H2
DC Distinctive panel
There are several versions of the Homepage DC Distinctive panel available on the Enhancements page to copy, paste onto a new page, and update as needed. These options allow for different number of images to be displayed.
Copy the entire Container of the version you wish to use from the Enhancements page, paste on the new page, and update as needed.
Overlap Panel
The overlap text and image panels are built as a Resource Element and a Content Element within a Container. From the Enhancements page, copy the full Container Element of the panel you wish to use, add it to the desired page, edit as needed.
Container Element
- Custom Classes:
- Green: overlap-panel
- Blue: overlap-panel blue
Resource Element > Single
- Browse to select image
- Custom Class: panel-photo
Content Element
- Element Settings > Title
- Edit Content in the content editor and save
Animated Header Styling
These animated header styling options are built as a Content Element within a Container Element. From the Enhancements page, copy the full Container Element of the header option you wish to use, add it to the desired page, edit as needed.
Container Element
- Custom Classes:
- Subtitle text on the right - animated-header
- Subtitle text on the left - animated-header header-left
Content Element
- Edit Element Settings
- Update element Title to update larger green title text
- Edit Content
- Update text in content editor to update the subtitle
Testimonials
This is a version of the Homepage testimonials panel to be used on interior pages as desired.
Copy the entire Container from the Enhancements page, paste on the new page, and update as needed.
This panel is built with Container and Resource Elements
Update main Container Element
- Update element Title to update panel header
- +Design section
- Custom Class: testimonials-container
- Header Content > Update panel intro text
The next Container Element only contains a Custom Class: testimonials
Update Each Resource Element
Single Image Testimonial
- Element view should be set to Single
- Browse to select the image for the page
- +Design section
- Header Content > Update hover text, update button text and link
- Footer Content > Update Role and Name for testimonial, name should be bolded
Video Testimonial
- Element view should be set to Grid
- Browse to select the Gallery with the correct video
- Title is the question text
- +Design section
- Header Content > Update hover text, update button text and link
- Footer Content > Update Role and Name for testimonial, name should be bolded
To add an additional testimonial, copy the Resource Element for the single image or video and paste the element within the container, then update that new element as needed.
Custom Timeline
The custom Timeline page is built very specifically. Clone the entire page and add it to the sitemap where you want to use it.
- Page Settings > Custom Body Class: timeline-page
Update Timeline Page
Container Element Settings
- Custom Class: timeline
- Browse to select a new Background Image
Content Element Settings
- Do not edit this element
- Custom Class: timeline-nav
Post Element Settings
- Element view should be set to List
- Select Posts Board to display
- Custom Class: timeline-posts
- Do not change other element settings
Update Posts
- Go to Posts Board
- Post Title > should be the year to be displayed in the upper left-hand corner of the thumbnail
- Summary > Add on-page text to the Summary field. Bold the title in the Summary and then normal text below.
- Body > Add H2 title and then body text as normal below for the post popup
- Category > timeline
- Tags > Tag the post based on timeline date filters: 1800s, 1950s, 1980s, 2000s, 2010s, 2020s
- Thumbnail > Add 1:1 ratio thumbnail
- Additional Settings > Custom Class - set each post's custom class to change text background color
- No custom class = green background
- secondary = navy blue background
- accent-2 = light blue background
- All custom classes are available in the Style Guide - the same classes as are used for the Content Card colors.