Skip to main content

Photo Grid

Shared Partial Name:

wvu-photo-grid

When to Use

Use this to show profiles of students and/or faculty members.

Example 1: Standard Photo Grid

Do Eiusmod Tempor Incididunt Ut

Firstname Lastname

Title

Name of Organization

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.

View Profile: Do Eiusmod Tempor Incididunt Ut

Labore et Dolore Magna Aliqua

Firstname Lastname

Title

Name of Organization

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.

View Profile: Labore et Dolore Magna Aliqua

Example 2: Standard Photo Grid (3 Across)

Do Eiusmod Tempor Incididunt Ut

Firstname Lastname

Title

Name of Organization

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.

View Profile: Do Eiusmod Tempor Incididunt Ut

Labore et Dolore Magna Aliqua

Firstname Lastname

Title

Name of Organization

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.

View Profile: Labore et Dolore Magna Aliqua

Quis Nostrud Exercitation Ullamco Laboris

Firstname Lastname

Title

Name of Organization

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.

View Profile: Quis Nostrud Exercitation Ullamco Laboris

Content Model and Styling Guidelines

The following guidelines will help ensure your content and styling follow our design principles, and ensures consistency and unity across your pages as well as other WVU-branded websites.

Content-Specific Guidelines

Content Length Guidelines
Header*
  • Component Header
  • Maxiumum of 255 characters
A header that introduces the featured pages.
Subhead Maximum of 255 characters A more specific description of the content.
Item Photos N/A

A photo for each person.

Item Headers* Maximum of 255 characters

This should be a headline that has to do with the content you want to promote, for example an academic program, initiative, student organization, etc. Alternatively, you can use the name of the person being profiled.

Use a consistent amount of content for headlines and blurbs for each featured item.

Name N/A

If you don’t use the name of the person being profiled for the headline, include their name below.

Title N/A

The title (if a faculty member) or academic program and graduating class (if a student).

Item body* Maximum of 255 characters A short blurb about the persons.
Item CTA Maximum of 40 characters A button to view the person’s profile.

* Indicates required content.

Shared CleanSlate Partial

Type: Dynamic (pulls data from other pages in site)

This component corresponds to the latest version of the shared photo-grid partial in the Design System CleanSlate. CleanSlate developers can use this component by adding a shared partial to a template. Below are the available configuration options for this component.