{"section":"tutorials","requestedLocale":"en","requestedSlug":"how-to-configure-a-banner-in-your-cms-portal-legacy-store","locale":"en","slug":"how-to-configure-a-banner-in-your-cms-portal-legacy-store","path":"docs/en/tutorials/storefront/cms-portal-legacy/layout/how-to-configure-a-banner-in-your-cms-portal-legacy-store.md","branch":"main","content":">⚠️ This tutorial is only applicable to CMS Portal (Legacy) stores.\n\nIn this article, you'll learn how to create, edit, and schedule banners in the CMS Portal (Legacy). Throughout the instructions, you'll see how to access the page layout, complete the banner fields, and set the display conditions.\n\nThis article shows how to configure a banner on the homepage, but the same flow applies to any page in your store.\n\n## Instructions\n\nTo create or change a banner on your store homepage, follow these steps:\n\n1. In the Admin, go to **Storefront > Layout**.\n2. Click the **CMS > Sites and channels** folder.\n3. Click the name of the desired site.\n4. Click the **/** folder.\n\n    ![instrução CMS -pt](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/storefront/cms-portal-legado/layout/como-alterar-banner_1.png)\n\n5. Click **Home > Settings**.\n\n    ![cms-home-settings PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/storefront/cms-portal-legado/layout/como-alterar-banner_2.png)\n\n6. In the window that opens, click the pencil icon to edit.\n\n    ![cms_home_settings_lapis pt](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/storefront/cms-portal-legado/layout/como-alterar-banner_3.png)\n\n7. In the form that opens, complete the fields with the banner settings. Learn more about each field in the [Banner form fields](#banner-form-fields) section.\n8. Click `Update Content List` to update the banner content. The form will close, and the window opened in step 6 will be displayed.\n9. Click `Save Content` to save the information. A pop-up will appear with the message `Settings saved successfully`.\n10. Click `OK` to close the pop-up.\n11. Click `Save Settings`\n\n    >⚠️ If you leave the page without clicking the `Save Settings` button, as indicated in the last step, you'll lose all the changes made in the banner registration.\n\n## Banner form fields\n\nThe banner form is divided into two sections:\n\n- [**Content**](#content)\n- [**Display Condition**](#display-condition)\n\n### Content\n\n| Field | Description |\n| --- | --- |\n| **Content Name** | Internal name that identifies the banner in the CMS. |\n| **Width** | Image width in pixels (example: `1170px`). |\n| **Height** | Image height in pixels (example: `500px`). |\n| **File Type** | File type. For banners, select `image`. |\n| **URL** | Destination link when clicking the banner. |\n| **Banner/Preview** | Field to add the banner image. See more details in the [Changing or adding the banner image](#changing-or-adding-the-banner-image) section. |\n\n### Display Condition\n\nDisplay conditions allow you to segment when and where the banner will be displayed, as shown in the following table:\n\n| Field | Description |\n| --- | --- |\n| **Partner/Campaign/Source** | Displays the banner when the visitor's source URL contains matching UTMs (for example, `utm_source=google&utm_medium=cpc`). |\n| **Keywords** | Links the banner's display to searches for specific terms on the site. |\n| **Category/Brand** | Links the banner's display to specific category and/or brand pages. |\n| **Active Content** | Enables the banner to be displayed in the store. |\n| **From/To** | Sets the period during which the banner will be active. See more details in the [Scheduling a banner](#scheduling-a-banner) section. |\n\n## Changing or uploading the banner image\n\nTo make a change or upload a new image, follow the steps below:\n\n1. In the **Content** section of the banner form, click `add file`. The **Insert File** window will open, with options to find an existing file or upload a new one.\n\n    ![inserir-image-banner](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/storefront/cms-portal-legado/layout/inserir-imagem-banner.png)\n\n2. Choose one of the following options to define the image that will be used in the banner:\n\n   **Use an existing file**\n\n   a. In **Find by name**, type the file name to find it.\n\n   b. If you know the file identifier, you can complete the `File Id` field to find it.\n\n   c. Click `Find` to run the search.\n\n   **Upload a new image**\n\n   a. In **Insert a new file**, click `Browse for file`.\n\n   b. Select the image from your computer.\n\n3. After finding or selecting the file, click `Add` to link it to the banner.\n4. Click `Update Content List` to update the banner content.\n5. Click `Save Content` to save the information. A pop-up will be displayed with the message `Settings saved successfully`.\n6. Click `OK` to close the pop-up.\n7. Click `Save Settings`\n\n    >⚠️ If you leave the page without clicking `Save Settings`, as indicated in the last step, all the settings made when adding the banner will be lost.\n\n## Scheduling a banner\n\nTo schedule a banner, configure the **From** and **To** fields with the start and end dates for displaying the banner, and make sure to select `Active Content`. If the `Active Content` option isn't checked, the banner won't be displayed, even if the dates are configured.\n\n>⚠️ The CMS Portal (Legacy) uses **UTC-0 (GMT)** in the **From** and **To** fields. For example, if you want the banner to be displayed starting at 10:00 AM Brasília time (UTC-3), set the **From** field to 13:00 (10:00 AM + 3 hours = 13:00 UTC-0)."}