Alterar banner

Layout

Usaremos como exemplo um banner da Home no passo-a-passo. Porém, estas instruções podem ser utilizadas para qualquer página do site.

Acesse o menu Storefront e clique em Layout.
Clique na pasta CMS.
Clique na pasta Sites and Channels.
Clique no nome do website desejado.
Clique na pasta /.
${"base64":" ","img":{"width":1111,"height":475,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":37917,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/Storefront/Layout/como-alterar-banner_1.png"}}$
Clique no arquivo Home.
Clique na aba Settings.
Clique no ícone de lápis para editar.
${"base64":" ","img":{"width":2314,"height":649,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":67120,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/Storefront/Layout/como-alterar-banner_2.png"}}$
Será aberta a janela de banners.
Clique no ícone de lápis que aparecerá.
${"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAIAAAB2XpiaAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAFklEQVR4nGNYsnrD8nVbT168rmtsDgAzgwcS0rARDQAAAABJRU5ErkJggg==","img":{"src":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/Storefront/Layout/como-alterar-banner_3.png","width":983,"height":280,"type":"png"}}$
Será aberto o formulário de banner.

Altere o conteúdo do formulário:

Para fazer uma alteração ou cadastro de nova imagem, siga os passos abaixo:

Clique em Adicionar arquivo.
Clique no botão Localizar para selecionar a imagem.
Após selecionar o arquivo no seu computador, aparecerá o botão de Salvar arquivo. Atenção: o nome do arquivo não pode estar entre aspas.
Clique no botão Adicionar.
Clique na opção Update Content List.
Clique na opção Save Content.
Clique no botão de Save Settings.

OBS.: Se você não clicar no botão Save Settings, indicado no último passo, e sair da página, você perderá todo o cadastro do banner.