A close shot of a red brick building, Bader Hall at Champlain College

Hero Card w/ Overlay

Want to make a scrolling cta?   DONT CLICK THIS

Demo Page

Expand All
Collapse All

This is the content for an FAQ

In this FAQ, you can put anything, from images to lists, to links. You have full control over the content

Link to this FAQ

This is the content for an FAQ

In this FAQ, you can put anything, from images to lists, to links. You have full control over the content

Link to this FAQ

This is the content for an FAQ

In this FAQ, you can put anything, from images to lists, to links. You have full control over the content

Link to this FAQ

This is an ordered list

1

All ordered lists have a series of list items

These list items can contain whatever content you want, as you have full control over said contents

2

Each list item automagically generates a number to the side

So you don't have to worry about how that works, just put your content in the backend

3

Any questions?

Just ask Alice

Grid Components

This is the basic usage for a grid component

You Get Columns

The content in a grid lines up next to each other, with the option of creating extra space between them

An Optional Third Column

The third column is off by default, so you normally just have two. All it takes is one button click for that third column to appear

AnchorTest Grid

Super Content

Sub Content

Fullbleed

Grid Component: Image Grid

Students on a service-learning course at Burlington's Intervale Center

This isn't anything special

Corey decided to toss some images in a grid component, so now with have an image grid style. Note that unlike the previous grid, this one only has two columns

Image Grid Sizes

Each of the images in this grid are sized to 572px wide by 322 pixels tall. This isn't something that you have to conform to, the biggest thing is that the image isn't massive, and all of the images in the grid have consistent sizing

See our campus through the virtual tour

Stack these cards for them to look even better!

To see how this would look in it's optimal environment, you can check out the admissions section

Begin the Champlain College Virtual Tour

This is a sub content wysiwyg

This is great for seperating content with headers, or just adding in custom html

Checkerboard: Mid Page Barker Style

  • Image Sizes: 455x350 (use the same for mobile)
  • Please note: the more content you add in, the more the image stretches

CHECK OUT MORE

Students from Champlain College in Burlington, Vermont, sitting looking out at Lake Champlain on a sunny summer day
Alternate Checkers
Students enjoying conversation on campus at Champlain College in Burlington, VT.
Add Padding
Students from Champlain College in Burlington, Vermont, sitting looking out at Lake Champlain on a sunny summer day
Get This Effect

Seth Aubin

Christa Bennett

Year 1

Year 2


Latest News from The View

Featured Student

Profile Feature

Major Name
Hometown, Country

VIEW MY STORY STUDENT STORIES

Featured Student

Bekemeh Airewele

Marketing
Bostom, MA

VIEW MY STORY STUDENT STORIES

HERE IS THE CURRICULUM SAMPLE

Year 1

CSI 140 Introduction to Programming MTH 270 Discrete Mathematics

Year 2

MTH 240 Calculus II MTH 340 Vector Calculus

Year 3

MTH 285 Probability & Statistics MTH 310 Linear Algebra

Year 4

CCC 410ITS ITS Capstone Design CCC 412 ITS Capstone Senior Project
SEE THE FULL CURRICULUM

Just the Facts (Metrics Component)

The Best

Way to convey three different points that are in favor of the college

#1

At feeling like a used car salesman in your head while reading it

The Top

Of a mountain in Vermont is where this was all built

Seth Aubin

Seth Aubin

Seth Aubin

This is a Checkerboard w/ Background Image

You mae this with two checkerboard WYSIWYGs that have an image background

You first have to add a background image

The options for which are within each checkerboard wysiwyg component

Then set the checker color

This will show up behind the image that you select

Also note that this is fullbleed

The previous components were in the subcontent section, this reaches to the full width of the screen so you know that this and anything below it are full bleed components. The order of component types is Super Content (big hero image and scrolling banner), main content (no components), sub content (components that fall below main content and don't reach full width), and full bleed (components that reach full width of screen below the rest of the content)

This is a full bleed checkerboard with image

Desktop Size: 646x448

Mobile Size: 375x350

Also notice that the image is linked

Grid: Colored Background

This is very similar to the sub-content version

However, there is an option to change the background color in the additional options section of grid components

The component below this

Does not have the option to incorporate text, that is a slideshow using the slide image component

This is a Grid Form

Images of Champlain College stickers

The grid form gives the user two columns filled via wysiwyg under a customizable title

Under the right wysiwyg, a form generates automatically, with the form type being customizable by the user

Grid: Division Page Style

VERY SPECIFIC

This use of the grid was made for division pages, and does require a bit of extra coding to accomplish

IF DESIRED

This is one of the few components left that you should ask Alice to make for you

HOWEVER

If you are comfortable interacting with HTML, you can try and use this component style

Students playing games and talking in a common room at 194 St. Paul Street
A walkway leading to the entrance of a brick building surrounded by trees
A large, grassy quad with a granite staircase and brick residence halls in view
A large, grassy quad with a granite staircase and brick residence halls in view
A restored Victorian-era mansion in view through trees

This is a quotation WYSIWYG. If you are going to make this component, please make sure that you don't put quotations around the quote content or add the attribution inside said content section. This will be added afterwards. I suggest you use the gray background color for this

Quote Attribution '20 // You can put that here

CTA ROW: Taken from preview

Image Sizes

Images should be 150x150

Links

Set text by clicking the down arrow

What Arrow?

In the cta destination field

dont worry

This is really easy

OH, AND THERE'S MORE...

Apply Now
Apply

Innovative majors + stellar outcomes + stunning campus = the ideal college. This is your moment. Apply today.

A large group of students and families gathers on the quad for Open House on a beautiful summer day
Late Summer Open House

Join us for Late Summer Open House on September 16 and learn what makes Champlain special.

Get on the Mailing List
Get Info

Fill out our request info form and we’ll send you a cool collection of stickers and useful information about Champlain.