Single Row of Text
The above text “Single Row of Text” is a “Heading 1” type because it’s the title of the page. This text is is a “paragraph” type with the format “p => post-header lead” applied to it. It’s a short summary of what the page is about. At the very top is the shortcode [breadcrumbs] shortcode since this page has a parent page other than the homepage.
This section is a “single row of text”, which is the first section choice when clicking “add section” on a page.
Here’s the same section type but with a different background color, centered text, and generally larger text (format = stand-alone lead).
Also, consider changing the option “Add extra space between text lines?” to “yes” for a section like this. Especially if you don’t have a lot of text items inside of it.
Extend Background Color to one edge of the window? Yes (heading 6)
Here’s a text-row with the option “Extend Background Color to one edge of the window?” set to “yes” and then the resulting option “Direction to Extend Background Color” set to “Right”. The text should be left-aligned. (format = stand-alone text)
An example of this is at the end of the Resources page.
This is what a text row looks like when you add another text block. Since this section has the default background color, it is used to split up a single chunk of prose into two columns. Here’s the text in the first text block…
… and here’s the text in the second text block. An example of this is at the top of the “About” page.
Optionally for any section, consider setting “Add additional space between this section and the section before it?” to “yes” if you think you want that space. You’ll then have the option to choose “Gap amount between this section and previous section” (choices between “medium” and “large”). Since this example feels a bit too short, I’m adding a medium gap above it as well as above the section that follows it.
Now with a dark background color (heading 6)
Here’s an another example of two text blocks with a different background color. (format = stand-alone lead)
These columns are two separate prompts (heading 6)
In the design, if there are two columns of text with a divider line over a dark background, they’re visually separated so they should be considered two different prompts. (format = stand-alone lead)
An example of this is at the bottom of the “Resources for Supporters” page.
The Text Blocks Grid
This is a the “Section Style” option: “Text Blocks Grid”
Add as many text blocks as you want to create a grid of text blurbs in a grid format.
Just be sure to create 2 more text blocks on the admin side than squares you want.
This is because the first text block fills the area above the grid. If you don’t want anything there, just leave the first text block blank.
The last text block will fill the area below the grid. Similarly, if you don’t want anything there, just leave it blank.
An example of this is the “Learn the signs” section of What is Teen Dating Violence.
Floating Text block
Finally, there is an option to append a text block to the end of a previous section. As you can see, the edges of this sections background color do not extend to the edges of your browser window. (format = stand-alone text)
An example of this is on the homepage (search for “covid-19 updates”). That example ends with an…