Accessing the Engineering Homepage in Cascade
For instructions on how to use Cascade, visit sandiego.edu/cascade.
To reach the Engineering home page in Cascade, go to http://cms.sandiego.edu, use your USDOne login name and password to log in, and then navigate to the Engineering site in the site selector.
Once there, click on the index page usually located near the bottom of the Explorer.
Editing the Home Page
Once selected, click the Edit button to begin editing the page.
Sections
The Engineering homepage is divided into five sections:
Most of these six sections are further divided into sub-sections.
There are two additional portions of the home page, the Engineering MyPostings area, and the Contact Panel. Both of those are controlled outside of the main index page for the home page. Instructions for editing these two areas are also listed below in order of appearance on the Engineering home page.
| Anchor | ||||
|---|---|---|---|---|
|
The Hero section contains three Button fields.
- Name: Displays the text in the button.
- URL: This field uses the Cascade internal-navigation button to create an internal link.
The Hero section is limited to three Button entries.
| Anchor | ||||
|---|---|---|---|---|
|
The Intro section contains the following fields:
- Headline: Displays the heading of the section under the image on the homepage.
- Lead: Displays the lead under the headline.
The Intro section also contains three Stats.
- Number: Displays what is usually a numerical stat (i.e. percentage, number, dollar amount, etc.). The symbol still has to be included, e.g. 75%.
- Blurb (first line): Displays second line, which is supporting text for the number.
- Blurb (second line), optional *: Displays second line, which is the continuation of the first line of text, if needed.
- Blurb (third line), optional *: Used optionallyonly for disclaimers or sources, displays a third line, which is the continuation of the second line of text, if neededtext. This will italicize the text.
* The second and third lines are helpful if you would like to control the break points of the text portion of a stat. If used, the text entered will be formatted in the same way as the first line of text entered.
The Stats can be reordered using the up and down arrows to the right of each button section.
The Intro section is limited to three Stats entries.
| Anchor | ||||
|---|---|---|---|---|
|
For purposes of this documentation we will chunk out each individual program within the Programs section into 3 sub-sections below:
- Program (Details)
- Program (Stats)
- Program (Courses)
The Programs section is limited to six entries.
Program (Details)
On the front-facing web page, when a user clicks on one of the six program cards, it swaps out all of the six cards with a panel of information for just the program that was clicked.
The details section of a Program has the following fields. The fields in blue type below are shared between initial page load (1st screenshot in middle column) and program information displayed once the user has selected/clicked a program (2nd screenshot in middle column).
For initial page load, the program cards are displayed:
(1st screenshot in middle column)
- Name (long): Displays the full program name in the card in large type.
- Degree: Displays the type(s) of degree above the Name (long).
- Icon: Icon class name for the program, displays the icon above the Degree and Name (long). All available icons can be viewed at http://www.sandiego.edu/brand/web-and-mobile/icons/
- Program Background Image: Used to link an image to the field. The image must be 640x360 pixels.
- Image Description (alt): Used for screen readers. Follow the directions for creating accessible image descriptions.
For selected/clicked program card, the program information panel is displayed:
(2nd screenshot in middle column)
- Name (Short, for Tab): Displays the tab text for the program, this should be the program's name shortened, but not abbreviated.
- Name (long): Displays the full program name in the card in large type.
- Degree: Displays the type(s) of degree above the Name (long).
- Program URL: Sets the link destination for the Explore Program button. It utilizes internal Cascade links only.
- Description: Displays a very short description/blurb for the program using a rich text field (WYSIWYG). Please limit to two sentences at most, and also include an internal Learn More link that points to the program's landing page in Cascade.
- Courses Link Text: Displays the link text in the panel's bottom, right-hand corner for navigating to a page with all of the program's courses.
- All Courses URL (if internal to Cascade) *: Use this page selector to internally select the program's course page from within Cascade.
- All Courses URL (if external, like PCE) *: Use this text field to copy and paste a URL from an external (non-Cascade) web page, such as PCE.
* Use one or the other of these two fields to link to a program's course page, but not both.
Program (Stats)
The Stats section of a program's information panel utilizes the following fields:
- Number: Displays the stat entered, can be alphanumeric and contain special characters.
- Blurb: Displays the number's accompanying text. Typically alpha characters only.
The Stats can be reordered using the up and down arrows to the right of each button section.
The Stats section is limited to four entries.
Program (Courses)
The Courses section of a program's information panel utilize the following fields:
- Image: Used to link an image to the field. The image must be 640x360 pixels.
- Image Description (alt): Used for screen readers. Follow the directions for creating accessible image descriptions.
- Number: Displays a courses alphanumeric designation, such as CS 101, GENG 201, etc.)
- Name: Displays the course's title.
- Description: Displays the course's description/blurb.
- Course URL (if internal to Cascade) *: Use this page selector to internally select the program's course page from within Cascade.
- Course URL Anchor (if internal to Cascade): Adds the anchor tag to the URL above to direct the user to the specific course on the comprehensive courses page. Use in tandem with the previous Courses URL (internal) field.
- Course URL (if external to Cascade, like PCE) *: Use this text field to copy and paste a URL from an external (non-Cascade) web page, such as PCE.
* Use one or the other of these two fields to link to a program's course page, but not both.
The Courses can be reordered using the up and down arrows to the right of each button section.
The Courses section is limited to three entries.
| Anchor | ||||
|---|---|---|---|---|
|
Each of the spotlights within the Spotlights section contains the following fields:
- Headline: Displays the text which appears on the very top of the spotlight.
- Subhead: Displays the text which appears just below the Headline.
- Quote: Displays the text entered into the plain text field.
- Author: Displays the author's name. Do not include the hyphen, it is added automatically. The data entered into this field also gets used as the image's alt description for accessibility.
- Image: Used to link an image to the spotlight. The image must be 640x360 pixels.
- Link Text: Displays the text used to link the user to another section, utilizing the URL field below.
- URL: Used to select the page within Cascade that this item will link to.
The Spotlights section can contain one or multiple spotlights. There is not a limit to the number of spotlights allowed.
| Anchor | ||||
|---|---|---|---|---|
|
The News and Events section of the homepage are dynamically fed from MyPostings. To learn more about which options in MyPostings to use to have your news and events display on the homepage, visit the Engineering MyPostings documentation.
| Anchor | ||||
|---|---|---|---|---|
|
The Why USD section has two initial fields that display before the Buttons:
- Headline: Displays the text which appears on the very top of the section.
- Subhead: Displays the text which appears as a lead just below the Headline.
Each of the four sections is divided into four Items, each of which contains the following fields:
- Image: Used to link an image to the item. The image must be 640x360 pixels.
- Image Description (alt): Used for screen readers. Follow the directions for creating accessible image descriptions.
- URL: Used to select the page within Cascade that this item will link to.
- Title: Displays the item's title, just below the photo. The title will link to whichever page is chosen for the URL field.
- Description: Displays the item's description/blurb using a rich text field (WYSIWYG).
The Items can be reordered using the up and down arrows to the right of each button section.
The Why USD section is limited to four entries.
| Anchor | ||||
|---|---|---|---|---|
|
The Personas section has two initial fields that display before the Buttons:
- Headline: Displays the text which appears on the very top of the section.
- Subhead: Displays the text which appears as a lead just below the Headline.
The three Buttons each contain the following fields:
- Name: Displays the text which appears on the button.
- URL: Used to select the page within Cascade that this item will link to.
The Buttons can be reordered using the up and down arrows to the right of each button section.
The Personas section is limited to three entries, referred to as Buttons.
| Anchor | ||||
|---|---|---|---|---|
|
The Contact Panel is controlled through the _site-setting-main block under the _site-settings folder. Contact Corinna Lewis by emailing michelles@sandiego.edu.
