Como incluir banners em minha loja?

Aprenda o passo a passo para inserir um banner na sua loja.

Clara Parente avatar
Escrito por Clara Parente
Atualizado essa semana

Como adicionar banners em minha loja?

Dentro de cada layout, você encontrará diversos tipos de banners, o que muda entre eles basicamente é o tamanho e o local em que será exibido. Para configurá-los, confira o passo a passo abaixo:

01 - No painel da sua loja, acesse Visual > Banners

02 - Escolha o tipo de banner que deseja inserir na loja conforme os exemplos descritos acima e clique em Adicionar banner.

💡É importante saber: observe se a disposição do layout escolhida para sua loja, suporta o tipo de banner que irá cadastrar. Caso contrário, ele não será exibido.

A disposição do layout é escolhida no menu Personalize sua loja > Visual da Loja:

03 - Na tela seguinte, você visualizará a tela de configuração do banner onde será exibido a posição dele na loja e os campos de preenchimento e ativação.

  • Banner ativo: indica se o banner está ativo ou não na loja.

  • Nome do banner: a informação inserida neste campo é apresentada no ALT text da imagem do banner, portanto, para personalizar o ALT text e aprimorar a otimização de SEO, basta editar o conteúdo neste campo específico.

  • Posição do banner: a posição onde ele será exibido na loja.

  • Página de publicação: local da loja onde o banner deverá ser exibido.

  • Link do banner: link para onde o cliente deve ser direcionado ao clicar no banner.

  • Quando clicar no link: defina se ao clicar no banner o cliente o link será aberto na mesma janela ou em uma nova janela.

  • Imagem do Banner: envie a imagem que você deseja exibir neste banner.
    Dica extra: É uma boa prática para favorecer SEO da sua loja frente ao ranqueamento dos buscadores de pesquisa, renomear o arquivo da imagem com informações do seu produto/loja/campanha, por exemplo, colecao-de-semijoias-folheadas.jpg é melhor que IMG00023.JPG

    ​Importante: Recomendamos que o nome do arquivo não tenha acento e caracteres especiais, para que não gere nenhum erro em outras ferramentas, por exemplo: XML.

  • Título do banner: este campo exibe o texto sob a imagem do banner. Importante destacar que este campo é opcional, e a sua inclusão deve ser cuidadosamente avaliada para garantir harmonia estética no seu banner. No exemplo abaixo, foi inserido o título "Semijóias".

  • Mapa da imagem?: ative essa opção caso deseje inserir um mapa de links para o seu banner.


Quais são as dimensões dos banners?

Full Banner
O full banner pode ser exibido de duas maneiras na nova estrutura, uma 100% ocupando todo o espaço horizontal do tema (largura máxima de 1920 px) e a outra ao lado de um componente, que pode ser o box mais vendidos, ou o banner lateral do full banner (nesta disposição a largura máxima é de 300px).

Banner Tarja
O banner tarja é exibido em todo o espaço horizontal do tema (largura máxima 1140px) e abaixo do full banner.

Mini Banners
Os mini banners são um grupo de três banners que podem ser dispostos abaixo do full banner ou abaixo do banner vitrine, caso os espaços designados aos mini banners não sejam preenchidos com os três banners, um texto com o titulo “Mini banner” ocupará o espaço do banner que estiver faltando.
Abaixo do full banner os mini banners ocupam 100% do espaço horizontal do tema e cada um deles tem a largura máxima de 260px, abaixo do banner vitrine os mini banners são dispostos ao lado da coluna dentro da área de conteúdo, nesta disposição a largura máxima de cada um é de 270px.

Banner Vitrine
O banner vitrine é disposto dentro da área de conteúdo e pode ser exibido de duas maneiras: sozinho ocupando 100% da área de conteúdo (largura máxima de 850px), ou ao lado da newsletter (largura máxima de 560px).

Banner Lateral
O Banner lateral é exibido na coluna abaixo dos menus e dos componentes, a largura máxima do banner lateral é de 260px.

Pronto! Feito isso, seus banners já terão sido inserido e disponíveis na sua loja.

Meu banner não aparece no mobile, o que fazer?

A versão mobile é uma versão compacta da sua loja, nela somente o Full banner é exibido, os demais banners não são exibidos para otimizar a navegação nos dispositivos móveis.


Se você está com dificuldades para adicionar os banners nos temas grátis, confira os artigos abaixo:

Respondeu à sua pergunta?