Enhancements

This page includes instructions for setting up and styling interior pages with the enhancement elements that were custom created for your website. Please refer to the Enhancement Page of the Production branch for the a complete library of available styles.

PAGE SETUP

Page Set Up and Appearance

A default interior page on the website should include a set of banners, and a theme. These banners can be added from the Page Layouts and Appearance menu which can be accessed by clicking the Page Layout icon located next to the Compose button. From the pop up menu, selections can be made from the dropdown menus.

Setting	Value
Header	redesign 2022 header
Left Banner	default left (applied in areas that a banner is created)
Right Banner	None
Footer	redesign 2022 footer
Menu	redesign 2022 off canvas menu
Theme	redesign 2022

Hero Image

An optional Hero Image can be added to any interior page.

Add a Resource Element to a page
Adjust the settings to Single
Click Browse to select an Image
Note: image should be saved out at 953px by 560px, saved for web.
Click +Design and add the custom class, hero-slideshow
Save and Publish

Once the page is published, the the image will snap to the banner.

Hero Image Slideshow

An optional Hero Image Slideshow can be added to any interior page.

Add a Resource Element to a page
Adjust the settings to Slideshow
Click Browse to select an Gallery
Note: image should be saved out at XXXX x XXXX pixels, saved for web.
Click +Design and add the custom class, hero-slideshow
Save and Publish

Once the page is published, the the slideshow will snap to the banner.

Hero Video

An optional Hero Video can be added to any interior page.

Add a Resource Element to a page
Adjust the settings to Single
Click Browse to select a Video
Note: videos should be outputted with the considerations posted here: Optimize Video for your website
Click +Design and add the custom class, hero-slideshow
Save and Publish

Once the page is published, the the video will snap to the banner.

Custom Image Sizes

element	Image Size
Interior Hero	953px by 560px
Custom Image Button	380px by 320px
Custom Full Width Elements	At Least 1400px wide and 540px tall

Image Buttons

Image buttons have been designed to show background image with front text showing on load and additional text to show on hover with optional button style. Can show buttons is a 2, 3 or 4 layout option.

Copy image button layout from Image Button page under the Enhancement page in the Production Branch.
Paste into page in location you want it to display
Select element settings, expand Design
Double Click on image in Header Content Area to source new photo
Select element settings
Select Browse to source new image to show from Resources
Expand on Image section, under custom tab add text as needed
Hit Save
Hover Over Image and Select Edit Content
Update text
1. Font Text is set to H2 style
2. Plain Paragraph text is for the copy seen on hover
3. Button created with 2022 Button Hallow on Dark
Hit Save

Full Width Panels

Full Width panels are created as a way to show content on a color or image background that stretches across the screen and works best on the one column layout option.

Full Width Panel with Color Background

Copy image button layout from Full-Width Panels page under the Enhancement page in the Production Branch.
Paste into page in location you want it to display
Hover over image and Select Edit Content
Update text
1. Title Text is set to H2 style
2. Plain Paragraph text is for the copy
Hit Save

Full Width Panel with Image Background

Copy image button layout from Full-Width Panels page under the Enhancement page in the Production Branch.
Paste into page in location you want it to display
Select Element Setting, Expand Design
Under Background Image Select Browse to source new image
Hit Save
To Add Text, hover over image and Select Edit Content
Update text
1. Title Text is set to H2 style
2. Plain Paragraph text is for the copy
Hit Save

Posts Slider

Custom Post Slideshow was created to display posts that have a thumbnail image set with a summary for display in a 50/50 or 70/30 layout.

Adding Posts Slideshow

Copy posts slideshow layout from Post Slider Custom page under the Enhancement page in the Production Branch.
Paste into page in location you want it to display
Hover over post element and select element settings
Update Board to display proper board
1. Note: All post content is managed in the posts module and needs to be created and set up prior to adding it to the page level.
Posts should be set up with the following
1. Thumbnail Image
2. Summary
Hit Save

In This Section

Site Search

Directory Search