Layout Examples

Heroes & Footer CTAs

This page contains the few “hero” pageblock options, as well as the few footer call-to-action (CTA) pageblock options. We decided to break the Pageblock Master up into several smaller pages to help optimize the admin experience and to help with page load speeds.

If you’re looking for a different pageblock option altogether, simply use the left-hand sidebar navigation. The names in left-hand sidebar nav should be pretty intuitive. Also in the left-hand navigation, you’ll see that you can navigate to a handful of other “How To” pages that provide further info about how to administer this website.

H1 – Large Hero (background imagery)

Paragraph text with “intro” class applied to it. This pageblock is ideal for the homepage. For optimum pageload speeds, upload your video to your Vimeo Pro account, then paste the URL into the appropriate field in the “section” of this pageblock.

CTA Button Reverse

Optional Pre-Title

H1 – Regular Hero (green diagonals bg)

Paragraph text with “intro” class applied. This hero is ideal for interior pages, and the green diagonals are hard-coded into this section, so no need to modify that detail.

Optional Pre-Title

H1 – Regular Hero (video bg)

Paragraph text with “intro” class applied. This hero is ideal for interior pages. For optimum pageload speeds, upload your video to your Vimeo Pro account, then paste the URL into the appropriate field in the “section” of this pageblock.

Optional Pre-Title

H1 – Regular Hero (image bg)

Paragraph text with “intro” class applied. This hero is ideal for interior pages. The admin has the ability to customize this bg image.

H2 – Footer CTA (white bg to black bg)

Paragrah text with “intro” class applied. This page block is intended to be located at the bottom of the page, just before the footer.

CTA Button Reverse

H2 – Footer CTA (light gray bg to black bg)

Paragraph text with “intro” class applied. This page block is intended to be located at the bottom of the page, just before the footer.

CTA Button Reverse

Alternate Footer CTA (green gradient parallax textured bg)

This is an additional CTA pageblock, intended to be used at the bottom of the page, but could be used elsewhere if necessary.

CTA Button Reverse