Landing Page

Using The Landing Page

The landing page of your site can be cloned and used to replace a landing page or individual elements can be copied and placed on any page in the website. The copy button can be found in the top right corner of an element

To clone the page

Click on the landing page in the list of site pages
Click the ... menu
Moved the page just above the desired landing page
Move the pages below the current landing page under the new landing page by using the "move to new parent" option in the ... menu
Delete the old landing page

Updating Individual Elements on the Page

Some of the elements on the page are standard interior page elements that can simply be updates using standard instructions for the CMS. The individual callout, voices and infographic are elements that have been repurposed from the homepage of the site for use on interior pages.

Hero Image: Update this image via the element settings by clicking the browser button and selecting a new image from resources
Content Element: This element can be update and edited by clicking into the main body of the element. It's currently using a lead in style and body copy
Quote: This is a standard quote style and can be updated by clicking into the main body of the element.

Slideshow

This slideshow is designed to display a set of quotes and images.

1. Create a gallery for the slideshow

2. Add images/quotes to the gallery

Add an image (565 x 600)
Add the quote and the citation.
- The citation should be italicized and directly follow, on the same line, as the quote text
Add the link text (Student Stories) on a new line

Pro Tip: Follow the format of another quote to be sure the formatting is correct.

3. Connect the resource element to the appropriate gallery

Click the settings of the resource element
Click Browse to select the Gallery for desired set of quotes
Save
Publish the page

Custom Image Box

This element can be copied and used on any page in the site. It will expand to the space where it's placed so that it can be used in any number of page layouts. To update the element

Click into the main content areas
Update the text and link. If you are following the current styling, the text is H3
Save
Click into the element settings
Click Browse to choose a new image from resources
Save

Infographic

This infographic is the same as the one used on the homepage. Because it's a full width element, it needs to be used at the bottom of an interior pages.

This section is created from a series of custom content elements. To maintain the formatting of each statistic, we recommend updating each from the html of the content element.

To update an element:

Copy the custom class from the desired icon (Link to List of Icons)
Click into an element
Click the html </> from the editor
Highlight the red text and paste the custom class of the new icon
Replace the statistic between the <h3> tags
Replace the description between the <p> tags
Save

To add additional statistics to the slider, copy one of the elements and paste it within the container.

Hero Image

Hero Image

The hero image on the landing page uses the same basic hero image module as any other interior page, with a few tweaks.

You can start by adding the shared element "Hero Image" to you landing page. You then have to click the "SHARED" button that appears on the top right of the element.

A popup will appear asking "Would you like to orphan just this element or edit the shared element?"
You want to select the middle button labelled Orphan and Edit.

This should put you in the element settings panel, where you can see the various options for the element. The one we want to focus on now is the Image option. Once you have the Image option tab active, you can see a section called Caption. It will default to None, but we want to select Custom which will then display a text box underneath. Here is where you write the caption for your landing page hero.

Here is a screenshot of what the final product should look like before hitting save:

Notice that the top title is specifically a H3 and the sub-title is a H4.
This gives those lines of text their correct styles and animations. If something is looking weird with your landing page caption, double check that these are set to the correct headers.

After that you should be all set to save your new hero element and publish your landing page. The hero won't get its custom styling or move under the header while viewing through composer. Click the eye icon on the bottom right of your screen to preview the live page and see your new hero in all its glory.