Day: January 30, 2017

List Spread Buttons Snippet

This snippet creates a row of buttons that link to other pages or websites. The default button style is the “blank” style. When hovering over the button it gets a gold fill. The button width changes to fit all buttons evenly in the available area and the height changes to fit all link text.

list-spread-blank-example

list-spread-blank-snippet

  1. Enter the text for each button, up to five, in the field.
    1. Text only needs to be separated by a space as each link will become a button.
  2. Link each button’s text to the appropriate place.
    1. When you are creating the link, from the Class dropdown you can choose Button (Anchor) to create a gold button that turns grey on hover or Button Black (Anchor) to create a black button that turns gold on hover.

If your page has no left navigation and no right sidebar, you can use up to five buttons. If you have either the left navigation or right sidebar, only use up to four buttons. If you have both the left navigation and right sidebar, you can use up to three buttons.


FAQ Ordered List Snippet

This snippet creates a numbered list of frequently asked questions. Clicking on the questions opens a slider revealing the answer. Each row of the snippet will create one FAQ. The numbers are automatically formatted in the order that they appear in the snippet. If you have more than seven FAQs together, you should try to split them into multiple categories.

Screenshot of FAQ example.

Frequently Asked Questions snippet

  1. Enter the question in the question field. This field can only be text.
  2. Enter the accompanying answer in the answer field to the right of the question. The answer field can contain text, images, video, snippets (except sliders, class descriptions, or more FAQs), and assets. If you use headings in the Answer field, they should begin with Heading 3.

If you need more than four FAQs, press the Tab key to get more fields.

Adding FAQs

To add a new FAQ between existing FAQs, right click on the row above or below where you want the new one, go to Row, and select either Insert Row Before or Insert Row After. Enter your new content.

Reordering FAQs

Insert a new row where you want to move an FAQ to by right clicking on the row above or below where you want the new one, go to Row, and select either Insert Row Before or Insert Row After. Cut the content from the Question cell that you want to move and paste it in the new space. Cut and paste the content from the Answer cell. If the now empty row is between rows that have content, delete the row.


Boxed Sections Snippet

This snippet creates a two- to five-column layout with the columns being evenly spaced in the available area or a two-column layout with one column being 2/3 of the space and the other 1/3. Text, images, videos, snippets, and assets can be added to each column. It can also be used to add a border around content.

2 even column boxed section example with border on second column.

2/3 1/3 boxed section example.

Boxed sections snippet.

  1. Select the desired layout type from the dropdown.
    1. single column: when using in an asset type in “1-even-columns” without quotation marks
    2. 2 even columns: when using in an asset type in “2-even-columns” without quotation marks
    3. 3 even columns: when using in an asset type in “3-even-columns” without quotation marks
    4. 4 even columns: when using in an asset type in “4-even-columns” without quotation marks
    5. 5 even columns: when using in an asset type in “5-even-columns” without quotation marks
    6. 1/3 left 2/3 right: when using in an asset type in “one-third-two-thirds” without quotation marks
    7. 2/3 left 1/3 right: when using in an asset type in “two-thirds-one-third” without quotation marks
  2. Select the desired border option from the dropdown. Borders should not be used with cards.
    1. No Border: when using in an asset type in “no-border” without quotation marks
    2. Full Border: one border around all content, when using in an asset type in “grid-border” without quotation marks
    3. All Individual Cells: a border around the content in each cell that is used, when using in an asset type in “column-border” without quotation marks
    4. 1st Column Cells Only: a border around the cells in the first column of content, when using in an asset type in “1-column” without quotation marks
    5. 2nd Column Cells Only: a border around the cells in the second column of content, when using in an asset type in “2-column” without quotation marks
    6. 3rd Column Cells Only: a border around the cells in the third column of content, when using in an asset type in “3-column” without quotation marks
    7. 4th Column Cells Only: a border around the cells in the fourth column of content, when using in an asset type in “4-column” without quotation marks
    8. 5th Column Cells Only: a border around the cells in the fifth column of content, when using in an asset type in “5-column” without quotation marks
  3. If you are inserting cards in all columns, you can change the Spacing dropdown to No Gutter Spacing (“no-gutter-spacing” without quotation marks in an asset) to style the cards without space between them.
    Example of three cards in a boxed section with no gutter spacing.
  4. Insert content into the needed columns. If you are inserting text into a column, be sure to first select Paragraph from the Paragraph dropdown in the toolbar.To add more rows of columns, right click within the row, hover over Rows, and select Insert Row After.

    If your page has no left navigation and no right sidebar, you can use up to all five columns. If you have either the left navigation or right sidebar, only use up to four columns. If you have both the left navigation and right sidebar, use up to three columns.