Basic Foundations
Before you begin working on your site, it's important to understand the basic foundations of the CMS service. This is the starting point for all new Drupal users, but it can be beneficial for experienced users as well.
Universal Elements
To achieve a cohesive look among official university websites, universal elements are provided as a base for building sites in Drupal. They dictate branding and overall style.
These elements are mobile responsive so the presentation of a website will change depending on factors like display size and device type.
These are the items that appear identically on every page, categorized into Header, Navigation and Footer regions.
- Header: Appears at the top of every page, and is a universal element on every Drupal site.
- Navigation: Provides the functionality to traverse a site using menus that are available on every page. Navigation is automatically generated as you build your site and can accommodate up to 7 items.
- Footer: The footer is the bottom-most region of every page, and is a universal element on every Drupal site. Links are not customizable.
Page Templates
Each page type has slight variations that make them unique with specific content types available.
Academic Program
Introduce an academic program and draw attention to important course information in the hero region including application deadlines, associated college, related programs, degree type and more.
College Landing
Consider this your website’s homepage and leverage eye-catching paragraph types to showcase important information. Display latest news, events, blockquotes and more.
Marketing Landing Page
Planning to drive traffic to a specific page? Want to convert your audience quickly? Use this page type’s flexible hero space to embed a form and take advantage of paragraph types to embed videos, display key testimonials and more.
News
Use this page type to create news articles stored locally on your site.
Secondary
This image-heavy, full-width page type is great to use as the hub for your main navigation pages. Display Full-Width Images, draw attention to key points with Feature Panels and use Visual Router Grids to take traffic deeper into your site.
Tertiary
This page type is what typically makes up the bulk of your site. Leverage the sidebar region to share important links, use Rich Text for the majority of your content, incorporate Router Lists and more.
Content Types
Depending on the page template you choose, you’ll have the ability to add several content types to a page. Learn more about each below.
Accordion
Present related topics in a condensed format. Examples include FAQs, biographical information, and step-by-step processes.
Application Checklist
Present content in a checklist format with a scrollable content box beside each clickable checklist item.
Blockquote
Feature an impactful quote from a student, faculty member, alumnus, or other relevant sources.
Contact Card
Contact Cards are both a content type and a paragraph type. They exist as a content type to help facilitate reusable functionality. The Contact Card paragraph type allows content editors to place contact information for individuals, offices, or departments into the sidebar region of a page.
CTA Panel
Incorporate relevant calls to action as a means of moving visitors to the next meaningful step in their exploration process.
Embed Form
Place code for a form that is generated by a third party form platform onto a page within Drupal.
Events List
Incorporate relevant and timely event content on the page.
Faculty Listing
Place a list of faculty and staff members onto the page. The list can either be manually curated, or filtered by department(s).
Feature Panel
Preview a story, program, profile, activity, or initiative that supports the page content with an element that supports both an image and text.
From Library
Place reusable content on pages. It’s available for use in almost all editable regions of the various content types. Any other paragraph type can be turned into a piece of reusable content.
Full-Width Image
Place an image that takes up the full width of the container on the page. These images can be used to break up text-based content, and offer relevant visuals to the site visitor.
Hero
Designed to start the page with an impactful image or video that is relevant, high quality, and consistent with 好色先生TV's brand.
Horizontal Rule
Create a small visual break on pages with longer text-based content. It’s a simple red line placed in the content container. Explore the functional example below.
Image Carousel
Showcase photos of the campus, student life, events, and more.
News List
Display links to the latest news articles.
Pre-Footer
Designed primarily for use on College Landing pages, but can be used on other content types. It provides site visitors with a link to contact information, as well as a group of routing links to relevant information.
Related Links
Designed primarily for use on College Landing pages, but can be used on other content types. It provides site visitors with a link to contact information, as well as a group of routing links to relevant information.
RFI Form
Place a more stylized form onto a page. This paragraph type is primarily designed for use on admissions and academic program pages to encourage site visitors to request more information for the next step in their journey.
Rich Text
A flexible text region. It can contain headings, body copy, inline links, call to action buttons, lists, columns, and inline images.
Router List
Incorporate a list of links to route visitors to the next meaningful step in their journey. Examples include calls to action, program pages, or relevant offices/departments.
Router Panel
Incorporate a visual list of links to route visitors to the next meaningful step in their journey. Examples include calls to action, program pages, or relevant offices/departments.
Sidebar Rich Text (WYSIWYG)
A flexible content region for placing additional relevant information into the right sidebar region.
Split Column
Split the main content column into two side-by-side columns. This can be useful for two related lists, text on one side with a list on the other, or to help break up longer stretches of text content.
Stats Panel
Highlight three impactful statistics or rankings.
Stats & Stories Panel
Highlight compelling information about the university, its facilities, research and other initiatives. It uses a combination of stats, images, and text content to do this.
Table
Outline important data. This could be anything ranging from tuition rates to the results of research.
Testimonial
Feature an impactful quote from students, faculty, alumni, or other relevant sources.
Text Call Out
Highlight important information and provide calls to action for site visitors to take the next step in their journey.
Text Grid
Showcase related topics, with or without supporting copy. The grid can also function as a routing list with additional details.
Timely Update
Convey timely information and reminders. Use case examples include deadlines and schedule changes.
Vertical Slides
Provide a visually appealing carousel of images. The vertical stacking provides a unique experience for site visitors. It can be used to highlight events in chronological order, or other related information.
Video Embed
Incorporate video content to break up text-based content and offer engaging visual content to the site visitor.
Visual Router Grid
Create visual interest by adding images to a group of related links, with or without supporting description text.
