Layers

Page layers are additional style options you can use to add visual interest and emphasize important content on select pages.  To access page payers, click “Add Layer” and select the layer best suited to your needs.  

The following are examples of common layers.  The layers available for your use will be specific to your site. 

For each layer, we have included a published example and the editing fields you will see if you select that particular layer for your page. 

• Big Message
• By the Numbers
• Call to Action
• Featured News
• Hero
• Link List
• Quote
• Split Layout

Hero

A Hero Image is a large photo that appears at the top of the homepage.  Includes an overline, title and up to two “call to action” buttons.  A hero image should ONLY be used on the front page of your website. 

Hero images should be 1472 px wide, and 460px high.  

Layer Details

​​​​​​​Buttons: may be added to many of the layers.   Select “Add Button” and fill in the necessary fields. 

Variants: Some layers have the option of changing the background for the layer.  If the layer you have selected has that option, you will see an option to select a variant. Choose from the drop-down menu your preferred background.  If you select image, you will be able to upload an image as previously described. However, remember that most of your image will be blocked out by the content of your layer, so only the outer borders will be visible.  ​​​​​​​ 

Layer Details: If you hover over the bar at the top of the layer, you will see its position on the page – the number on the far left.  On the right you will see options (from left to right) to add a layer, duplicate the layer, delete the layer or toggle.  

• Add a layer will open up a menu so that you can add a new layer.  
• Duplicate allows you to copy the existing layer.  
• Delete the layer allows you to remove it.  
• Clicking on the toggle button will open up the editing field.  You can then close the editing field when you are done by clicking the toggle button again. 

Moving Layers: To rearrange layers on a page, hover your curser over the bar at the top of the layer you want to move.  You can then drag to reorder. It is helpful to toggle the editing fields closed while you are doing so.