Central de Atendimento Nuvem Configure sua loja Layout Personalização básica Banners e logo

Como adicionar banners promocionais em sua loja?

Passos para configurar banners promocionais na página inicial da loja virtual.

Última atualização: 10/11/2023

Os banners promocionais é uma ferramenta bastante útil, que permite divulgar as promoções e descontos da sua loja virtual de forma fácil e profissional, sendo possível colocar imagens, texto e também um botão que leva seus clientes diretamente para qualquer página dentro da loja.

Delete

Success

Essa funcionalidade não está disponível nos Layouts Focus, Atlântico e Idea.


Neste tutorial, te mostramos como configurar os banners promocionais em sua loja virtual.

Vamos começar!

❗ Os passos abaixo podem ser realizados pelo desktop (notebook/computador) ou pela versão web do seu navegador em um smartphone (celular).

1. Acessar o painel administrador Nuvemshop.

2. Siga pelo caminho "Layout > Personalizar layout" e clicar em "Personalizar seu layout atual".

3. Em seguida, ir em  "Página Inicial > Banners Promocionais".

4. Irá abrir um menu com as configurações dos banners promocionais, lembrando que essas opções mudam de acordo com o Layout Instalado. Para saber como configurar os banners promocionais de sua loja, localizar o layout instalado, clicar sobre o nome e seguir os passos para configurá-lo.

Recife

No layout  Recife você pode adicionar uma quantidade ilimitada de banners na página inicial da sua loja. Para isso, siga os seguintes passos:


1. Uma vez dentro da opção Banners promocionais, defina como o banner deverá ser exibido marcando ou desmarcando as seguintes opções:


  • Mostrar texto fora da imagem;
  • Usar a mesma altura para todos os banners;
  • Remover espaços entre os banners.


Além disso, também é possível configurar o Alinhamento do texto (Esquerda ou Centralizado).



2. Em seguida, o próximo passo é carregar as imagens com o tamanho recomendando de 930px por 465px, para isso, clicar em "Selecionar imagem".



3. Ao finalizar de carregar as imagens, defina um título para os banners, a disposição dos banners para celulares e computadores (grade ou carrossel) e quantidade de banners em computadores (até 4 banners por linha).


Delete

Morelia, Uyuni, Toluca, Lima e Cali

Nos layouts Morelia, Lima, Cali, Toluca e Uyuni você pode adicionar uma quantidade ilimitada de banners na página inicial da sua loja. Para isso, siga os seguintes passos:


1. Uma vez dentro da opção Banners promocionais, definir como o banner deverá ser exibido marcando ou desmarcando as seguintes opções:

  • Mostrar texto fora da imagem;
  • Mostrar banners dentro de um carrossel;
  • Usar a mesma altura para todos os banners;
  • Remover espaços entre os banners.



2. Para carregar as imagens, clicar em "Selecionar imagem", procurar pelas imagens e carregá-la. Lembrando que a imagem deve ter um tamanho de 930px por 465px.



Delete

Warning

O tamanho da imagem  recomendado para o layout Morelia é de 1920px por 900px.


3. Ao finalizar de carregar as imagens, definir um título para os banners, a disposição dos banners para celulares (até 2 banner por linha) e computadores (até 4 banner por linha)



Delete

Success

Nos Layouts Morelia, Cali e Uyuni não é possível alterar a disposição de banners em celualres.

Delete

Cubo e Amazonas

Os banners promocionais são exibidos da esquerda para a direita através de computadores e notebooks, e de cima para baixo para a versão mobile/celulares.

Para configurá-los, siga os passos abaixo:

1. Primeiro você pode definir a largura da tela, para isso, marcar a opção "Aumentar à largura da tela" se deseja aumentá-la.


2. Em seguida, na seção Promoção (1, 2 ou 3), defina quantos banners serão exibidos na página inicial marcando a opção "Mostrar banner".


Delete

Warning

O Layout Cubo permite configurar até 3 banners promocionais.


3. Depois clicar em "Carregar imagem (JGP, GIF, PNG)".



4. Uma vez dentro, você pode carregar um banner de 620px de largura por 235px de altura, basta clicar em "Selecionar imagem", procurar pelo arquivo e carregue-lo.

Delete

Info

Para saber como criar banners, consultar o nosso tutorial 👉 Como criar banners gratuitos para usar em meu layout?.


Delete

Warning

Para remover a imagem, após o seu carregamento, irá aparecer algumas opções, basta clicar no ícone da "lata de lixo 🗑️" para excluir a imagem.


5. Após carregar a imagem para seu banner promocional, você pode personalizá-lo acordo com seu Layout:

Cubo

