Optional text (Name Tag)
Landing: Informational
Important: Best to use 350 characters or less. Space limited to 550 characters max with spacing and HTML markup. This template is the only template that offers the Hero-Swoosh, with either a white or red background. Add the required image. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque cursus, dolor et sollicitudin volutpat, justo purus dignissim enim, quis convallis tortor arcu et velit. Ut viverra felis.
Animated 50/50
The Animated 50/50 component is a series of 50/50s, each added individually within this component, where text scrolls up on the left and images fade in on the right as the user scrolls. The component takes an unlimited amount of text.
Components available on the Landing: Informational:
- 50/50
- Animated 50/50
- Cost Component
- Description & Card Carousel
- Description & Image Cards
- Description & Summary Cards
- Descriptive Links
- Facts and Figures
- Filtered Events Display
- Featured Summaries
- Filtered News Display
- Full-width Image
- Full Width Video
- Heading and Description
- Link Grid
- Location Map
- People Collection
- Photo Feature: 2-Column
- Program Finder
- Rich Text
- Rollover Photo Grid
- Social Media
- Sticky Promo
- Tabbed Link Grid
- Transition
- User Choice Carousel
- User Choice: Vertical Tabs
Another 50/50
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ut elementum diam. Aenean fringilla iaculis est, eu posuere nisi aliquet eget. Phasellus et imperdiet augue, ut tristique arcu. Ut eu auctor est, at sollicitudin tellus. Phasellus rutrum finibus leo vitae tempor. Maecenas accumsan est velit, a tempus arcu malesuada commodo.
Another 50/50
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ut elementum diam. Aenean fringilla iaculis est, eu posuere nisi aliquet eget.
- Phasellus et imperdiet augue, ut tristique arcu.
- Ut eu auctor est, at sollicitudin tellus.
- Phasellus rutrum finibus leo vitae tempor.
Maecenas accumsan est velit, a tempus arcu malesuada commodo.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Morbi ut elementum diam. Aenean fringilla iaculis est,
- eu posuere nisi aliquet eget. Phasellus et imperdiet augue,
ut tristique arcu. Ut eu auctor est, at sollicitudin tellus. Phasellus rutrum finibus leo vitae tempor. Maecenas accumsan est velit, a tempus arcu malesuada commodo.
Filtered Events Display (w/Display ID: Filtered, Set Argument to Term ID)
Wednesday, January 01, 2025, 3:46 p.m.-Saturday, March 01, 2025, 3:46 p.m. | New Brunswick
Saturday, April 05, 2025, 11:00 a.m.-3:30 p.m. | Add Location Name, New Brunswick
Sunday, August 30, 2026, 9:00 a.m.-Monday, August 30, 2027, 9:00 a.m. | Rain Forest Pike
Filtered Events Display -- Featured Display ID
Filtered Events Display -- Similar Display ID
Wednesday, January 01, 2025, 3:46 p.m.-Saturday, March 01, 2025, 3:46 p.m. | New Brunswick
Saturday, April 05, 2025, 11:00 a.m.-3:30 p.m. | Add Location Name, New Brunswick
Sunday, August 30, 2026, 9:00 a.m.-Monday, August 30, 2027, 9:00 a.m. | Rain Forest Pike
Featured Summaries
Optional description with limited WYSIWIG. You can add as many Feature Cards as you'd like below. All cards will show.
This is a summary. Note: A promotional image isn't necessary when using the hero - with headline on image. The image used in the hero will be automatically pulled into components where this article is pulled into.
This is a summary. Note: A promotional image isn't necessary when using the hero - with headline on image. The image used in the hero will be automatically pulled into components where this article is pulled into.
This is a summary. Note: A promotional image isn't necessary when using the hero - with headline on image. The image used in the hero will be automatically pulled into components where this article is pulled into.
This doesn't work. I am able to call in an external card here into the Link space. But I can customize the image and title of the item. Bug identitified, if I use the link space, I can call in an external content type, but it is linking to the External CT node and not the "link" field in the node, which generates a page inaccessible message.
This doesn't work either. Here is a description. Testing to see if I link to external CT using /node/# in the link field. The link comes up as not accessible.
Use the Image Card: Curated to feature an event in the Featured Summaries Component. To do so, in the Link field, simly link to your event node. Use a referential link, such as this "/event/sample-event," instead of this "http://rccldemo.rutgers.edu/event/sample-event," if working on a development environment.
This is a summary. Note: A promotional image isn't necessary when using the hero - with headline on image. The image used in the hero will be automatically pulled into components where this article is pulled into.
This is a summary. Note: A promotional image isn't necessary when using the hero - with headline on image. The image used in the hero will be automatically pulled into components where this article is pulled into.
This is a summary. Note: A promotional image isn't necessary when using the hero - with headline on image. The image used in the hero will be automatically pulled into components where this article is pulled into.
Photo Feature: 2-Column
Photo Feature: 2-Column
First Descriptive Link
The headline and the black flyout caption over the image are required. You can display the photo on the left or right side of the text. CTA links are available but optional. The individual descriptive links fly up from the bottom of the component. The background color is white.
Second Descriptive Link
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.
Third Descriptive Link
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
Facts and Figures (optional headline)
Description (optional description).
There are seven available background colors (red, white, teal, light gray, black, blue, and dark gray).
150+
Undergraduate majors
400+
Graduate programs
Top 25
Public university in the U.S.
Description & Summary Card
This optional description remains sticky as the user scrolls. Styling available: Bold, italics, super- and sub-script, remove formatting, add anchor, paste as plain text.
Summary Card 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tincidunt feugiat lectus, vitae lacinia sem hendrerit quis. Vivamus elit purus, rutrum quis neque et, egestas consequat augue. In molestie vehicula nisi non vehicula. Pellentesque dapibus et magna sed congue. Cras gravida dignissim mattis. Vivamus cursus nibh ante, eget facilisis arcu.
Summary Card 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tincidunt feugiat lectus, vitae lacinia sem hendrerit quis. Vivamus elit purus, rutrum quis neque et, egestas consequat augue. In molestie vehicula nisi non vehicula. Pellentesque dapibus et magna sed congue. Cras gravida dignissim mattis. Vivamus cursus nibh ante, eget facilisis arcu.
Summary Card 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tincidunt feugiat lectus, vitae lacinia sem hendrerit quis. Vivamus elit purus, rutrum quis neque et, egestas consequat augue. In molestie vehicula nisi non vehicula. Pellentesque dapibus et magna sed congue. Cras gravida dignissim mattis. Vivamus cursus nibh ante, eget facilisis arcu.
Summary Card 4
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tincidunt feugiat lectus, vitae lacinia sem hendrerit quis. Vivamus elit purus, rutrum quis neque et, egestas consequat augue. In molestie vehicula nisi non vehicula. Pellentesque dapibus et magna sed congue. Cras gravida dignissim mattis. Vivamus cursus nibh ante, eget facilisis arcu.
Summary Card 5
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tincidunt feugiat lectus, vitae lacinia sem hendrerit quis. Vivamus elit purus, rutrum quis neque et, egestas consequat augue. In molestie vehicula nisi non vehicula. Pellentesque dapibus et magna sed congue. Cras gravida dignissim mattis. Vivamus cursus nibh ante, eget facilisis arcu.
Summary Card 6
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tincidunt feugiat lectus, vitae lacinia sem hendrerit quis. Vivamus elit purus, rutrum quis neque et, egestas consequat augue. In molestie vehicula nisi non vehicula. Pellentesque dapibus et magna sed congue. Cras gravida dignissim mattis. Vivamus cursus nibh ante, eget facilisis arcu.
Description & Card Carousel
Optional description. Ideally, add content in sets of 3 or at least 3 items to start. Add bold, italics, links, anchors, super- and sub-script. Add Feature: Internal Content, Image Card: Curated, and Feature: External Content You can hide the summary of each card by checking a check-box so that the content appears consistently.
Description & Image Cards
This optional description remains sticky as the user scrolls. Styling available: Bold, italics, super- and sub-script, remove formatting, add anchor, paste as plain text.
Optional text (Name Tag)
Optional text (Name Tag)
Optional text (Name Tag)
Optional text (Name Tag)
Optional text (Name Tag)
Filtered News Display Title
The Emmy Award-winning actress and alumna encouraged members of the Class of 2023 to chase their dreams and find their voice in a passionate speech that started with her singing and taking a selfie with the crowd.
In a special graduation feature, senior Kara VanDooijeweert interviewed commencement speaker and Emmy-winning alumna Sheryl Lee Ralph about how her time at Rutgers shaped her career.
This summer, with a bachelor’s degree in public policy and economics in hand, Sara Rubiano will start working as a private banking analyst at JPMorgan’s International Private Bank.
After being involved with political campaigns on and off campus, Shakee Merritt says he is now working on launching the GENNEX Political Action Committee, “a PAC dedicated to educating, empowering, and energizing Generation Z to run, vote and partake in the democratic system one hundred percent.”
On the cusp of Commencement, graduates from the class of 2023 reflect on what they’ll miss about Rutgers and lessons they’ll take with them from the university as they start the next chapter of their lives.
Rich Text
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tincidunt feugiat lectus, vitae lacinia sem hendrerit quis. Vivamus elit purus, rutrum quis neque et, egestas consequat augue. In molestie vehicula nisi non vehicula. Pellentesque dapibus et magna sed congue. Cras gravida dignissim mattis. Vivamus cursus nibh ante, eget facilisis arcu.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tincidunt feugiat lectus, vitae lacinia sem hendrerit quis. Vivamus elit purus, rutrum quis neque et, egestas consequat augue. In molestie vehicula nisi non vehicula. Pellentesque dapibus et magna sed congue. Cras gravida dignissim mattis. Vivamus cursus nibh ante, eget facilisis arcu.
Heading and Description - Required Headline
Add text here. Often used for introductory copy. Optional description. The required headline may be hidden if you only want to use this component to show text and not a large title. This component can be displayed in 3 orientations: vertical, horizontal, and vertical-animated.
50/50
- Add description here. Unlimited character count. Although, keep i mind that the image scales automatically to the length of the text. If using a lot of text, it is better to select one of the text type components or an animated 50/50. WYSIWIG editor options: bold, italics, superscript, subscript, remove formatting, add a link, remove link, add an anchor, bulleted-list, numbered-list, paste as plain text.
- Add an image or ambient video. Image layout options: on the right or left.
- Add formatted linked list (for bolder links)
- Add up to 1 Call To Action button
- Color options for text background: white, black, blue, red, teal, light gray, dark gray
Social Media - Original Code
Follow Us