Header block

The header block must appear on every page, though there are options to minimize it's size to just the menu at the top. Currently all pages inherit header defaults from the home page, which can then be overridden by section on inner page headers.

Use this section to update the logo image and size, or choose a different logo for mobile, if desired. You'll often want to override the logo on inner pages where the background color is different than the home page.

Choose your base layout here, along with a variety of other layout details. It's worth noting the the base layout on the bottom right is our "slim" header, and will hide everything besides the logo and menu. This is useful when you want the smallest possible header. The slim header will always inherit the color of the following block to make them look like a cohesive whole next to each other.

Other options here include: left vs. center alignment, flipping layout horizontally, flipping navigation links to left versus right, logo position (one option will make the logo much bigger and directly above your headline, the other is smaller and in the upper left corner), and social icons (top right smaller, below page content larger, or hidden).

Header height can also be controlled via a slider here, but can never be smaller than the content it's holding (in case you notice it's not doing anything that's probably why).

Content is controlling what appears in the section containing text / headline, forms, and buttons. Here you can turn on and off different pieces of content and switch between a form or button (or no "call to action" at all). The form builder button here allows you to control what fields show up on the form.

This section allows you to add your main header image, control it's vertical alignment setting, and also add a "color overlay" to it so it's faded out a bit by a solid color layering over it transparently. You'll often want to add a mobile override image here, as the mobile layouts can crop your image very differently.

By clicking the "embed video" option, we add a play button to your header that will pop up a video you've provided the embed code for. This button also generally includes a "label" next to it that's editable or able to be turned off on the sidebar as well. Both the label and play buttons contain a few design options here as well.

This section allows changing the size and style of your top navigation buttons, your social icons, and the "header gradient" that sits behind all that (which is used to make buttons and icons easier to see against the background, especially if they're sitting directly on a photo).

The header is the only block where we provide the option of changing most of the default colors. However, we recommend leaving the default colors in most cases (as noted by a dot in the middle of the swatch). Swapping out default colors is okay, unless you later decide to change the background color, which may yield unexpected results. Our default colors always work on the background color, so for maximum ease and flexibility, leave those alone.