No Layout Cubo, é possível adicionar um Título, DescriçãoLinkde direcionamento para uma página da sua loja virtual.

Delete

Amazonas

No Layout Amazonas, é possível adicionar um Título, Texto do botãoLink de direcionamento para uma página da sua loja virtual.

Delete


6. Repita esses passos para todos os banners que você deseja exibir na página inicial da loja. 

Delete

Simple

Para configurar os banners promocionais no Layout Simple, siga os passos abaixo:

1. Na seção Banner (1, 2 ou 3), definir quantos banners serão exibidos, para isso, marcar a opção "Mostrar banner".


Delete

Warning

O Layout Simple permite configurar até 3 banners promocionais.


2. Depois clicar em "Carregar imagem (JGP, GIF, PNG)".


3. Uma vez dentro, você pode carregar um banner de 600px de largura por 600px de altura, basta clicar em "Selecionar imagem", procurar pelo arquivo e carregue-lo.

Delete

Info

Para saber como criar banners, consultar o nosso tutorial 👉 Como criar banners gratuitos para usar em meu layout?.



Delete

Warning

Para remover a imagem, após o seu carregamento, irá aparecer algumas opções, basta clicar no ícone da "lata de lixo 🗑️" para excluir a imagem.


4. Por último, personalizar o seu banner promocional adicionando um Título, Descrição, Botão, Link para direcionar seus clientes para uma página dentro da sua loja, Alinhamento do textocor do texto.


5. Repita esses passos para todos os banners que você deseja exibir na página inicial da loja. 

Delete

Bahia

Para o Layout Bahia, os tamanhos dos banners promocionais vão depender da quantidade que você deseja exibir na página inicial da sua loja virtual.

Para configurá-los, siga os passos abaixo:

1. Na seção Quantos banners promocionais você deseja na sua página inicial?, escolher a quantidade banners que serão exibidos, para isso, basta clicar sobre o tipo de Layout, igual o exemplo abaixo:


Delete

Warning

Verifique o tamanho recomendado das imagens de acordo com o tipo Layout dos banners promocionais.


2. Após escolher a quantidade de banners, definir a largura da tela, para isso, marcar a opção "Aumentar à largura da tela" para aumentá-la.


3. Em seguida, adicionar um Título e uma Descrição que serão exibidas na seção dos Banners promocionais na página inicial da loja virtual.


4. O próximo passo vai depender da quantidade de banners que você definiu na seção Quantos banners promocionais você deseja na sua página inicial?.


Na seção Banner de promoção (1, 2 ou 3), definir quantos banners serão exibidos na página inicial da loja marcando a opção "Mostrar banner".


Delete

Warning

O Layout Bahia permite configurar até 3 banners promocionais.


5. Depois clicar em "Carregar imagem (JGP, GIF, PNG)".


6. Uma vez dentro, você pode carregar o banner de acordo com o tamanho recomendado, basta clicar em "Selecionar imagem", procurar pelo arquivo e carregue-lo.

Delete

Success

Antes de carregar a imagem, verificar o tamanho recomendado do banner de acordo com a quantidade de banners disponíveis.


Delete

Warning

Para remover a imagem, após o seu carregamento, irá aparecer algumas opções, basta clicar no ícone da "lata de lixo 🗑️" para excluir a imagem.


7. Por último, personalizar o banner promocional adicionando um Título e Link para direcionar seus clientes para qualquer página da sua loja.


8. Repita esses passos para todos os banners que você deseja exibir na página inicial da loja.

Delete

Material

No Layout Material, os tamanhos dos banners promocionais dependem da quantidade que você deseja exibir na página inicial da sua loja.

Para configurá-los, siga os passos abaixo:

1. Na seção Quantos banners promocionais você deseja na sua página inicial?, clicar sobre o tipo de layout para escolher a quantidade banners que serão exibidos, igual o exemplo abaixo:


2. O próximo passo dependerá da quantidade de banners que você definiu na seção Quantos banners promocionais você deseja na sua página inicial?.


Na seção Banner (1 ou 2), definir quantos banners serão exibidos na página inicial da loja marcando a opção "Mostrar banner".


Delete

Warning

O Layout Material permite configurar até 3 banners promocionais.


3. Depois clicar em "Carregar imagem (JGP, GIF, PNG)".


4. Em seguida, você pode carregar o banner de acordo com o tamanho recomendado, basta clicar em "Selecionar imagem", procurar pelo arquivo pela imagem e carregue-lo.

Delete

Success

Antes de carregar a imagem, verificar o tamanho recomendado do banner de acordo com a quantidade de banners disponíveis.



Delete

Warning

