Table of Contents
Como consultar as dimensões recomendadas no editor de layout?Recomendações de tamanho dos bannersOs layouts na Nuvemshop oferecem a possibilidade de adicionar banners de diversos tamanhos e em diversas páginas de sua loja.
Por esse motivo, não existe um único tamanho recomendado de banner, ou seja, as dimensões variam de layout para layout, de acordo com a seção da loja onde a imagem é adicionada (categorias, rodapé, página de contato, página inicial, etc).
Primeiro, vamos te mostrar como descobrir as dimensões recomendadas para os banners pelo painel de edição do layout. Depois, traremos as medidas recomendadas para cada seção dos layouts da Nuvemshop.
Warning
Algumas seções não estão disponíveis em todos os layouts, como os banners de marca, banner informativo, imagem de fundo e outras. Se o tema que você está personalizando não aparecer em alguma das opções, significa que o mesmo não possui o recurso.
Como consultar as dimensões recomendadas no editor de layout?
Clique para ver os passos
1. No painel administrador Nuvemshop, seguir pelo caminho "Minha Nuvemshop > Layout" e depois clicar em "Personalizar seu layout atual".
2. Dentro desse menu, você encontrará diversas opções de banners. Basta selecionar o tipo de banner que você deseja de adicionar na sua loja e clicar em "Carregar imagem".
3. Na próxima etapa, logo abaixo da opção Selecionar Imagem, você verá as medidas recomendadas para o banner escolhido, como mostramos no exemplo abaixo, em que a imagem deverá ter 980px de largura por 90px de altura.
Success
Esses valores variam conforme o Layout e o tipo de banner escolhidos.
4. Após confirmar as medidas corretas do banner, informar ao designer de sua loja para poder criar a arte e carregar o banner depois.
Se você não possui um designer, recomendamos usar a ferramenta 🌐 Canva para criar um banner 100% gratuito. No tutorial 👉 Como criar banners gratuitos para usar em meu layout? ensinamos como utilizar essa ferramenta.
E caso queria saber como personalizar a página inicial da sua loja, consulte o tutorial 👉 Como personalizar a página inicial da minha loja?
Success
Se você usa o Idea, Bahia, Amazonas ou Cubo, recomendamos consultar 📝 Como configurar banners rotativos nos layouts Idea, Bahia, Amazonas e Cubo?.
Isso porque esses Layouts são otimizados para navegação em smartphones (celulares).
Recomendações de tamanho dos banners
Success
Para todos os layouts, a recomendação de tamanho para o logo é de 575px x 230px e para o favicon é de 130px x 130px.
Clique nos botões para visualizar os detalhes de cada seção. 👇
Banner rotativo
Alguns layouts oferecem a possibilidade de enviar imagens diferentes para desktop e mobile. Confira as recomendações de cada versão:
Desktop
| Layout | Medidas |
| Amazonas | 1580px x 450px |
| Atlántico | 1580px x 740px |
| Bahia e Idea | 1580px x 850px |
| Cubo | 1580px x 600px |
| Focus | 1130px x 500px |
| Lifestyle, Silent e Trend | 1920px x 900px |
| Material | 1400px x 520px |
| Simple | 1400px x 620px |
| Rio | 1580px x 600px |
| Lima e Cali | 1580px x 600px |
| Toluca e Uyuni | 1580px x 700px |
Mobile
❗ Esse recurso não está disponível nos temas: Cubo, Focus, Lifestyle, Material e Silent.
| Layout | Medidas |
| Bahia e Idea | 820px x 1460px |
| Simple | 500px x 550px |
| Rio e Atlántico | 820px x 1200px |
| Amazonas, Simple, Lima, Uyuni, Trend, Toluca e Cali | 820px x 1000px |
O que fazer se a imagem aparecer cortada?
Se as imagens no banner rotativo são exibidas cortadas, recomendamos desmarcar a seguinte opção, dentro da seção de configuração dos banners rotativos no seu painel administrador:
- "Usar uma altura máxima para imagens";
- "Usar a mesma altura para todas as imagens";
- Ou "Aumentar à largura da tela".
❗ O nome dessa opção pode variar conforme o layout que você estiver usando.
Aparece cortado no celular
Conforme mencionamos nas etapas de configuração, os banners do carrossel de imagens são exibidos em escala reduzida nos layouts Idea, Bahia, Cubo e Amazonas.
Portanto, se você identificar que seu banner não aparece completo ao visualizá-lo pelo celular e sua loja possui um dos layouts citados acima, recomendamos consultar o tutorial abaixo para criar um banner que fique bem em todos os dispositivos:
📝 Como preparar as imagens para os banners rotativos nos layouts Idea, Bahia, Amazonas e Cubo?
DeleteBanners de categoria
Você tem a opção de adicionar banners para 1, 2, 3 ou 4 categorias. Confira as recomendações de cada opção:
Categoria 1
| Layout | Medidas |
| Amazonas | 620px x 715px |
| Atlántico, Simple e Trend | 600px x 600px |
| Bahia | 1440px x 750px |
| Cubo | 620px x 620px |
| Focus e Silent | 700px x 700px |
| Idea | 1400 px x 700 px |
| Material | 770px x 620px |
| Simple | 1400px x 620px |
Categoria 2
| Layout | Medidas |
| Amazonas | 620px x 715px |
| Atlántico, Simple e Trend | 600px x 600px |
| Bahia | 700px x 750px |
| Cubo | 620px x 620px |
| Focus, Idea e Silent | 700px x 700px |
| Material | 770px x 620px |
Categoria 3
| Layout | Medidas |
| Amazonas | 620px x 715px |
| Atlántico, Simple e Trend | 600px x 600px |
| Bahia | 440px x 750px |
| Cubo | 620px x 620px |
| Focus | 700px x 700px |
| Idea | 700px x 340px |
| Material | 770px x 620px |
Warning
O layout Idea é o único que permite incluir até 4 banners de categorias, nas dimensões 340px x 340px.
Banners das marcas
| Layout | Medidas |
| Amazonas, Lima, Uyuni, Cali | 300px x 200 px |
| Toluca | 200px x 200px |
| Atlántico | 320px x 160px |
| Idea | 340px x 340px |
Banners promocionais
Você pode incluir até 4 banners promocionais na sua Nuvemshop:
1 banner
| Layout | Medidas |
| Amazonas | 620px x 715px |
| Bahia | 1440px x 750px |
| Cubo | 620px x 235px |
| Lifestyle | 1550px x 200px |
| Material | 1200px x 700px |
| Silent | 1425px x 285px |
| Simple | 600px x 600px |
| Trend | 600px x 900px |
| Rio | 930px x 465px |
2 banners
| Layout | Medidas |
| Amazonas | 620px x 715px |
| Bahia | 700px x 750px |
| Cubo | 620px x 235px |
| Lifestyle | 775px x 200px |
| Material | 600px x 700px |
| Simple | 600px x 600px |
| Trend | 600px x 900px |
| Rio | 930px x 465px |
3 banners
| Layout | Medidas |
| Amazonas | 620px x 715px |
| Bahia | 440px x 750px |
| Cubo | 620px x 235px |
| Lifestyle | 520px x 200px |
| Simple | 600px x 600px |
| Trend | 600px x 900px |
| Rio | 930px x 465px |
Módulos de imagem e texto
| Layout | Medidas |
| Bahia e Simple | 600px x 400px |
| Cubo | 1270px x 300px |
| Focus | 1400px x 500px |
| Lifestyle | 770px x 335px |
| Trend | 1170px x 420px |
Banner com imagem
| Layout | Medidas |
| Lifestyle | 570px x 330px |
| Material | 1170px x 100px |
| Silent | 435px x 390px |
Newsletter
| Layout | Medidas |
| Cubo, Focus, Lifestyle, Material, Silent, Simple e Trend | 280px x 320px |