Explore
Our
Visit Options

Web Style Guide

Integrated Marketing and Communications Resources / Web Style Guide

Optional Intro Headline

You can add this intro section by adding the "smcm-intro-section" class to any widget that contains an h2 and span element.

Wooden chairs sit on a grassy shore overlooking a marina with rows of docked sailboats at sunrise or sunset.

Use the “SMCM Gold Buttons” widget to create a section of jump links at the top of your page.  Jump links work by assigning a “Row ID” under attributes and using “#yourid” as the link on your button.  The gold buttons will automatically display an icon corresponding to the type of link they point to.

Emphasized section title

Use the “SMCM Title” widget to create a section title, optionally with an emphasized word.

Three people stand on a dock by the water; one is in a St. Mary’s Seahawks mascot costume, and the others wear a St. Mary’s shirt and a green patterned shirt. Sailboats are in the background.

The zig-zag layout

The alternating image and text layout is a great way to showcase eye catching imagery and important content.  On mobile these columns become stacked, to ensure the image is always on top select Row Settings > Layout > Collapse Order > “Right On Top” for rows where the image is on the right.

Call to action

The “SMCM Call to Action” widget allows you to create a clickable button for important links such as a registration.

A woman wearing headphones and smiling sits at a desk with a laptop in a classroom filled with other students.

Fact & Highlight Cards

2

Fact card options to choose from

SMCM Highlight Card

This card allows for a highlighting an item using an image, title and supporting text field.  These cards also support links

4

Different styles to choose from.  The SMCM Fact and Highlight cards support 5 different styles (red, navy, light blue, gold and transparent).

SMCM Highlight Card

This card allows for a highlighting an item using an image, title and supporting text field.  These cards also support links

Quote Block

"I loved my time at St. Mary's, and I took advantage of a lot of opportunities to get involved on campus."

- Taylor Schafer '15 MAT '16

A woman stands by an outdoor chalkboard teaching a group of students, with diagrams and text visible on the board. The students are seated or standing, listening and taking notes.

Accordion

Use the SMCM Accordion widget to help users digest a large amount of content.  A great example of this is making an accordion for each question on a FAQ page.

SMCM Accordion

The SMCM Accordion Widget supports an optional icon shown before the title.

SMCM Accordion

This widget also supports being open by default.

Latest Events

Illustrated poster for College Sailing Nationals at St. Mary's College of Maryland, featuring sailboats, event dates, and cartoon sea creatures.

St. Mary's College of Maryland Sailing Hosts ICSA Women's Fleet Race National Championship, May 20-23

May 20 – 23, All Day

Flyer announcing a mobile library and Happy Lumpia food truck visit at DPC Circle on May 28, 2025; library hours 1-2 p.m., food served 11 a.m.-1 p.m.

Mobile Library on Campus, May 28

May 28, 11 a.m. – 2 p.m.

Dumpstaphunk, Carly Harvey and Kelly Bell Band

Mulberry Music Festival 2025

June 20, 6 – 9:15 p.m.

The latest events block can be used to display future events for a specified category (department, major, office, etc).

Slider

  • A woman wearing headphones and smiling sits at a desk with a laptop in a classroom filled with other students.

    This is an example of a caption on a slide

  • A woman stands by an outdoor chalkboard teaching a group of students, with diagrams and text visible on the board. The students are seated or standing, listening and taking notes.

    Another caption

  • Three people stand on a dock by the water; one is in a St. Mary’s Seahawks mascot costume, and the others wear a St. Mary’s shirt and a green patterned shirt. Sailboats are in the background.

    Sliders suport multiple items

The “SMCM Slider” widget is used to showcase multiple images in a condensed format.

Other Resources

Other helpful resources for creating content on the web.

smcm campus view

List of SMCM Widgets

  • SMCM Accordion
  • SMCM Button
  • SMCM Card Container
  • SMCM Gold Buttons
  • SMCM Quote
  • SMCM Slider
  • SMCM Title
A dropdown menu titled "Add Widget to Column" displays widget options filtered by the text "smcm" typed in the search box.

Contact Us

Integrated Marketing

Calvert Hall, 2nd Floor
Meet the Staff
(240) 895-2045
communication@smcm.edu

Forms

Media Release