{"section":"tutorials","requestedLocale":"en","requestedSlug":"defining-window-displays","locale":"en","slug":"defining-window-displays","path":"docs/en/tutorials/storefront/layout/defining-window-displays.md","branch":"main","content":"> ⚠️ **Warning:** there are two ways to configure collections, through the CMS or the Collection module (Beta). This article is about how to [configure collections through the CMS](/en/docs/tutorials/adding-collections-cms).\n\nWindow displays are used to highlight products on different pages, or for recommendations on a product page.\n\nFirst, before defining a window display, you must create a collection (see instructions [here](/en/docs/tutorials/creating-a-product-collection)) of the products to be displayed. The pages also have to be properly structured, with the required controls included in their templates.\n\nAfter defining this, link the collection to the window display in **Storefront > Layout**.\n\nIn the example below, we will define a window display on the home page, and to do so the following layout has to be changed:\n\n![cms_layout_home ](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/storefront/layout/defining-window-displays_1.png)\n\nIn the selected layout, add the control for the window display where you want to display the collection by clicking on **Add Object**\nAfter selecting the type of control you want, set its name and click **Adicionar** (Add)\n\n__Do not forget to click on the \"Save Settings\" button so that you can later edit the created control.__\n\n![ed](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/storefront/layout/defining-window-displays_2.png)\n\n### Editing created control\n\nTo edit your controls, click on the **pencil symbol**, as shown in the example image below:\n\n![banner_edit_cms](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/storefront/layout/defining-window-displays_3.png)\n\nWhen you editing the control you must add its contents by clicking **Add content**, which represent each set of items to be displayed.\n\n![cadastro_conteudo_cms ](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/storefront/layout/defining-window-displays_4.png)\n![cadastro_conteudo_cms 2](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/storefront/layout/defining-window-displays_5.png)\n\n- **\"Adicionar arquivo\" (add file):** to select the collection that will be displayed in this content.\n- **Partner / Campaign / Source:** defines the display of this content if the visitor has a corresponding UTM in its source URL.\n- **Keywords:** links the content display to a search for specific term(s).\n- **Category / Brand:** links the display of content on a specific Category / Brand page.\n- **From / To:** defines the period in which the content will be active.\n\nCheck **Active Content** box and click on **Add content list**. Do not forget to save all changes clicking on **Save Settings** later.\n\n**Attention!** Whenever you use more than one active content in the same control, you must sort them (by clicking and dragging your content) so that content without display conditions always stays in the last position.\n\n### Editing created content\n\nIf it is necessary to update the created content after saving it, just click on the second pencil symbol as shown below:\n\n![edit_content_cms](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/en/tutorials/storefront/layout/defining-window-displays_6.png)\n\nClick **Update Content List** after all changes were made and clicking on **Save Settings** afterwards.\n\n__Attention! __ When creating or editing items in CMS, it is indispensable to click on **Save Settings** so that no changes are lost."}