Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Page Top Paragraphs: Hero Banner, Detailed Title and Center Page Title
There is a Hero Banner paragraph available for the top of the page - it will display one image (and includes an area where a second, mobile sized/cropped image can be uploaded) as well as a Title, Caption and a Link Button that will be displayed in a semi-transparent black box in the left hand corner of the banner image. This paragraph should be used only for home or hub pages. Below the header/banner area, there are two display options for the subtitle section at full width - first is the 'Detailed Title' display which incorporates navigation and social to the left with the page title and subtitle to the right. Below the 'Detailed Title' you can see the title and subtitle displayed using the 'Center Page Title' component which should only be used for hub pages or landing pages.
This is the Title for Column 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
This is the Title for Column 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
2 Column Text
The 2 Column Text paragraph includes a heading, which can be a link, as well as a text input area that can accommodate links and images for each of the columns. While this paragraph offers a different layout for displaying text, it should not be used for large quantities of content.
3 Item Graphical Callout
This paragraph contains three image areas with the ability to add text and a link/link text that will be displayed over a semi-transparent black box. Though it is one of the more simple paragraph, this area can be used in many different ways. For example, it could be used to promote or draw attention to special or timely initiatives within your unit, link to affiliated units/labs/centers or create paths for users to content or actions you want them to take.
Brag Box
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Brag Box
The Brag Box is an excellent way to call attention to information - particularly statistics or accolades. The content in the slider itself should be concise and limited to one line of text.
2
This is a 2 column gridder item.
#ffffff 1
4
This is a 3 column gridder item.
#ffffff 1
Gridder
This is an example of the Gridder paragraph. This is one of the more complex paragraphs available in the system - each gridder item allows for a Grid Title, which appears in yellow, a Grid Subtitle, which will be below the title in white, a background image, and a link. The text and URL fields are optional (ie - you can use just the Title or Subtitle and you can either use the boxes as links or as a way to display static content) and should use the purple boxes with darker purple geometric patterns available in the Media Browser. It is also possible to control the number of columns each gridder item spans; a row of gridder boxes is four columns wide and an individual gridder item can span as small as one up to all four spaces. You control this using the Grid Columns dropdown included with each gridder item.
This is the body content for the image left paragraph. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Left Image
Left Image includes four fields: Title, Body, Link, and Image. The paragraph is displayed in a half and half layout with the image on the left and the rest of the fields displayed on the right; the Body section will allow for links in the body copy but the link field itself creates a larger, purple link at the bottom of the body copy with a left facing carrot at the end.
Four-Column Grid
4 Column Grid
This paragraph accepts simple images with optional associated links.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Image Right Paragraph
This is a very simple paragraph which allows for body text to be input and displayed on the left side of the layout with an image on the right.
Quoted Video
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Learn, Live, Thrive and Succeed at UAlbany
Quoted Video
The Quoted Video paragraph includes inputs for a Video URL, a Title, a Body and a Button link. The video will always display on the left for full screen, then will drop below the text for mobile. In order to embed the video on the page all you will need is a URL for where the video is hosted.
Shadow Links
This paragraph includes up to four areas with URLs and link text over a full width background. We recommend that this piece is used to create user paths to 'next step' content in your site.
Office/Department Name
Contact First Name Contact Last Name
Contact Title
Building & Room Number
1400 Washington Avenue
Albany, NY 12205
United States
Email
Phone
Map Contact
The Map Contact paragraph provides an area for your unit to display your contact information. The paragraph will first ask you for specific contact information (phone, email, location) to be displayed on the right and then a latitude and longitude to display a pin on a map on the left.
Stats
1
A stats item
With an icon/image
3
another item
Stats
This paragraph allows you to put in both images as well as numbers and facts in a card layout. If you add more than three items, they will begin to wrap into a second row. The paragraph will resize the cards to all be the same height and width based on the content that is input.
Ranking Box
#20
Headline
Subheadline
Description
Year
Source
Headline
Subheadline
Description
Year
Source
Ranking box
This paragraph allows you to create a row of boxes for rankings or any other statistic with space for an icon or a number.
CSS Styling Options
You will notice an area under many of the paragraphs titled 'CSS Styling Options' with a number of checkboxes to choose from. These different options give you a measure of control over how the paragraph will be displayed on the page. The options which reference padding or margin allow you to add space at the top or bottom (padding top, padding bottom) or to move your component up higher (negative margin top). You also have the option to include the Grey, hexagonal pattern as a background either behind the entire component or just parts of the paragraph.