Snippets

Snippets are pre-formatted widgets that you can drop onto your page and populate with your own content.

Select a snippet to see how it functions.

Accordions/Tabs

Accordions and tabs provide a way to vertically stack items that can be clicked to reveal or hide content. While shortening page content and hiding some content can make a page seem less daunting, they are not a one-size-fits-all solution.

Forcing users to click on hidden content increases interaction cost. If users don't find relevant information under accordion, they may ignore or feel it was wasted time. Instead, consider using headings, allowing user to scroll your well-organized webpage.

Do not use accordions/tabs within each other. This makes it difficult to navigate your site, especially on a phone. 

Anything can be added to tabs including images, video and bulleted lists. Tabs appear as accordions on mobile devices.

Anything can be added to tabs including images, video and bulleted lists. Tabs appear as accordions on mobile devices.

Anything can be added to tabs including images, video and bulleted lists. Tabs appear as accordions on mobile devices.

Anything can be added to tabs including images, video and bulleted lists. Tabs appear as accordions on mobile devices.

Blockquote

A branded quote that editors can style with green text to provide impact. Quotes need to include a cited name.

There is an old saying that things don’t happen they are made to happen.President John F. KennedyUND Fieldhouse
September 25, 1963

Columns

Use this snippet to separate content into columns within the Main Content.

On mobile, columns will stack rather than appear side by side. 

CourseLeaf Courses

CourseLeaf Courses Manual List and CourseLeaf Courses by Subject allow you to automatically pull course descriptions from the catalog to your page. Choose either the Manual List to choose specific courses, or the Courses by Subject to list all.

UNIV 110. First Year Seminar. 3 Credits.

This seminar course is specifically meant to help first-year students make a successful transition to college, and has been designed to engage students in the academic life of the university through the study of a topic ot theme. To accomplish these goals, students in this course will consider and practice being reflective about their own learning, being an active and engaged learner, and studying effectively. Only students in their first year at UND may register for this course. Prerequisite: Only students in their first year at UND may register for this course. On demand.

Embed Video - Basic

Embed a video using basic styles from your video source. Add the video by selecting the Insert/Edit Video icon in the editor.

Embed Video - Styled

Embed a Youtube or VImeo video with UND styles, allowing editor to choose the thumbmail, UND play button and video that opens and plays in a lightbox. Add the video by pasting in the addres bar URL of the video (not the embed URL).

Description Play media

Events Listing

Automatically pull in events from UND calender. Contact Web Team to assist setting up snippet widget code.

Events

more Events

Feature

Link style with options for display (color, photo, no photo or callout line). 

Gray With Image

Limit the amount of text in this area. Too much text will cut off the link on some devices.

Button Link
Black No Image

Limit the amount of text in this area. Too much text will cut off the link on some devices.

Button Link
Gray No Image

Limit the amount of text in this area. Too much text will cut off the link on some devices.

Button Link

Image Styling

Style your image with alignment (right or left), optional caption and white space. Images can vary in size. The recommend max width and height is 400 px.

This is a caption. Users are more likely to stop and read your caption.

News Blocks

Manually curate list of news with links and images. Each block must link to an individual news item.

Prospective Medical Students 1

Prospective Medical Students 2

Prospective Medical Students 3

Prospective Medical Students 4

People Listing

There are two snippet options to list people.

  1. Choose People Listing (Manual) to manually curate your people list. Fields can be customized as needed.
  2. Choose People Listing (Automatic) to pull in employee data from PeopleSoft and HR automatically. This listing will automatically update as employees are changed in PeopleSoft and as they update their own profiles.
No Photo
FirstName LastName
Department Name
No Photo
FirstName LastName
Department Name

RSS Feed

Add a news or blog feed through RSS. Blogs are a common RSS sources. Items can be displayed as list or card format. Photo, date, time and description can be turned on or off.

First in the world
First in the world
Already home to world's most successful Indigenous medical training program, UND adds world's first doctoral program in Indigenous health
1/28/2020
4:19PM
Air Traffic Control hiring reform: What it means for UND
Air Traffic Control hiring reform: What it means for UND
Passage of Hoeven-led legislation, via defense bill, gives vital boost to UND's Air Traffic Management program
1/28/2020
4:17PM
Closing the Latinx achievement gap in engineering
Closing the Latinx achievement gap in engineering
It can be done, suggested Professor Rachel Navarro, in presenting her research as part of the UND Faculty Lecture Series
1/28/2020
4:11PM
State of the State address: Info for visitors
State of the State address: Info for visitors
Gov. Burgum will give annual address on campus Wednesday morning
1/28/2020
4:10PM
First in the world
First in the world
Already home to world's most successful Indigenous medical training program, UND adds world's first doctoral program in Indigenous health
1/28/2020
4:19PM
Air Traffic Control hiring reform: What it means for UND
Air Traffic Control hiring reform: What it means for UND
Passage of Hoeven-led legislation, via defense bill, gives vital boost to UND's Air Traffic Management program
1/28/2020
4:17PM
Closing the Latinx achievement gap in engineering
Closing the Latinx achievement gap in engineering
It can be done, suggested Professor Rachel Navarro, in presenting her research as part of the UND Faculty Lecture Series
1/28/2020
4:11PM
State of the State address: Info for visitors
State of the State address: Info for visitors
Gov. Burgum will give annual address on campus Wednesday morning
1/28/2020
4:10PM

Snapshot

The snapshot snippet inserts a feature to highlight programs, courses, events, etc. Add/delete rows as needed.

Program Title 
Program type:
Full-time or part-time
Format:
On-campus or online
EST. time to complete:
2 years
Credit hours:
30 (Thesis Option) or 32 (Non-Thesis Option)

Stats

Animated on scroll, call out certain numbers that can add emphasis to your page.

75%

Lorem ipsum dolor sit amet, consectetur adipi scing elit. In nulla metus, vulputate placerat lorem eget

2k+

Lorem ipsum dolor sit amet, consectetur adipi scing elit. In nulla metus, vulputate placerat lorem eget

12:1

Lorem ipsum dolor sit amet, consectetur adipi scing elit. In nulla metus, vulputate placerat lorem eget

50 

Lorem ipsum dolor sit amet, consectetur adipi scing elit. In nulla metus, vulputate placerat lorem eget

Table

Use the table snippet to show data in a mobile-friendly view. The table snippet has both horizontal and vertical heading options. Do on use tables to format images and text; use the column snippet instead.

Column Title 1 Column Title 2 Column Title 3
Row 1 Column 1 Row 1 Column 2 Row 1 Column 3
Row 2 Column 1 Row 2 Column 2 Row 2 Column 3
Row Data A Row 1 Column 2 Row 1 Column 3
Row Data A Row 2 Column 2 Row 2 Column 3
Row Data A Row 2 Column 2 Row 2 Column 3