Example Components

Components are the various kinds of content you can insert into a band on a page. You may also find them referred to as cards or paragraphs. Most Components can be placed on both Landing Pages and Site Pages; examples of these are provided below. Some Components may only be placed on Landing Pages.

Most Components can be placed into any band/column configuration, but a few are restricted to maintain usability. If a Component would be rendered too small or too large to be usable in a particular column, it will not be listed among the Component menu options in that column. For example, on this Site Page you are exploring, the NC Map can only be placed into a one-column band. The NC Map would be too small to be usable in the narrower column width of the two-column band.

Explore examples of all the available Components on Digital Commons.



Callout

Callout Help

Example:

Person searching on phone with laptop on desk and search field overlayed in middle.

Usability testing is a research activity designed to evaluate the usability of a website by observing representatives from your key audience as they try to perform a set of realistic tasks. Testing a website with actual users allows developers to see what's working well for users and where they experience difficulty. The results of the test can be used by your team to improve the user experience.

Usability Testing and Other Services


Contact Card

Contact Card Help

Example:

State Employees' Credit Union

SECU Raleigh - Salisbury St.
ATM Options: Accepts Deposits, 24 Hour Service



iFrame Embed

iFrame Embed Help

Example:

An iFrame Embed can display all kinds of content. This example displays a Google Calendar for the North Carolina Virtual Public School. 


NC Map

NC Map Help

Example:



Quick Links

Quick Links Help

Example:


Statistic Card

Statistic Card Help

Example:

0

North Carolina Websites

On the Digital Commons Platform


Tabs/Accordion

Tabs/Accordion Help

Examples:

Content Displayed as Tabs

Tab/Accordion Items

Brown alpacas in a field.

Black bear in a green, grassy meadow chewing on plants.

Mother cheetah resting but alert on top of a dirt mound with two cubs.

Content Displayed as Accordion

Tab/Accordion Items

Brown alpacas in a field.

Black bear in a green, grassy meadow chewing on plants.

Mother cheetah resting but alert on top of a dirt mound with two cubs.

Text Component

Text Editor Help

Example:

Text Component

Three illustrated people place content on a laptop screen to evoke the concept of website design.

Format text with bold, italics, and bulleted or numbered lists. Include links, tables, and various media, as desired. Provide iFrame content, if necessary.


Video Card

Video Card Help

Example:

April 9, 2024

Configuring Email Notification for your Webforms

This video walks through the process of setting up your webforms so end users and agency contacts will receive an email notification when data is submitted.


View Embed

View Embed Help

Example:

Custom Views can be embedded into a page. This example displays the most recently published Blog Entry in a block.


Webform Embed

Webform Embed Help

Example:

Custom Webforms can be embedded into a page. Submitting the Webform below registers the user to receive the monthly What's New from Digital Commons newsletter

Newsletter Sign-up

On This Page Jump Links
On

This page was last modified on 09/30/2025