# Set up the home screen

> Build the Endless Aisle home screen with banners and category tiles, choose what each banner opens, and add secondary home screens.

The home screen shows a row of **Banners** at the top and **Categories** tiles below them. Customers tap a banner or a category to start browsing. Both are set up under **Active** → **Home** in the Endless Aisle settings.

## How to add categories

Each category tile opens one of your product categories, including its subcategories. Add at least one: the kiosk can't start without categories.

1. Expand **Active** → **Home** → **Categories** and add a category
2. In **ID**, enter the category's **Identifier** from **Content** → **Products** → **Category**
3. Enter the **Title** in each language
4. Optionally, add an **Icon** shown next to the title
5. Optionally, add a **Background** image or video. Videos play muted and loop
6. Repeat for each category, in the order you want them on the screen
7. Click **Save all changes**

To show the categories on a separate screen instead of the home screen, turn on **Features** → **Move Categories to Explore screen**. An **Explore** button then opens them from the bar at the bottom of the screen.

## How to add banners

1. Expand **Active** → **Home** → **Banners** and add a banner
2. Enter the **Title**, **Description**, and **Call to action** in each language
3. Add a **Background** image or video
4. Optionally, add an **Icon** shown after the call to action
5. Under **On click**, choose what the banner opens, as described below
6. Click **Save all changes**

## What a banner can open

1. **Show Category:** a category's product list. Enter the category **Identifier** in **Category ID**. You can also turn the category menu and filters on or off for this banner, and add a guided selling assistant
2. **Show Product:** a single product. Enter its **Product ID**: the **Product Group ID** shown on the product in **Content** → **Products**
3. **Show list from Product Ids:** a hand-picked list of products. Upload an Excel file with the columns `bannerId`, `spaceId`, and `productId`, and enter the **Banner ID** to use from it. Only rows for the kiosk's space are used
4. **Custom Home Screen:** a secondary home screen with its own banners and categories, described below
5. **Display Custom Modal:** a pop-up window with your own content, written in HTML
6. **Show installation, image, or video in modal:** a pop-up window that plays an image, a video, or another installation
7. **None:** the banner isn't clickable

## How to add a secondary home screen

A secondary home screen groups banners and categories for a campaign or a department, for example "Summer collection".

1. Add a banner and set **On click** to **Custom Home Screen**
2. Enter a **Home screen ID**, for example `summer`
3. Under **Custom Home Screen**, add its **Custom Home Banners** and **Custom Home Categories**, the same way as on the main home screen
4. Click **Save all changes**

## How to style banners and categories

Each banner and category has **Styles** fields for custom CSS, for example to change the text size or colour on one tile. See [Customise Endless Aisle with CSS](https://learn.phygrid.com/endless-aisle/customization/customize-endless-aisle-with-css/).