{"section":"tutorials","requestedLocale":"pt","requestedSlug":"configurar-template-no-smartcheckout-update","locale":"pt","slug":"configurar-template-no-smartcheckout-update","path":"docs/pt/tutorials/checkout/configurações-do-checkout/configurar-template-no-smartcheckout-update.md","branch":"main","content":"O __Portal__ é usado para renderizar as telas de __Checkout__ (Carrinho, Dados Pessoais, Endereço, Forma de Pagamento) e __OrderPlaced__ (Tela de confirmação de compra). Neste artigo será apresentado como cadastrar e configurar os recursos do Portal.\n\nO módulo __Checkout__ no Admin, exibe os sites que estão cadastrados para a sua conta. Por meio dele, também é possível criar um novo site, editar e configurar informações sobre os sites já existentes.\n\n> ℹ️ Cada site cadastrado corresponde a um multidomínio (caso a conta possua multidomínios contratados). Para contas que não utilizam multidomínios, não é necessário cadastrar mais de um site neste módulo. Saiba mais em [Criar multiloja/multidomínio](/pt/docs/tutorials/gerenciando-uma-multiloja).\n\n## Criar novo site\n\n1. No Admin VTEX, acesse __Configurações da loja > Storefront > Checkout__, ou digite __Checkout__ na barra de busca no topo da página.\n2. Clique no botão `Novo Site`.\n3. Preencha os seguintes campos:\n\n
\n - **Nome**: insira aqui o nome desejado para o site.
\n - **Loja**: preencher com o nome da conta, que pode ser encontrado em **Configurações da Conta > Gerenciamento da Conta > Contas > Nome da Conta**.
\n
\n4. Clique em `Salvar`.\n\nCriação do novo site: \n\n\n\nAcesso ao __Nome da Conta__: \n\n\n\n## Editar e configurar site\n\n1. No Admin VTEX, acesse __Configurações da loja > Storefront > Checkout__, ou digite __Checkout__ na barra de busca no topo da página.\n2. Clique no ícone do site desejado.\n3. Ao acessar o menu de opções azul localizado na parte superior da página, é possível realizar as seguintes ações:\n - __Sites__: retornar para a tela inicial dos sites cadastrados.\n - __Editar__: editar o \"Nome\" e \"Loja\".\n - __Checkout__: realizar configurações básicas, como Cálculo de frete, Google Tag Manager, entre outras.\n - __Pedidos__: configurar razões de cancelamento e de substituição de pedidos.\n - __Código__: exibir e criar templates relacionados ao site.\n - __Páginas__: exibir as páginas existentes para o site. \n\nExemplo de sites existentes em uma mesma conta:\n\n\nExemplo de páginas disponíveis para um site:\n\n\nCaso deseje __excluir__ um site, clique no botão de exclusão do site desejado, como no exemplo indicado abaixo:\n\n\nA seguir, vamos aprofundar o passo a passo da configuração das oções de menu: __Código__ e __Checkout__, sendo estas responsáveis por configurar as páginas de *Checkout* e *Order Placed*.\n\n## Configurar Checkout\n\n> ⚠️ Para realizar as configurações do Checkout, os usuários precisam ter um perfil de acesso com o [recurso do License Manager](/pt/docs/tutorials/recursos-do-license-manager) **Manage portal**. É necessário que o usuário que for criar o novo perfil de acesso tenha o perfil **Owner (Admin Super)**.\n\n1. No Admin VTEX, acesse __Configurações da loja > Storefront > Checkout__, ou digite __Checkout__ na barra de busca no topo da página.\n2. Clique no ícone do site desejado.\n3. No menu de opções azul localizado na parte superior da página, clique em __Checkout__ e configure os campos abaixo, conforme necessário:\n\n
\n - **Título**: caso informado, será exibido no título das páginas de carrinho, finalização de compra e pedido confirmado.
\n - **Google Tag Manager**: informe o ID (no formato `GTM-XXXX`) do seu contêiner do [Google Tag Manager](https://www.google.com/tagmanager/), caso deseje usá-lo automaticamente.
\n - **Google Maps API Key**: a chave é utilizada em duas situações: quando a função de Entrega com base na coordenada geográfica está ativa ou caso esteja disponível a opção de **Retirada em loja**.
\n - **Cálculo das opções de Entrega (Beta e Stable)**: selecione se o cálculo do frete será feito a partir da planilha ou por geolocalização.
\n
\n\n\n\n## Configurar código\n\n1. No Admin VTEX, acesse __Configurações da loja > Storefront > Checkout__, ou digite __Checkout__ na barra de busca no topo da página.\n2. Clique no ícone do site desejado.\n3. No menu de opções azul localizado na parte superior da página, clique em __Código__. Será exibido, à direita, um menu de __Arquivos__ e __Templates__ com todos os templates de seu site, configurados pelo sistema.\n\n\n\n### Configurar templates do menu \"Código\"\n\nÉ possível customizar as páginas do seu site, além de configurar outras funcionalidades em HTML por meio do menu de __Arquivos__ e __Templates__. \n\nO código HTML preenchido no template corresponde ao que aparecerá nas páginas de __checkout__ e __order placed__ de seu site.\n\nDos templates disponíveis templates, os únicos que não podem ser alterados são __vtex-checkout__ e __vtex-orderPlaced__. Estes correspondem ao funcionamento nativo da plataforma, renderizando o conteúdo principal das páginas de __checkout__ e __order placed__.\n\n> ⚠️ Javascripts incluídos diretamente em quaisquer templates do Portal serão ignorados pela plataforma. Ou seja, no momento da renderização da página, a plataforma o removerá. Isso porque o [SmartCheckout](/pt/tutorial/smartcheckout-preenchimento-automatico-de-dados-do-cliente--2Nuu3xAFzdhIzJIldAdtan#) apenas aceita scripts originados no Google Tag Manager. Assim, sempre que houver necessidade de realizar alguma customização (ou mesmo inserção de tags específicas) via javascript, utilize [Google Tag Manager](/pt/tutorial/integration-with-google-tag-manager--frequentlyAskedQuestions_616#).\n\n### Exemplos de preenchimento de templates\n\nAbaixo temos exemplos de como os códigos presentes nos templates do __checkout-header__, __checkout-footer__, __vtex-checkout__ e __vtex-orderPlaced__ podem ser preenchidos e a sua visualização correspondente no site:\n\n- Template __checkout-header__ e cabeçalho da página do site:\n\n\n\n\n\n- Template __checkout-footer__ e rodapé da página do site:\n\n\n\n\n\n- Template __vtex-checkout__ e página do carrinho no Checkout:\n\n \n\n\n\n- Template __vtex-orderPlaced__ e página do pedido confirmado:\n\n \n\n\n\n### Contas com multidomínio\n\nAs contas que possuem multidomínio podem usar apenas um site, caso não haja necessidade de configurações específicas. Isso porque, ainda que exista apenas um site, a plataforma inclui uma classe na tag \"body\" de acordo com o domínio acessado. Dessa forma, é simples aplicar layouts diferentes para o mesmo site.\n\nClasse inserida na tag \"body\" de acordo com o domínio acessado:\n\n"}