Style Guide - Full-Width Components

This page of Full Width Callout Block examples will help in understanding how to add them to pages throughout the site below the page content.

Available Full Width Callout Blocks

Content Blocks w/Photo Carousels Events Carousel Featured Custom Event/News Callout
Large Photo Carousel Link List Media Gallery Grid
Multi-Column Text Callouts (Red) News & Events News Headlines
People Carousel Story Callouts with Sidebar Story Carousel
Text Callouts with Red Sidebar Tips & Answers Triple-Column Image Callouts

Some helpful tips:

  • Full width callout blocks can be stacked and rearranged. Click the blue crosshair arrows on a callout card, and drag to reorder them. They will automatically stack on the published page.
  • When editing, pay attention to gray help text for tips throughout BigTree.
  • Avoid trapped white space--full-width callout blocks start below the navigation menu on the right side (on large browser screens.)
  • Student quotes are good to use in callout blocks.

Content Blocks w/ Photo Carousels

Introduction Links

Blocks

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id ligula porta felis euismod semper.

Links

Photo

Caption

Optional Video

Caption

Watch the Video

Events

Events can be pulled by category within BigTree CMS. Optionally, if no category is selected any upcoming events will be pulled in. Make sure events stay up to date. The Events Carousel should always have two links: one to more information and another to the full calendar.

January 15

Ohio Wesleyan University Women's Basketball at Kenyon

6 p.m. – 8 p.m.

More Information

January 15

Ohio Wesleyan University Men's Basketball vs Wabash

7 p.m. – 9 p.m.

More Information

January 17

Ohio Wesleyan University Women's Swimming & Diving at Bluffton

6 p.m. – 9 p.m.

More Information

January 17

Ohio Wesleyan University Men's Swimming & Diving at Bluffton

6 p.m. – 9 p.m.

More Information

January 17

Ohio Wesleyan University Women's Swimming & Diving vs Ohio Northern

6 p.m. – 9 p.m.

More Information

January 17

Ohio Wesleyan University Men's Swimming & Diving vs Ohio Northern

6 p.m. – 9 p.m.

More Information

January 18

Ohio Wesleyan University Wrestling at Spartan Mat Classic

9 a.m. – 12 p.m.

More Information

January 18

Ohio Wesleyan University Women's Track & Field at Wooster Invitational

12 p.m. – 3 p.m.

More Information

January 18

Ohio Wesleyan University Men's Track & Field at Wooster Invitational

12 p.m. – 3 p.m.

More Information

January 18

Ohio Wesleyan University Women's Basketball vs Wooster

1 p.m. – 3 p.m.

More Information

January 18

Ohio Wesleyan University Men's Swimming & Diving vs Wooster

1 p.m. – 4 p.m.

More Information

January 18

Ohio Wesleyan University Women's Swimming & Diving vs Wooster

1 p.m. – 4 p.m.

More Information
Action Link Title

Featured Custom Event / News Callout

Secondary Title Date

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id ligula porta felis euismod semper.

Link

Large Photo Carousel

You can caption your photos. Try to avoid text overlay on photos. 

Additional Image

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum.

Link List

Media Gallery Grid

Image— Can have more than 5 pictures--just set your photos to randomize

Image

Can have more than 5 pictures--just set your photos to randomize
YouTube Video— Caption

YouTube Video

Caption
Image— Can have more than 5 pictures--just set your photos to randomize

Image

Can have more than 5 pictures--just set your photos to randomize
Image— Can have more than 5 pictures--just set your photos to randomize

Image

Can have more than 5 pictures--just set your photos to randomize
Image— Can have more than 5 pictures--just set your photos to randomize

Image

Can have more than 5 pictures--just set your photos to randomize

Multi-Column Text Callouts (Red)

Block One

Good for (plain) text only stories (no formatting supported.)

Link

Block Two

Should have a short blurb and link to the full story.

More Information

Block Three

Should only have three blocks.

Link

News Headlines (choose a category or pull from all news)

More News Headlines

People Carousel

The People Carousel is good for highlighting specific people for accomplishments or honors. This block can be randomized, but works better for highlighting a few people rather than a department's full faculty and staff.

Full Name

Title

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id ligula porta felis euismod semper.

Full Name

Title

Nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id ligula porta felis euismod semper.

Full Name

Title

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id ligula porta felis euismod semper.

Story Callouts with Sidebar

Red sidebar content. Limit to two story callouts.

Link

Story Carousel

This is the Description. If it's too long, the text will will get truncated...

Text Callouts with Red Sidebar

Title Goes Here

Content goes here.

Link

Text Callout 2

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id ligula porta felis euismod semper.

Text Callout 3

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Text Callout 4

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id ligula.

Link

Tips & Answers

Refresh Tips

Tip

When planning a campus visit, make sure to check out University Hall. There's a flag hanging for each country represented in the student body.

Tip

OWU is just 30 minutes from Columbus, making it easy to access all the city offers, from pro sports to eclectic restaurants, art galleries, and major concerts, not to mention impressive internships and work experiences! It's no wonder Columbus ranks high for best places to start a career!

Click here to see the best cities for recent grads

Tip

Brains need fuel—not boredom. From astrophysics to creative writing, Ohio Wesleyan's more than 70 programs of study have you covered, even allowing you to create personalized majors for your specific interests. How will you create your future?

View majors

Question

What is First Year Seminar?

Answer

We call it, "How to Change Your World." It's an interdisciplinary course for first-year students. First Year Seminar brings together the newest class of Bishops with faculty from across OWU to explore complex questions that are both immediate and enduring.

More information

Triple Column Callout

This callout block supports formatted text.

  • You have a little more flexibility with it!

Title

Second Title Callout

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id ligula porta felis euismod semper.

Third Title Callout

Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum id ligula porta felis euismod semper.

Link

CONTACT INFO

Location

Office of University Communications
4 Williams Drive
61 S. Sandusky St.
Delaware, OH 43015
P 740-368-3356
F 740-368-3332
E owupr@owu.edu

Social Media

X Follow Us

Facebook Visit Us