Page Layout & Widgets

The Row Widget - Format your page with columns

If you need to add multiple columns to a web page to organize content, this is the widget commonly used. You can also stack rows to go from a 2-column (50%-50%) layout to a 3-column (33%-33%-33%) layout. The row widget creates comprehensive layouts and makes pages come alive by displaying your content in just the right way.

How do I add this widget to a page?

  1. Click Edit Page
  2. Click the Edit Content icon (pencil) and select either Insert before or Insert after
  3. Choose the Row widget
  4. Select the the structure you would like to use, the options available are; Full Column, ½ x 2, 5/12 x 7/12, 7/12 x 5/12, ⅓ x ⅔, ⅔ x ⅓, ⅓ x ¾ , ¾ x ¼ , ⅓ x 3 , ¼ x 4,¼ x ¼ x ½, ½ x ¼ x ¼, ¼ x ½ x ¼, 1/5 x 4 and 1/5 x 6
  5. Additional fields can be found in the Settings tab, these will allow you to customize the widget . The fields and their descriptions are listed below;
    • Extra Class Names - If you need to target a row with an extra class name for a custom style, you would enter the class name in this field.
    • Collapse Columns - This allows a user to remove the default spacing between columns in the row. The default is off.
  6. When you are finished, click on the green Create button and your Row widget will show up on the page. 
  7. Make sure to click the Save --> Publish options just as you would when you're editing pages.
     

The HTML WYSIWYG Widget - The basic widget for text and images

The WYSIWYG widget is hands-down the most commonly used widget in the publishers arsenal. Use this widget to add text and images to a page. You will have a full toolset for applying styles to your content. You won't use it to set fonts, colors and font-sizes… as this is set higher up in your website's CSS. The idea here is to use the styles that are available in a manner that makes each of your web pages (despite being developed by multiple people in your organization) look consistent, and clean across your site.

How do I add this widget to a page?

  1. Click Edit Page
  2. Click the edit content icon (pencil, or + sign) and select the insert after or insert before option
  3. Choose the Html WYSIWYG widget
  4. After you've created your content within, click the green Create button
  5. Your Html WYSIWYG widget will show up on the page.
  6. Make sure to click the Save --> Publish options when you are done editing to save the page.