Para remover a imagem, após o seu carregamento, irá aparecer algumas opções, basta clicar no ícone da "lata de lixo 🗑️" para excluir a imagem.


6. Na última etapa, personalizar o banner promocional incluindo um TítuloLink para direcionar seus clientes para uma página dentro da sua loja.


7. Repita esses passos para todos os banners que você deseja exibir na página inicial da loja.

Delete

Silent

O Layout Silent permite exibir apenas 1 (um) banner promocional. Para configurá-lo, siga os passos abaixo:

1. Para exibir o banner, marcar a opção "Mostrar banner".



2. Depois clicar em "Carregar imagem (JGP, GIF, PNG)".


3. Em seguida, carregar uma imagem  de 1425px de largura por 285px de altura, basta clicar em "Selecionar imagem", procurar pela arquivo e carregue-lo.

Delete

Warning

Para remover a imagem, após o seu carregamento, irá aparecer algumas opções, basta clicar no ícone da "lata de lixo 🗑️" para excluir a imagem.


4. Na última parte, personalizar o seu banner promocional incluindo um TítuloLink para direcionar seus clientes ao clicar sobre o banner.

Delete

Lifestyle

No Layout Lifestyle, você pode escolher os tamanhos dos banners promocionais de acordo com a quantidade que você deseja exibir na página inicial da sua loja.

Para configurar, siga os passos abaixo:

1. Na seção Quantos banners promocionais você deseja na sua página inicial?, para escolher o tipo de layout para os banners promocionais, basta clicar sobre uns dos 3 (três) modelos disponíveis, igual o exemplo abaixo:



2. O próximo passo dependerá da quantidade de banners que você definiu na seção Quantos banners promocionais você deseja na sua página inicial?.

Na seção Banner (1, 2 ou 3), definir quantos banners que serão exibidos na página inicial, para isso, marcar a opção "Mostrar banner".



3. Depois clicar em "Carregar imagem (JGP, GIF, PNG)".


4. Na próxima tela, carregue a imagem do banner de acordo com o tamanho recomendado, basta clicar em "Selecionar imagem", procurar pelo arquivo e carregue-lo.

Delete

Success

Antes de carregar a imagem, verificar o tamanho recomendado do banner de acordo com a quantidade de banners disponíveis.



Delete

Warning

Para remover a imagem, após o seu carregamento, irá aparecer algumas opções, basta clicar no ícone da "lata de lixo 🗑️" para excluir a imagem.


5. Em seguida, personalizar o seu banner incluindo um Título, uma Descrição, Botão e um Link que permite direcionar seus clientes para qualquer página dentro da sua loja ao clicar sobre o botão dentro banner.



6. E por último, marcar a opção "Abrir link em uma nova janela" caso queira que ao clicar no botão dentro do banner, abra a página em outra janela no navegador.



7. Repita esses passos para todos os banners que você deseja exibir na página inicial da loja.

Delete

Trend

Os banners promocionais no Layout Trend serão exibidos da esquerda para a direita em computadores e notebooks, e de cima para baixo em celulares.

Para configurar, siga os passos abaixo:

1. Na seção Banner (1, 2 ou 3), marcar a opção "Mostrar banner" para definir a quantidade de banners a serem exibidos.




Delete

Warning

O Layout Trend permite configurar até 3 banners promocionais.


2. Depois clicar em "Carregar imagem (JGP, GIF, PNG)".



3. No próximo passo, carregar um banner de 600px de largura por 900px de altura, basta clicar em "Selecionar imagem", procurar pelo arquivo imagem e carregue-lo.


Delete

Warning

Para remover a imagem, após o seu carregamento, irá aparecer algumas opções, basta clicar no ícone da "lata de lixo 🗑️" para excluir a imagem.


4. Por último, personalize o seu banner incluindo um Título, uma Descrição, Botão e um Link que permite direcionar seus clientes para qualquer página dentro da sua loja ao clicar no botão.



5. Repita esses passos para todos os banners que você deseja exibir na página inicial da loja.

Delete


5. Após configurar os elementos do banners promocionais, basta clicar no botão "Publicar alterações".

Clicar no botão para publicar as alterações realizadas no layout

Se você estiver editando pelo rascunho, pode escolher entre "Salvar rascunho" ou "Publicar".

Clicar nos botões para salvar as edições do rascunho ou publicar na loja

Delete

Info

Para testar as alterações sem publicar o Layout, recomendamos que use a versão rascunho. Para saber mais, consultar o tutorial 👉 Como editar o layout da minha loja em rascunho?.

Pronto! 🙌  

Ao finalizar essa configuração, os banners promocionais já serão exidos em sua loja igual o exemplo abaixo.

O artigo ajudou você?