Introduction to Layouts

What is the Layouts section of Agility and what are Sitemaps?

A Sitemap typically represents a website and its general structure. It’s the hierarchy of the layouts as they’ll appear on the front-end of your digital solution. 

The Layouts Section in Agility is the area where you can build and manage your sitemaps and the layouts that live within them. They’re conveniently organized to show you where each layout lives and how they relate to the layouts around them.  

This section allows Editors to manage those Layouts and Content without the need for a Developer. Your Layouts can then be used to build front-end content for your online property, such as the pages of your website.

Structure

Sitemaps in Agility are the main representation of your site or online properties structure. There are 3 elements to a Sitemap. 

1. Layout

A layout in Agility is made up of a Layout Model, Content Zones, and Components to define what content will live in those Zones. 

A layout can also be either Static or Dynamic. A Dynamic Layout allows you build a page based on a Content Model (i.e., a container of posts or products) 

Static Layout Properties

1. Layout Type - The kind of layout you're building, either Static or Dynamic

2. Layout Model - The Layout Model currently in use (The layout model designates which zones are available to add components to)

3. Requires Approval - Enables the Approval Workflow so editors must request Approval to Publish changes

Dynamic Layout Properties

1. Layout Template – Same as in a Static Layout

2. Build Layout From - The Content Container whose contents we want to dynamically build Layouts from 

3. Page Path Formula – Creates a smart URL for the page based on Page info 

4. Menu Text Formula – Creates the Menu Text for the page based on Page info 

2. Folder

A Folder simply allows you to group a selection of Layouts

Folder Properties

1. Menu Text – Just like a layout, this is the text that appears on links in navigation or a sitemap. 

2. Folder Name – Also like with Layouts, the name that represents the directory in the context of a website, i.e., a folder named “news” means that all layouts below it would start with "~/news/" 

3. Link

This element can be used to place a link in the sitemap to another Layout, document, or even to a completely different website. 

Note

Links added here should link to actual website URLs. When directing to a mailto link we recommend using a contact page or creating a blank layout with a simple Rich Text Area that includes a description as well as the mailto: link you'd like to use

Screenshot of the pop-up that's displayed when adding a new link, 
including the Redirect Path Field, Menu Text Field, Link Name Field and 
Target Window

Link Properties

1. Menu Text – Same as our last two elements, the text that appears on links in navigation or a sitemap 

2. Link Name – The name you’d like link to appear as 

3. Link – The link to the resource, layout or external site you’re linking to 

4. Target – The window you’d like the link to open in 

Other Features

You can easily choose which Locale you want to work with straight from the Sitemap using the Locale toggle.  Choosing a different language from this drop-down will reload all open items for that Locale. 

Sitemap Actions 

Refresh – You can refresh at any time by clicking the hidden menu icon to the right of your sitemap name 

Expand – You can expand the branches of sitemap using the ⌄ icon next to the parent  

Move – You can move layouts around the sitemap by dragging and dropping 

Further Reading