{"section":"tutorials","requestedLocale":"pt","requestedSlug":"anuncios-do-vtex-sales-app","locale":"pt","slug":"anuncios-do-vtex-sales-app","path":"docs/pt/tutorials/vtex-sales-app/anuncios-do-vtex-sales-app.md","branch":"main","content":"A nova área de anúncios no VTEX Sales App conta com dois tipos principais de anúncios: produtos específicos ou resultados de busca. Essa flexibilidade permite que os merchants adaptem suas estratégias de marketing de acordo com suas necessidades e objetivos específicos, promovendo produtos individuais ou grupos de produtos relacionados.\n\nPara customizar a vitrine de uma loja, os lojistas podem adicionar uma página de `Anúncio por loja` especificando o ID da loja no [Master Data](https://developers.vtex.com/docs/guides/master-data-introduction) ao qual o anúncio será vinculado, permitindo criar anúncios personalizados para cada loja.\n\nNeste documento, forneceremos instruções detalhadas sobre como instalar, configurar e utilizar a nova área de anúncios. Siga os passos descritos abaixo para configurar esta ferramenta e impulsionar suas vendas online.\n\n* [Instalar as dependências da VTEX](#instalar-as-dependencias-da-vtex)\n* [Configurar o aplicativo Headless CMS](#configurar-o-aplicativo-headless-cms)\n* [Criar página de anúncios](#criar-pagina-de-anuncios)\n* [Ativar o menu de anúncios no VTEX Sales App](#ativar-o-menu-de-anuncios-no-vtex-sales-app)\n* [Acessar os anúncios no VTEX Sales App](#acessar-os-anuncios-no-vtex-sales-app)\n\n## Instalar as dependências da VTEX\n\nAntes de instalar as dependências, você deve possuir o [VTEX IO CLI](https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-install) instalado. Com o VTEX IO CLI instalado, execute os seguintes comandos no prompt do seu computador para instalar as dependências necessárias:\n\n1.\n    ```\n    vtex login {account}  \n    ```\n2.\n    ```\n    vtex install vtex.admin-cms@1.x vtex.admin-cms-graphql@0.x vtex.admin-cms-graphql-rc@1.x vtex.admin-releases@0.x vtex.cms-builder-sf-jamstack@1.x\n    ```\n\n## Configurar o aplicativo Headless CMS\n\n1. No Admin VTEX, acesse  **Aplicativos > Meus Aplicativos**, ou digite **Meus Aplicativos** na barra de busca no topo da página.\n2. Clique em `Configurações` do item **CMS (alpha)**.\n3. Clique em `Add More`.\n4. No campo **Project ID**, digite `assisted-sales-app`.\n5. No campo **Sections URL**, digite `https://instore--instore.vtex.app/assisted-sales/cms/sections.json`.\n6. No campo **Content types URL**, digite `https://instore--instore.vtex.app/assisted-sales/cms/content-types.json`.\n7. Clique em `Save`.\n\n## Criar página de anúncios\n\nPara criar uma página de anúncios para o VTEX Sales App, siga os passos abaixo:\n\n1. Acesse a URL do VTEX Admin: \n```https://{conta_principal}.myvtex.com/admin/new-cms/assisted-sales-app```\n2. Clique em **Criar Novo** e selecione **Anúncios**.\n3. Clique em **Untitled** para editar e incluir o nome que desejar. Recomendamos o nome **Anúncios**.\n4. Na aba **Seções**, clique no botão `+` para adicionar uma nova seção. Cada seção é um uma coleção de produtos ou termos de busca. Cada seção será exibida como uma vitrine no formato de carrossel. Você pode ordernar as vitrines clicando nos botões `Mover para baixo` ou `Mover para cima`. \n5. Selecione um tipo de anúncio, produtos ou resultados de buscas. \n  - **Vitrine de produtos:** exibirá cada produto e SKU (opcional) que você determinar. Adicione as  seguintes informações:\n    * **Título da vitrine:** nome da vitrine que  será exibido na página.\n    * **ID do produto:** número identificador do produto que você deseja exibir. Campo obrigatório.\n    * **SKU ID do produto:** número identificador do  SKU do produto que você deseja exibir. Campo opcional.\n![vitrine-produto-pt](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/vtex-sales-app/anuncios-do-vtex-sales-app_1.png)\nApós preencher os campos, será exibido a imagem do produto com o preço com a \"partir de\". Caso você inclua o SKU, será exibido o preço e promoção do SKU indicado. Você pode incluir mais produtos clicando em `+ NOVO PRODUTO`. É possível adicionar até 10 produtos em cada vitrine. \nO resultado da vitrine de produtos será exibido conforme imagem abaixo.\n![vitrine-produto-2-pt](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/vtex-sales-app/anuncios-do-vtex-sales-app_2.png)\n  - **Vitrine de resultado de buscas:** exibirá produtos de um resultado de busca que você definir. Adicione as  seguintes informações:\n    * **Título da vitrine:** nome da vitrine que  será exibido na página.\n    * **Imagem da busca:** imagem que representará a seleção de produtos na vitrine.\n    * **Nome da busca:** nome da busca que será exibido na página.\n    * **Termo de busca:** termo de busca que será referência dos produtos.\n![vitrine-busca-pt](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/vtex-sales-app/anuncios-do-vtex-sales-app_3.png)\nQuando o vendedor clicar no termo de busca, ele será direcionado para o resultado de buscas que foi determinado em **Termo de busca**. Você também poderá incluir até 10 buscas em cada vitrine. Veja o resultado na imagem abaixo:\n![vitrine-busca-2-pt](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/vtex-sales-app/anuncios-do-vtex-sales-app_4.png)\n<ol start=\"6\">\n  <li>Depois de criar as seções, clique em `Salvar`, em seguida, clique em `Publicar` e `Publicar agora` para finalizar.</li>\n</ol> \n- **Vitrine de coleção:** exibirá produtos da coleção que você definir. Adicione as seguintes informações: **Título da vitrine:** nome da vitrine que será exibido na página. **ID da coleção:** número do identificador da coleção que será exibido na página.\n\n![Vitrine-PT](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/vtex-sales-app/anuncios-do-vtex-sales-app_5.png)\n\nA publicação da vitrine entrará na fila de indexação e estará publicada em torno de alguns  segundos.\n\n## Ativar o menu de anúncios no VTEX Sales App\n\n1. Acesse as configurações técnicas do VTEX Sales App em: \n```https://{conta_principal}.myvtex.com/admin/portal/#/sites```\n2. Clique no botão <i class=\"fas fa-cog\"></i>. \n3. Selecione a aba **Código**.\n4. Selecione na aba lateral o arquivo `checkout-instore-custom-js`.\n![checkout-instore-custom-js-file](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/vtex-sales-app/anuncios-do-vtex-sales-app_6.png)\n5. No objeto `window.INSTORE_CONFIG`, adicione a flag `enableExplore: true,`.\n![window.INSTORE_CONFIG](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/vtex-sales-app/anuncios-do-vtex-sales-app_7.png)\n6. Clique em <i class=\"fas fa-save\"></i> `Salvar`. \n7. Opcionalmente, você pode determinar que a página inicial do vendedor seja a página de anúncios. Para isso, adicione a flag `initialPage : 'advertisements',` no objeto `window.INSTORE_CONFIG`.\n\n![initialPage : advertisements](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/vtex-sales-app/anuncios-do-vtex-sales-app_8.png)\n\n## Acessar os anúncios no VTEX Sales App\n\nNo VTEX Sales App, o vendedor terá a possibilidade de acessar a página de anúncios de duas maneiras diferentes:\n\n* **Página inicial:** se o administrador da loja cadastrou previamente a página de anúncios como a página inicial do vendedor, ao efetuar login na plataforma, o vendedor será direcionado diretamente para a página de anúncios. Essa configuração garante que os vendedores estejam sempre atualizados sobre os anúncios e promoções relevantes, assim que acessarem o sistema.\n* **Menu Explorar:** caso a página de anúncios não seja a página inicial do vendedor, ela ainda pode ser facilmente acessada por meio do menu **Explorar**. Para acessar a página de anúncios, o vendedor deve clicar no menu **Explorar**. Isso levará o vendedor diretamente à página de anúncios, onde poderá visualizar e interagir com os produtos e promoções disponíveis.\n\n![vitrine-sale-app-pt](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/vtex-sales-app/anuncios-do-vtex-sales-app_9.png)"}