Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.


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 at usually located near the very bottom of the Explorer.

Image RemovedImage Added



Editing the Home Page

Once selected, click the Edit button to begin editing the page.

Image RemovedImage Added



Sections

The Engineering homepage is divided into five sections:

SpotlightPersonas

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

Footer

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.

Image Removed


Image Added
Image Added




Anchor
hero
hero
Hero

The Hero section contains three Button fields.

  • Text

    Name: Displays the text in the button.

  • URL

    Type

    :

    Determines whether the URL is internal to Cascade or external.Internal or External URL: This field depends on which option is select for URL Type. If Internal is selected, then this field will use

    This field uses the Cascade internal-navigation button to create an internal link

    . Otherwise, if External is selected, a field will appear so that you can copy and paste a URL from an external website

    .

The Hero section is limited to three Button entries.

Image Removed

Image Removed

Image Added
Image Added




Anchor
intro
intro
Intro

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

    optionally

    only for disclaimers or sources, displays a third line, which is the continuation of the second line of text

    , if needed

    . 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.

Image Removed
Image Removed

Image Added
Image Added




Anchor
programs
programs
Programs

For purposes of this documentation we will chunk out each Each individual program within the Programs section into 3 is displayed in the three sub-sections below:

  • Program (Details)

  • Program (Stats)

  • Program (Courses)

The Programs section is limited to six entries.

Image RemovedImage Added





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 (Short, for tab): Displays the program name in the intra-navigation tab.

  • Name (long): Displays the full program name in the card in large type.

  • DegreeDisplays 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/. CAUTION: These icons are not linked. If you change it here, each icon through the site will have to be manually updated to match.

  • Program Background Image: Used to link an image to the field. The image must be 640x360 pixels. These images are linked to multiple areas of the site. So to update the image, you should go to the image asset and update it, then publish to all the relationships.

  • 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.

  • DegreeDisplays 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.Image Removed

Image Added

Image Removed

Image Added
Image RemovedImage Added


Program (Stats)

The Stats section of a program's information panel utilize 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.Image Removed

Image Added
Image RemovedImage Added


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.

Image Removed

Image Removed

Image Added
Image Added




Anchor
spotlights
spotlights
Spotlights

This section is not connected to MyPostings.

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

    uses

    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

    Text: Displays the text used to link the user to another section, utilizing the

    URL

    “Spotlights Listing URL” field below.

  • Spotlights Listing URL: Used to select the page within Cascade that this item will link to.

  • Detail Page URL: Used to override the “Spotlights Listing URL” if user wants a spotlight’s arrow link to point to a specific URL.

The Spotlights section can contain one or multiple spotlights. There is not a limit to the number of spotlights allowed.

Image Removed

Image Removed

Image Added

Image Added



Anchor
mypostings
mypostings
MyPostings

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.


Image RemovedImage Added





Anchor
whyusd
whyusd
Why USD?

The Why USD section has two initial fields that display before the Buttonsimages:

  • 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 Why USD has four sections. Each section is divided into four Items, each of which "items." Each item 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. This element can only use URLs internal to Cascade.

  • 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 area is limited to four entries.

Image Removed

Image Removed

Personas

The Personas sections.

Image Added
Image Added




Anchor
personas
personas
Audiences

The Audiences 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
  •  This section can only use URLs internal to Cascade.

Do not reorder the items in this section.

The Personas Audiences section is limited to three entries, referred to as Buttons.

Image Removed

Image Removed

Image Added
Image Added




Anchor
contact
contact
Contact Panel

The Contact Panel is controlled through the _site-setting-main block under the _site-settings folder. Contact Corinna Lewis by Michelle Sztupkay by emailing michelles@sandiego.edu.

Image RemovedImage Added