**Site Layout** is where you build the header and footer that frame every page of your website, including the navigation menu, footer links, social links and copyright line. You can keep several layouts, choose a default, and give particular pages or sections of your site a different header or footer. Go to **Strengthen → Content → Site Layout** to get started.

## Before you start

- You need permission to manage your content setup to open **Site Layout**, and permission to update it to delete layouts. Ask a subscription administrator if you can't see the page or a button. See [Users, teams, groups and permissions](/account-and-access/users-teams-groups-and-permissions).
- Create the pages you want in your menus first, so you can pick them from a list. See [Creating and editing pages](/strengthen/content-pages).

## How layouts work

The page has two tabs, **Header** and **Footer**. Each tab lists your layouts with their **Layout Name**, whether they're the **Default**, their **Status**, and how many **Navigation Items** (headers) or **Sections** (footers) they contain. Select **Open Builder** on a row to edit that layout.

- The default layout is used on every page that doesn't have a specific layout assigned.
- You can assign a different layout to an individual page, and optionally to all of its child pages.
- Keep one default header and one default footer so that every page has one.

## Create a header

- Step 1: Go to **Strengthen → Content → Site Layout** and stay on the **Header** tab.
- Step 2: Select **Add Header**. The **Header Builder** opens.
- Step 3: In the left-hand panel, enter a **Layout Name**, set the **Status**, and tick **Use as default** if this should be your main header.
- Step 4: Under **Layout Tools**, add items to the **Canvas** using **Add Page**, **Add Custom Link** or **Add Dropdown**. Use **Search components** to find a tool quickly.
- Step 5: Select an item on the canvas to edit it in the **Inspector** under **Selected Item**. Drag items to change their order.
- Step 6: Select **Save** to keep working, or **Save and Close** to return to the list.

Select **Back to List** to leave the builder. Save first if you want to keep your changes.

## Create a footer

Footers are built from sections, such as columns of links.

- Step 1: Open the **Footer** tab and select **Add Footer**. The **Footer Builder** opens.
- Step 2: Enter a **Layout Name**, set the **Status**, and choose whether to **Use as default**.
- Step 3: Replace the **Copyright text** with your own. A new footer starts with placeholder text that you should change before you use it. Type `{{year}}` where you want the current year to appear.
- Step 4: Select **Add Section** above the canvas. Select a section to set its **Section title** and **Width**. Widths are twelfths of the footer, so two sections at 6/12 sit side by side. A new section starts at 3/12.
- Step 5: Add items. Tools under **Layout Tools** add to the last section. To add an item to a different section, select **Add Item** on that section and choose the item's **Type** in the **Inspector**. As well as pages, custom links and dropdowns, footers can use **Add Child Pages**, **Add Header**, **Add Text** and **Add Socials**. Drag sections, or the items within a section, to change their order.
- Step 6: Select **Save** or **Save and Close**.

## Item settings

Depending on the item type, you can set:

- **Page**: the page to link to, with an optional **Label Override** if you want different wording from the page name.
- **Custom Link**: a **Label** and **URL**, for example a link to another website.
- **Dropdown**: a label plus its **Dropdown Links**.
- **Child Pages** (footers only): a **Parent Page**. Its child pages are listed automatically.
- **Header** and **Text** (footers only): a heading or a block of text.
- **Socials** (footers only): a list of **Social Links**, each with a **Platform** and **URL**. Use **Add Social Link** to add more.
- **New Tab**: tick this to open the link in a new browser tab.
- **Item Class**: an optional styling class for your web developer, for example `mb-5`.

Select **Preview** in the builder to see the layout on your website in a new tab before you save. The preview updates as you edit.

## Assign a layout to specific pages

- Step 1: Go to **Strengthen → Content → Pages** and open the page.
- Step 2: Open the **Information** tab.
- Step 3: Under **Site Layout**, choose a **Header Layout** and a **Footer Layout**, or leave **Use default**.
- Step 4: To use the same layout for every page beneath this one, tick **Include child pages** under that layout. The header and footer each have their own tick box.
- Step 5: Publish or save the page.

## Delete a layout

Select **Delete** next to a layout and confirm. You can't delete:

- The default layout. Choose another default layout first.
- A layout that's assigned to pages. Reassign those pages first.

Hover over a greyed-out **Delete** button to see why it's unavailable.

## Troubleshooting

- **No layouts yet**: select **Add Header** or **Add Footer** to create your first one.
- **A page shows the wrong header or footer**: check the page's **Information** tab, and whether a parent page has **Include child pages** ticked.
- **A page is missing from the item list**: make sure the page exists in **Pages** and try reopening the builder.
- **Preview unavailable**: your website needs a homepage before a layout can be previewed. See [Creating and editing pages](/strengthen/content-pages).