Page Sections and Adding Content

Once a landing page has been created, you have the ability to create a custom layout by adding various sections to the page. Within each section Administrators can add the content they wish to present on the page; this article will discuss both functions.

Adding Sections

Sections act as containers for your content, the Layout Builder allows Administrators to choose form 3 different section configurations depending on the content you plan to add and the look you would like to achieve for the page. 

Accessing the Layout Builder

The layout builder can be accessed in different ways depending on where you are in your Stacks site, the instructions below will explain how to access the layout builder depending on where you are in your Stacks site. 

After Logging In

1. Once logged into your Stacks site (as an Administrator), navigate to the homepage or any other landing page you wish to add new sections or new content to
2. Click the Layout tab, just below the primary search bar; this will open the Layout Builder

From the Landing Pages tile in the Dashboard

1. Ensure you're logged into your site as and Administrator
2. From the Dashboard, click the Landing Pages tile
3. Find the landing page you wish to add sections/content to by
   1. Browsing the list; OR
   2. Search for the landing page by the page's title
4. Once found, either
   1. Click the title link from the column on the right, then click the Layout tab just under the header (as shown in the image above); OR
   2. Under the Operations column, click Edit, then click the Layout tab near the top of the screen

How to Add Sections

Whether this is a brand new landing page, or an existing page that you wish to change up, you can add sections to the page which will hold the content you plan to display. 

1. Click + Add section
   1. A window will open with 3 layout options
      1. 1 column, the section will be the full width of the content area
      2. 2 column, the section will be split into two columns both 50% of the content area
      3. 3 column, the section will be split into three columns, with the option to choose between either a 33%/34%/33% split OR a 25%/50%/25% split, select the appropriate option
   2. Administrative label, once the column configuration is selected, you will have the option to add this label
      1. Tip! The administrative label is only be visible to administrators when in this layout builder view; labeling the section to indicate the content it will contain may be helpful in the future if edits are required or if you have multiple administrators who manage the site
   3. Click Add Section

Removing Sections

If you have a section that you no longer need, it can be removed by clicking the X in the top left corner of the section. A confirmation window will appear to confirm if you wish to delete the section. 

It's important to note that removing a section will not delete the content within it (if this has not already been removed).

Adding Blocks of Content

Within each section is the ability to add blocks of content; sections can contain one or more blocks of content depending on the look and layout you are trying to achieve. 

1. Click + Add block
   1. A window will open on the right listing the content that can be added to the section
      1. Content will be organized by feature type, scroll to the content or filter by name in the filter field at the top
   2. Once the content is found, click it's Title, a window will open on the right
      1. Heading, by default, this will be the title, 3 options are available for the heading
         1. Leave the heading as is, by default this will be visible to your users/patrons
         2. Change the heading name, click into the field and type in a new heading name
         3. Hide the heading, if you do not wish to show any heading, click the eyeball icon to the right
            1. The field (and helper text field below) will then be "greyed-out" and cannot be edited
      2. Helper Text, if applicable, enter a short description or instructions to provide guidance to the user/patron
         1. This will appear as an 'i' icon to the right of the heading, users/patrons can click or hover over the icon to view the helper text
      3. Subheading, if applicable, enter a value to display as a subheading
         1. Sub-Title URL, if applicable, enter the full URL to the page you wish to direct users/patrons to when they click the displayed subheading
         2. Open in new tab/window, if adding a Sub-Title URL, check this box to open that page in a new browser tab/window
      4. Important! Additional settings may appear below the subheading, this will be discussed in more detail for the feature articles where this is applicable.
      5. Click Add Block when finished to add the block to the section