# productTemplate Displays detailed information about a single product. ## Overview Use the `productTemplate` element to display, for example, a page that describes a movie, including information about the actors, ratings, and like movies. The page displays general information about the product in the top two-thirds of the screen with a row of related products directly below. A user can scroll down and access detailed information about the product, including critical reviews, actor biographies, and information about any included extras. The following figure shows the basic layout for a `productTemplate` page. The default theme for a product template is `dark` when a background image is specified; otherwise, the product template defaults to the system preference.  ### Main Elements The following listing shows the main elements of the productTemplate element in TVML format. ```xml … … ``` > Note: You can change the look of a `productTemplate` page by removing `heroImage` > from the `stack` element and replacing it with an `img` element that covers the entire > screen. #### Element Descriptions - [banner](/documentation/TVML/banner): Element containing subelements that provide primary information about a product, such as a movie title, description, credits, and purchase information. - [buttonLockup](/documentation/TVML/buttonlockup): A type of button that can contain an image (the `badge` element) as well as text. - [description](/documentation/TVML/description): Text that describes the product in detail; for example, a movie synopsis. - [heroImg](/documentation/TVML/heroimg): An image of the product. - [infoList](/documentation/TVML/infolist): Product information such as actors, directors, and producers. - [productInfo](/documentation/TVML/productinfo): Technical information about the product such as runtime, language availability, and accessibility information. - [row](/documentation/TVML/row): A group of information elements. - [shelf](/documentation/TVML/shelf): An element containing row elements. Several shelves are used to display information like shows other users have watched and extra features provided by this product. - [stack](/documentation/TVML/stack): Basic information about the product, including the title, rating, and a description. - [subtitle](/documentation/TVML/subtitle): Text that provides additional information about its containing element. - [title](/documentation/TVML/title): The title describing its containing element. ### Example The following listing shows the TVML for a `productTemplate` example: ```xml

John Appleseed

Anne Johnson Tom Clark Maria Ruiz 99% 1hr 54min Comedy 2015 An aspiring developer gets a ticket to WWDC at the last minute. Now they need to get across country in time for the keynote, and the only person who can help is their quirky roommate. Language information can go here $9.99

Average of 2,241 iTunes user ratings and reviews. Tomatometer

Reviews

Fresh

Rotten Brief review here Ravi Patel June, 8 2015

Actor Actor Actor

Apple

1:54

Widescreen

English (Dolby 5.1), Subtitles, CC

Cantonese (Subtitles)

SDH

Subtitles for the deaf and Hard of Hearing (SDH) refer to subtitles in the original lanuage with the addition of relevant non-dialog information. ``` The following figures show the ouput for the above example. The first figure shows the output for the example when it first appears on screen. The second figure shows the output below the fold as the user scrolls down the screen.   ## 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. [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)