Source: https://wpinplate.com/en/docs/tv-screens/

# TV screens in your venue

TV screens show your menu on TVs and monitors in your venue. They use the same menu as your website: a price change or a dish turned off in the dashboard appears on the screen at the next refresh, usually within a dozen or so seconds. You don't have to print boards or keep a separate system.

## How it works

- **A screen** is a layout made of TV blocks (dish grid, slideshow, banner, image, video, divider). You build the layout in the Gutenberg editor.
- **A slot** is a dish block whose content you manage in **TV Manager** – without editing the layout. E.g. a “Dish of the week” slot in a slideshow.
- **The TV** opens the screen's address in a browser: `/wp-inplate/tv/{screen-name}/`.

## Creating a screen

1. Open **TV → Manager ↗** (address `/wp-inplate/tv-manager/`).
2. Click **New screen** and enter a name, or choose **Ready-made templates**:

| Template | Description |
|---|---|
| **Photo grid** | A grid of cards with large photos. Good for a menu with attractive photos |
| **Full list** | One slot with a list of dishes over the whole screen. For a daily menu or a menu card |
| **Two columns** | Two lists side by side, e.g. main courses and drinks. Each column has its own slot and heading |
| **Slideshow** | A full-screen slideshow – one dish at a time with a photo in the background. For promotions or a burger of the week |

3. Click **Edit layout ↗** to fine-tune the layout in the editor, or start adding dishes to the slots straight away.

You can **export** screens to a JSON file and **import** them – e.g. to move a layout to another website.

The list of screens is also in the dashboard: **TV → Screens**.

## Screen settings

In the screen editor, in the **TV screen settings** side panel:

| Setting | Description |
|---|---|
| **Screen layout** | Landscape (16:9) or portrait (9:16) |
| **Content size** | 80–200%. Enlarges the whole screen at once: text, spacing and photos. Increase it when the content is too small from a distance |
| **Thumbnail** | The screen's picture in the launcher |
| **Background color, text color, accent color** | The screen's colors |

To check the size on one TV without changing the settings, add `?scale=150` to the screen's address.

The screen's height is divided between the blocks automatically. Blocks placed in columns side by side fill their column.

## TV blocks

### TV – Dish grid

Dishes from a category or from a slot, as a grid of cards or a list.

| Option | Description |
|---|---|
| Category | The source of dishes when the block isn't a slot (or a fallback when the slot is empty) |
| Layout | **Grid** or **List** (a list can have several columns) |
| Columns, max number of dishes | 3 columns and 12 dishes by default |
| Card layout | **Card** (photo at the top), **Background** (photo over the whole card), **Photo on the left**, **Bottom bar** |
| Photo size | None, small, medium, large |
| Visibility | Prices, photos, description, title, product tags, unavailable dishes |
| Text style | Font scale, color, inner spacing (padding) and margin – separately for the title, description and price |
| Relative height | The block's manual share of the screen's height (0 = automatic) |

**A list fits the available space:** the whole block uses one font size. Long names wrap to two lines and shrink, prices are aligned to the right, and the weight and description don't go below a legible size. Nothing is cut off.

### TV – Slideshow

Dishes that change every few seconds.

| Option | Description |
|---|---|
| Category, max number of slides | The source of dishes and the limit (10 by default) |
| Slide display time | In seconds (5 by default) |
| Transition | Fade or slide |
| Slide layout | Background, photo on the left, card, bottom bar |
| Slides per page | 1–4 dishes at once. Works best with the Card layout. The last page shows the remaining dishes |
| Zoom effect | A slow zoom into the photo (Ken Burns effect) in layouts with a background photo |
| Visibility | Prices, photos, product tags, unavailable dishes |

### TV – Text banner

Text on the screen, e.g. your venue's name, opening hours, an announcement. Size: small (24 px), medium (36 px), large (56 px), extra large (80 px). Alignment and text color.

### TV – Image

An image or a logo from the media library, with alignment and a maximum width.

### TV – Video

A video or a playlist of several files from the media library. Options: autoplay, looping the whole playlist, mute, controls. Browsers block autoplay with sound – for autoplay keep the video muted. Controls are useful on touch screens; after 10 seconds without movement they disappear together with the cursor.

### TV – Divider

A gap or a colored line of a chosen height, e.g. a margin at the bottom of the screen.

## Slots and TV Manager

In a grid or slideshow block, in the **TV Manager – Slot** section, give the block a **slot key** and a **label**. From then on you set the dishes in this block in TV Manager:

- **Add product** – a search with a category filter, several dishes in a row,
- the order – drag with the mouse or a finger,
- **Hide on TV** – the dish stays in the list but isn't shown,
- **Remove from screen**,
- **Badges for the dish** – one or several,
- **Label above the dishes** – a heading above the slot, with a choice of size,
- **Slot visible / hidden on TV** – hides the whole slot.

The **TV** tab in the [manager panel in the KDS](/en/docs/manager-panel/#tv) has the same functions, so the manager can change the screens from a tablet.

Administrators and shop managers have access to TV Manager.

## Badges on TV screens

Badges are named, colored labels next to dishes on the screens, e.g. “Promotion”, “New”, “Today's pick”.

- You create the badge catalog in **InPlate → Settings → System → TV screens → Badges on TV screens**. A shop manager can also edit it in the KDS: **Manager → TV → TV badges**.
- A badge has a name, a background color (or a transparent background), a text color and an optional outline.
- An optional icon: an image from the media library, or a character or emoji typed on the keyboard. The image takes priority. Older TVs often don't show emoji – use an image on them. The icon is centered next to the name.
- You assign them to a dish on a specific screen in TV Manager or in the KDS. A dish can have several badges.
- A badge shows in the corner of a card, next to the price in a list or under the name in a slideshow.
- A change of name or color in the catalog applies straight away on all screens.

## What else shows on the screen

- The dish's **weight** and **product tags** (optionally with an icon) – tags if you turn them on in the block.
- **The full description of the dish** with its line breaks.
- **Unavailable dishes** – marked automatically if you turn on showing them in the block.
- **“TV only” categories** – items shown only on the screens, not in the online menu. See [Products and categories](/en/docs/products-and-categories/#tv-only-categories).

## Running it on a TV

1. Open the browser on the TV.
2. Go to `/wp-inplate/tv/` (the launcher) and choose a screen, or go straight to the screen's address `/wp-inplate/tv/{screen-name}/`.
3. Turn on the browser's full-screen mode.

**PIN:** you can protect the launcher with a 4-digit code in **InPlate → Settings → System → TV screens → PIN for the TV panel**. An empty field means no protection.

**Refreshing:** the screen fetches data about every 15 seconds. Changes to the layout (colors, spacing, blocks) appear at the next refresh. After a plugin update the screen reloads itself.

**Older TVs:** the screens also work in the browsers of older Smart TVs (e.g. Vestel / Vewd with Chromium 38 or newer). You can also use a stick or a mini PC with HDMI.

**Diagnostics:** add `?debug=1` to the screen's address to see what the TV's browser reports (resolution, pixel density, CSS support). Useful when the screen looks different than on a computer.

## License

TV screens require an active license or a trial. After the license expires, the screens are paused. See [License](/en/docs/license/).
