Landing: Informational
This is the demo page for the Landing: Informational content type. This page template uses the unique Swoosh Hero and many components ideal for first level landing pages.
| Content Discovery | Interactive & Media | Text & Navigation |
|
|
|
Browse Demo Components
Below are examples of components available on the Landing: Informational content type. By the way, this is the Heading & Description component.
50/50
The 50/50 is a basic building block for webpages. This component uses the full width of the page to showcase text on one half of the page and a large image or ambient video on the other half.
50/50 (Ambient Video)
The 50/50 is a basic building block for webpages. This component uses the full width of the page to showcase text on one half of the page and a large image or ambient video on the other half.
Enhanced 50/50
Enhanced 50/50 (e50/50) is modeled after the standard 50/50, using half of the component width for text and the other half for a visual element. Additionally, the e50/50 can display public videos hosted on Vimeo or YouTube (unlisted or private will not display), as well as Lottie animation files.
The e50/50 is intended to display video content. Images do not display correctly in the e50/50 - Please use the regular 50/50 component for static images.
Animated 50/50
Animated 50/50 provides an interactive scrolling experience ideal for displaying rich images and text with three or more 50/50 components.
50/50 #3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Photo Feature: 2-Column
Headline 1
Photo Feature: 2-Column displays a prominent image and bold content as users scroll down the component. This component has text and links on one side and an image with a caption area on the other side.
Headline 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu.
User Choice Carousel
User Choice Carousel displays up to five content entries with large images and button style links. The left side lists the content headings while the right side displays associated images and description.
No. To create and manage content entries for this component, go to 'Content > Questions' in your content management system. While the content entries are labeled as "Questions", any type of content can be created.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu.
Description & Image Cards
Description & Image Cards displays content in two sections. The right side is organized as two columns of image cards that scroll within the component, while the left side displays header text and description.
Image Card 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus.
Image Card 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus.
Image Card 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus.
Image Card 4
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus.
Description & Card Carousel
Description & Card Carousel displays up to three content items at a time with optional arrows to rotate through additional sets of content.
Description & Summary Cards
Description & Summary Cards displays content in two sections. The right side is organized as two columns of text content with links (no images), while the left side displays header text and description.
Summary Card 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu.
Summary Card 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu.
Summary Card 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu.
Summary Card 4
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu.
User Choice Vertical Tabs
Block 1
User Choice Vertical Tabs displays bold headers with an associated image/video, description, and optional links.
Block 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus.
Block 4
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus.
Featured Summaries
Featured Summaries displays content in rows of three blocks. Each block contains a heading, description, image, and optional link.
Image Card 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus.
Image Card 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus.
This article can be displayed on pages using various news display components or the Feature: Internal Content component. When using the 'Headline Only Hero', make sure to add a Promotional Image. Promotional Images will display when an article is viewed inside components or on news listing pages.
Rollover Photo Grid
Rollover Photo Grid displays images prominently in rows of 3 with an optional title, description, and link.
Card 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Card 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Card 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Facts & Figures
Facts & Figures displays statistics and other key pieces of information with bold text, optional button style link and background color options.
Enhanced Photo Gallery displays a set of images and remotely hosted videos in various visual layouts. Each image/video can be clicked to view a fullscreen version with optional description, photo credit, and links.
Enhanced Photo Gallery displays a set of images and remotely hosted videos in various visual layouts. Each image/video can be clicked to view a fullscreen version with optional description, photo credit, and links.
Enhanced Photo Gallery displays a set of images and remotely hosted videos in various visual layouts. Each image/video can be clicked to view a fullscreen version with optional description, photo credit, and links.
Image 1 description can go here with rich text content.
Each location corresponds to an image selection on the left side of the component. Within each location, "slides" can be added to provide descriptions and additional images about interesting parts of the main image.
Each slide corresponds to a numbered pin that can be placed on the main image by clicking on the desired parts of the image inside the content editor.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie. Phasellus at dolor cursus, tristique justo eu, vestibulum arcu. Vivamus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in metus vitae ex condimentum molestie.
Program Finder
Program Finder provides an interactive link experience. This component uses the Program Type content type to create a multi-step user flow with guided links.
Cost Component
Cost component provides an interactive experience for users seeking undergraduate cost information. Site editors must create four "cost" entries for each desired school/location to cover the following cases:
• NJ Resident - Commuter
• NJ Resident - On Campus
• Out of State - Commuter
• Out of State - On Campus
People Collection
People Collection displays a vertical list of curated people's profiles. Each entry's content is associated with a Person content type and includes an optional contextual blurb and link.
Filtered Events Display (Featured)
Saturday, March 19, 2050, 11:00 a.m.-12:00 p.m. | Location name displays here, New Brunswick
Filtered Events Display (Filtered)
Saturday, March 19, 2050, 11:00 a.m.-12:00 p.m. | Location name displays here, New Brunswick
Saturday, March 19, 2050, 11:00 a.m.-12:00 p.m. | Location name displays here, New Brunswick
Saturday, March 19, 2050, 11:00 a.m.-12:00 p.m. | Location name displays here, New Brunswick
Filtered Events Display (Similar)
Saturday, March 19, 2050, 11:00 a.m.-12:00 p.m. | Location name displays here, New Brunswick
Saturday, March 19, 2050, 11:00 a.m.-12:00 p.m. | Location name displays here, New Brunswick
Saturday, March 19, 2050, 11:00 a.m.-12:00 p.m. | Location name displays here, New Brunswick
Filtered News Display (Featured)
This article can be displayed on pages using various news display components or the Feature: Internal Content component.
Filtered News Display (Filtered Summaries)
This content can be displayed on pages using various news display components.
This content can be displayed on pages using various news display components or the Feature: External Content component.
Filtered News Display (Filtered)
This guide provides an overview of how the RCCL works and essential steps for a website project.
This guide provides a walkthrough of a typical RCCL first-level landing page build.
This guide provides a walkthrough of a typical RCCL secondary page build.
This guide provides instructions for creating articles and news content in the RCCL.
This guide provides a walkthrough of a typical RCCL News landing page build.
This guide provides instructions for creating and managing events in the RCCL.
This guide provides instructions for creating and managing staff content in the RCCL.
This guide provides site administration tips and best practices to consider before launching your RCCL site.
Full Width Video Headline
Full-Width Video displays a remotely hosted video with an optional headline and description that spans the width of the screen. Videos must first be added to your content management's media library as "Remote Video" type before they can be used inside this component.
