> ## Documentation Index
> Fetch the complete documentation index at: https://help.atlas.kitchen/llms.txt
> Use this file to discover all available pages before exploring further.

# Set up POS layouts

> Create and customise Atlas POS layouts. Add pages, configure product and discount tiles, and assign layouts to specific outlets for efficient ordering.

<Info>
  **Who is this guide for?**

  * Atlas users with Admin or Manager permissions. Set permissions from **Settings > Team members**.

  * Users subscribed to Atlas POS.
</Info>

## Before you begin

This guide will walk you through setting up and customising your POS layouts in Atlas. You'll learn how to create layouts, add pages, configure different tile types, and assign layouts to specific outlets.

## Creating a POS layout

A POS layout organises how your menu and ordering interface appear on Atlas POS. Creating a layout allows you to customise navigation and product placement for your team.
Follow these steps to set up a new layout:

<Steps>
  <Step title="Open Atlas Merchant Portal and tap the &#x22;☰&#x22; button in the top-left corner." />

  <Step title="Tap &#x22;Menu builder&#x22; > &#x22;POS layouts&#x22;." />

  <Step title="Tap &#x22;Create new POS layout&#x22;.">
    <img src="https://mintcdn.com/atlaskitchen/PbQq0fyxwtbdSf_o/images/pos-layout/create-pos-layout-button.webp?fit=max&auto=format&n=PbQq0fyxwtbdSf_o&q=85&s=727267c99c4ea622c11cda0567432e77" alt="POS layouts page showing Create new POS layout button to add custom layout configuration" width="2994" height="456" data-path="images/pos-layout/create-pos-layout-button.webp" />
  </Step>

  <Step title="Once the layout is created, proceed to adding pages (see next section)." />
</Steps>

## Adding pages to a POS layout

Pages help organise different sections of your POS layout, allowing for easy navigation and a structured menu.
Follow these steps to add new pages to your layout:

<Steps>
  <Step title="Open Atlas Merchant Portal and tap the &#x22;☰&#x22; button in the top-left corner." />

  <Step title="Tap &#x22;Menu builder&#x22; > &#x22;POS layouts&#x22;." />

  <Step title="Tap &#x22;Enter layout manager&#x22; on the layout you want to edit.">
    <img src="https://mintcdn.com/atlaskitchen/PbQq0fyxwtbdSf_o/images/pos-layout/enter-layout-manager.webp?fit=max&auto=format&n=PbQq0fyxwtbdSf_o&q=85&s=c76a44d19d1c85322f0d6417c3b00b59" alt="POS layout card showing Enter layout manager button to access layout editor and configure pages and tiles" width="2992" height="450" data-path="images/pos-layout/enter-layout-manager.webp" />
  </Step>

  <Step title="In bottom-left corner, tap &#x22;Add new page&#x22; " />

  <Step title="Navigate to the page by tapping its name in the bottom bar.">
    If there are too many pages, scroll horizontally to find it, as it will be at the end. You might resort the page by tapping and dragging it too.
  </Step>
</Steps>

You might start adding product or discount tiles in this new page (see next section).

## Adding tiles to your POS

Tiles represent products, discounts, or navigation folders within your POS layout.
Follow these steps to add new tiles to your layout:

<Steps>
  <Step title="Open Atlas Merchant Portal and tap the &#x22;☰&#x22; button in the top-left corner." />

  <Step title="Tap &#x22;Menu Builder&#x22; > &#x22;POS layouts&#x22;." />

  <Step title="Tap &#x22;Enter layout manager&#x22; on the layout you want to edit." />

  <Step title="Navigate to the page where you want to add the tile by tapping on its name.">
    If there are too many pages, scroll horizontally to find it, as it will be at the end. You might resort the page by tapping and dragging it too.
  </Step>

  <Step title="In top-right corner, tap &#x22;Add new tile&#x22; , and select the type of tile to add.">
    <img src="https://mintcdn.com/atlaskitchen/PbQq0fyxwtbdSf_o/images/menu-builder/type-of-tiles-2.webp?fit=max&auto=format&n=PbQq0fyxwtbdSf_o&q=85&s=e5d02f6eb8923afc84e2691d0c04e930" alt="Add new tile dropdown menu showing Page tile, Product tile, and Discount tile options for POS layout" width="778" height="520" data-path="images/menu-builder/type-of-tiles-2.webp" />

    * **Page tile** creates an empty folder, for you to add items inside it. Click on it after you've created it to open it.

    * **Product tile** links to an existing product. It's the most common one. An additional "Select" button will display to select the right product.

    * **Discount tile** links to an existing discount. An additional "Select" button will display to select the discount.
  </Step>

  <Step title="Enter a name and colour for the page, then tap &#x22;Save&#x22;.">
    Note you can also enter your own colour code, or tap on the colour to select a predefined one.

    It's best to use darker colours for better visibility (text is white).
  </Step>
</Steps>

## Assigning POS layouts to different outlets

If you manage multiple outlets, you can assign specific POS layouts to each location to ensure the correct menu and configurations are in place.
Follow these steps to set up POS layout assignments:

<Steps>
  <Step title="Open Atlas Merchant Portal and tap the &#x22;☰&#x22; button in the top-left corner." />

  <Step title="Tap &#x22;Menu Builder&#x22; > &#x22;POS layouts&#x22;." />

  <Step title="Tap &#x22;Assign layouts to outlets&#x22;.">
    <img src="https://mintcdn.com/atlaskitchen/PbQq0fyxwtbdSf_o/images/pos-layout/assign-layouts-button.webp?fit=max&auto=format&n=PbQq0fyxwtbdSf_o&q=85&s=b89f91e379be9822d80d77621ab524d1" alt="POS layouts page showing Assign layouts to outlets button to configure outlet-specific layouts" width="2988" height="444" data-path="images/pos-layout/assign-layouts-button.webp" />
  </Step>

  <Step title="Select the correct mapping and tap &#x22;Save&#x22;.">
    <img src="https://mintcdn.com/atlaskitchen/PbQq0fyxwtbdSf_o/images/pos-layout/outlet-layout-mapping.webp?fit=max&auto=format&n=PbQq0fyxwtbdSf_o&q=85&s=3e54da0257d9cff69cb772b6e135ad84" alt="Outlet layout assignment form showing dropdown to map each outlet to its corresponding POS layout with Save button" width="1536" height="1692" data-path="images/pos-layout/outlet-layout-mapping.webp" />
  </Step>
</Steps>
