# stackTemplate
Displays groups of products.
## Overview
Use the `stackTemplate` element to display, for example, displaying different genres
of movies. Each group of products is displayed directly underneath the previous group.
Products can be displayed in different ways using `carousel`, `grid`, and `shelf`
elements. The following figure shows the basic layout for a `stackTemplate` page.
The theme for the stack template defaults to the system preference.
### Main Elements
The following listing shows the main elements of the `stackTemplate` element in TVML
format.
```xml
…
```
> Note: The `shelf` element can be replaced with a `grid` or `carousel` element to
> change the way products are displayed.
#### Element Descriptions
- [banner](/documentation/TVML/banner): A page description along the top of the screen.
- [carousel](/documentation/TVML/carousel): Element that contains all elements used to display groups
of products, such as dramas and comedies, in a horizontal format.
- [collectionList](/documentation/TVML/collectionlist): Element that contains all elements used to display groups
of products, such as dramas and comedies, in a horizontal format.
- [grid](/documentation/TVML/grid): Element that contains all elements used to display groups of products,
such as dramas and comedies, in a grid format.
- [lockup](/documentation/TVML/lockup): Element containing `img` and `title` elements used to describe
a product.
- [section](/documentation/TVML/section): Element containing a group of `lockup` elements.
- [shelf](/documentation/TVML/shelf): Element containing a group of `section` elements.
### Example
The following listing shows the TVML for a `stackTemplate` example:
```xml
Available Action Movies
```
The following figure shows the output for the above example:
You can also customize the stack template’s background content. To do so, embed a
`mediaContent `element in a `background `element, as shown in this example:
```xml
```
When you add a video in the background, playback starts 5 seconds after the page
is loaded. The video does not repeat.
## Topics
### Valid TVML Attributes
[binding](/documentation/TVML/binding)
Associates information in a data item with an element.
[itemID](/documentation/TVML/itemid)
Mark elements for reuse during DOM updates.
[layoutDirection](/documentation/TVML/layoutdirection)
Specifies the direction in which text is displayed.
[needsMoreThreshold](/documentation/TVML/needsmorethreshold)
Sets the amount of remaining screen lengths before firing the needs more event.
[prototype](/documentation/TVML/prototype)
Associates a data item type with an element.
[theme](/documentation/TVML/theme)
Sets the color scheme for an element.
---
Copyright © 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)
