# Use layout templates to structure your page

<Embed url="https://youtu.be/dxWMgpGc9PE" />

## What are Layout templates?

Layout templates let you build reusable headers and footers in FoxStudio and apply them to any Foxify page (created with FoxStudio). Instead of copying sections manually across pages, you design once and assign the template wherever you need it.

<Hint type="info">
  Note: The number of published layout templates you can have depends on your plan. Go to **Plans & Pricing** on your app dashboard to see your limit.
</Hint>

## When to use layout templates

Use Layout templates when you need a header or footer that's different from your Shopify theme's default — without rebuilding it on every page.

Best fits for:

* A campaign landing page with a simplified header (logo only, no full nav)
* A seasonal promo page (Black Friday, Mother's Day) with a branded banner header
* A lead capture or waitlist page where you want to hide the default footer
* Any set of pages that share the same custom header/footer and need to stay in sync

#### How is this different from just adding a section to a page?

<Cards columns="2">
  <Card title="Layout template " subtitle="Use this " description="When you want to reuse the same header or footer across multiple pages." fields="icon,image,subtitle,title,description" />

  <Card title="Adding a section manually" subtitle="Use instead if... " description="When the section is only needed on one page." fields="icon,image,subtitle,title,description" />
</Cards>

## Quick setup

<Hint type="info">
  **Before you start:** Set the page's layout to **Blank layout** before applying a **Layout template**. This prevents your theme's default header/footer from showing at the same time.

  See how to set your page layout: [Page settings](https://docs.foxecom.com/foxify-app/foxstudio/page-customization/page-settings)
</Hint>

### Part 1 — Create your layout template

<Stepper>
  <Step title="Open Layouts manager">
    #### In the FoxStudio editor, click **Layouts manager** in the left sidebar.
  </Step>

  <Step title="Create a new layout">
    #### Click **Create new layout**.

    ![image](https://docs-assets.foxecom.app/foxify-app/image_z7EaMgQg.png)
  </Step>

  <Step title="Design your header and footer">
    ![](https://docs-assets.foxecom.app/foxify-app/53b76f63-f100-495a-80a9-8ecd9712ecf4.png)

    Add sections or elements:

    * Above the Content area for your header&#x20;
    * Below the Content area for your footer

    You can design them just like any other Foxify page.<br />Learn more: [Page customization](https://docs.foxecom.com/foxify-app/foxstudio/page-customization); [Add and edit elements](https://docs.foxecom.com/foxify-app/foxstudio/add-and-edit-elements)<br />

    💡 Tip: Use **pre-designed sections** for a quick start and inspiration.

    ![](https://docs-assets.foxecom.app/foxify-app/959ecac3-627b-413c-90af-350ef256dac7.png)
  </Step>

  <Step title="Save & Publish">
    Click **Save & Publish**. Only published layouts appear on live pages.
  </Step>
</Stepper>

### Part 2 — Apply the template to a page

<Stepper>
  <Step title="Open the page in FoxStudio">
    Navigate to the page you want to apply the layout to.
  </Step>

  <Step title="Set your Layout settings">
    Open **Page settings** in the top toolbar.
  </Step>

  <Step title="Select your template">
    Find **Layout templates** and select your published template from the list.

    ![](https://docs-assets.foxecom.app/foxify-app/04f2ab91-4c89-430c-b7a2-02d4304676b4.png)
  </Step>

  <Step title=" Apply">
    Click **Update**.
  </Step>
</Stepper>

<Hint type="success">
  **Expected result**: Your page now shows your custom header and footer. Any future edits to the template automatically update all pages using it.
</Hint>

### Part 3 — Manage Foxify layout templates

![image](https://docs-assets.foxecom.app/foxify-app/image_D9W0TC5U.png)

From **Layouts manager**, click the three-dot menu on any layout:

<Table widths="170,auto">
  | Action    | When to use                                                                                                                                                   |
  | --------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- |
  | Rename    | Give it a clear name                                                                                                                                          |
  | Duplicate | Start a new layout from an existing one — useful for seasonal variations                                                                                      |
  | Delete    | Remove unused layouts. Cannot be undone.<br /><br />Before deleting: If the layout is applied to any pages, you'll be prompted to reassign those pages first. |
</Table>

### **Page status**

<Cards columns="2">
  <Card title="🟢 Published — visible on live pages" />

  <Card title="⚫ Draft — preview only" />
</Cards>

## FAQs

#### Can I apply the same layout to multiple pages?

Yes — one template can be used across as many Foxify pages as you want.

#### If I edit a live template, do changes apply immediately?

Yes. All pages using that template update automatically when you save and publish.

#### How do I go back to my theme's default header and footer?&#xD;

Open **Page settings** → set **Layout templates** to **None** → switch **Page layout** back to **Theme layout**.

#### How many layout templates can I have?

The limit depends on your plan. Go to **Plans & Pricing** page to see your current limit.

## Related resources

<PageLink href="https://docs.foxecom.com/foxify-app/foxstudio/page-customization">Page customization</PageLink>

<PageLink href="https://docs.foxecom.com/foxify-app/foxstudio/layout-and-styling">Layout & styling</PageLink>

<div data-full-width="false" />