Image, View and Column Sections

Image, View and Column Sections
Content Sections

Besides text, a page’s Content Sections can hold an image, a list from your site (a View), or columns side by side. To add one, scroll below your content, open the arrow beside Add Simple and choose the section. For moving, collapsing and removing sections, see Content Sections.

The Add Simple list opened, with Add Image highlighted.

Image

  1. Choose Add Image.
  2. Under Image, select Choose file and pick a PNG, JPG or GIF file. Very large images are made smaller for you.
  3. Type the Alternative text: a short description of the image for people who can’t see it, such as “A wooded trail next to the pool”. It’s required. If the image shows text, type that text.
  4. Optional: in Link, start typing a page title and pick the page, or paste a web address. The image then opens that page when selected.

An Image section with an uploaded image, the Alternative text field and the Link field highlighted.

View (a List From Your Site)

A View section shows a list that updates by itself, such as the latest news, upcoming events or agendas and minutes.

  1. Choose Add View.
  2. Under View, choose the list, such as News. The choices depend on your site.
  3. Under Display, choose how the list looks, for example a full list with filters or a short list of the latest items.
  4. Leave Options as it is.

A View section with News chosen under View and Full Listing - Filterable under Display, both highlighted.

Preview the page to check that the list shows what you expect.

Columns

There are three kinds of column sections:

  • Columns (Equal) – up to six columns of the same width.
  • Columns (Two Uneven) – two columns: 3/4 - 1/4, 2/3 - 1/3, 1/4 - 3/4 or 1/3 - 2/3 of the width.
  • Columns (Three Uneven) – three columns: 1/4 - 1/2 - 1/4, 1/2 - 1/4 - 1/4, 1/4 - 1/4 - 1/2, 1/6 - 2/3 - 1/6, 2/3 - 1/6 - 1/6 or 1/6 - 1/6 - 2/3 of the width.

To add three uneven columns:

  1. Choose Add Columns (Three Uneven).
  2. Under Column Style, choose the widths, from left to right. For example, 1/4 - 1/2 - 1/4 makes a wide middle column between two narrow ones.
  3. Under Column Content, select Add Simple once for each column and type its content. The first section is the left column, the next the middle, the last the right. You can choose another section type from the arrow beside Add Simple, such as an image.

A Columns (Three Uneven) section with the Column Style list highlighted and three Simple sections under Column Content.

On wide screens the columns sit side by side. On phones they stack one above the other, in the same order, so make sure each column still reads well on its own.

Tips

  • Keep columns short. Long text is easier to read in a single Simple section.
  • Drag the dotted handle on the left of a section to move it.
  • Select Preview before you save to check how the sections look together.
Dennis Osnitsky