This page was created to provide a visual "guide" to the various content layout types in Craft CMS.

BELOW IS A HERO LAYOUT

This is a "Hero" - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a hero link (always primary)

BELOW IS A TEXT AND MEDIA LAYOUT

D Lindrum

Text and Media - Text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is text link in the text and media layout in the text section in primary style.

Notes:

  • Bullets in this content type appear as our "green back slashes"
  • The text link style can also be "default" which renders it as black text/underlined
  • The image or media element can be aligned right, left, or center - here it is aligned left. If aligned center, the image is placed above the text section.
  • There is also an option to add an animation JSON file (leftover from Platoon's "Our process" page) or embed a video
  • The section link has (3) button type options: primary (filled in button), secondary (outlined button), or arrow (text + right pointing arrow)
  1. This is a number list item
  2. And a second

This is the section link label

BELOW IS A CARDS LAYOUT - SMALL LIST STYLE

Small Cards - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2
  • Card list Top label 1
    Introduction to Business cover

    This is text in small card list.

    H1

    H2

    H3

    H4

    H5
    H6
    Normal text
    Normal italic
    Normal bold
    Quote

    This is a link

    • Bullet list item 1
    • Bullet list item 2
    1. Ordered list item 1
    2. Ordered list item 2
    Card list CTA label 1
  • Card list Top label 2
    Concepts of Biology cover

    This is another item in the small list

    Card list CTA label 2
  • Card list Top label 3
    Central Ideas in American Government cover

    This is a third item. They should align 2 per row

    Card list CTA label 3
This is the section CTA label

BELOW IS A CARDS LAYOUT - MEDIUM LIST STYLE

Medium Cards - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2

Note: Images in list below are left aligned without current ability to change that alignment


Medium Card Section CTA Label

BELOW IS A CARDS LAYOUT - LARGE LIST STYLE

Large Cards - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2

Note: Images in list below are left aligned without current ability to change that alignment

Large Card Section CTA Label

BELOW IS AN IMAGE LIST LAYOUT

Image List - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2

BELOW IS A QUOTES LAYOUT

Quotes - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2
Image 1 Top Label

Introduction to Business cover

Image 1 Bottom Label

  • This is Quote Text section. You can bold or italicize. Bio cover is associated with this Quote Text.

    Concepts of Biology cover

    This is the Quote Source section. You can bold or italicize.

  • Another Quote Text section. MWL is associated with this Quote Text.

    Modern World Literature cover

    Another Quote Source section.

Quote Section CTA Label

BELOW IS A BASIC TEXT LAYOUT

Basic Text - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2

BELOW IS A PEOPLE LIST LAYOUT

People List - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2
  • D Lindrum

    Listing Name 1
    Listing Position 1

  • Susan Cottenden

    Listing Name 2
    Listing Position 2

  • Tom Meeks

    Listing Name 3
    Listing Position 3

BELOW IS A FORM LAYOUT - NEWSLETTER FORM

Form - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2

Thank you for your submission.

BELOW IS A FORM LAYOUT - CONTACT FORM

Form - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2

Thank you for your submission.

BELOW IS A FORM LAYOUT - GET STARTED FORM

Form - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2

Thank you for your submission.

BELOW IS A JOBS LAYOUT - GET STARTED FORM

Jobs - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2


BELOW IS A ROW GRID LAYOUT

Row Grid - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2


  • Row 1 Heading

    Row 1 Description text

    Heading 1

    Heading 2

    Heading 3

    Heading 4

    Heading 5
    Heading 6

    Normal text, Normal text italic, Normal text bold

    Quote text

    This is a link (no style option)

    • Bullet list item 1
    • Bullet list item 2
    1. Ordered list item 1
    2. Ordered list item 2

  • Row 2 Heading

    Row 2 Description text

  • Row 3 Heading

    Row 3 Description text

Accordion List - text section

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Normal text, Normal text italic, Normal text bold

Quote text

This is a link (no style option)

  • Bullet list item 1
  • Bullet list item 2
  1. Ordered list item 1
  2. Ordered list item 2
  • What kinds of courseware tailoring can you do for me?

    Our instructor support desks can work with you to rearrange or remove chapters, delete assignments, and potentially add new material or revise existing content.

  • How will students access the webtext?

    Students will access their webtext in one of two ways:

    1. Through the school’s learning management system
    2. By visiting the sign-up page and creating an account

    We provide you with a one-page Quick Start Guide for students.

  • What about the campus bookstore?

    We are happy to work with your bookstore to provide virtual or physical passkeys.