Column Layouts

Description

Column layouts in WP2 were used to layout content side-by-side, such as an image and some text.

WP2 Implementation

In WP2, column layouts were added by copying and pasting markup like the following into the source code, and replacing the ‘x’ and ‘y’ highlighted below, with the desired ratio (e..g, 50-50, 30-70) for how much of the page each column should take up:

<div class="column-layout-x-y">

<div>

Content for left column

</div>

<div>

Content for right column

</div>

</div>

After the markup was inserted into the page, the user could switch back to the WYSIWYG editor and replace the default text “Content for left column” with the left column content and “Content for right column” with the right column content.

Migrating to WP3

In WP3, column layouts have been replaced with the Two Column Body paragraph. To migrate a column layout:

  1. Locate the page where the accordion should be added and determine where on the page the accordions should be placed.
  2. Follow the tutorial for adding a Two Column Body paragraph: https://www.queensu.ca/webpublish/tutorials/paragraphs-and-layouts/two-column-body
  3. You’ll need to copy and paste the relevant WP2 content into the corresponding Two Column Body fields. Use the Column Split field to specify the closest ratio to the WP2 settings
  4. Rearrange any other paragraphs on the page to place the accordion in the correct location