Para destacar categorias na página inicial da sua loja, além de contar com os menus principal e do rodapé, é possível apresentar banners com imagens e links, que direcionarão o visitante da loja para categorias específicas na loja virtual.
Importante:
Essa opção está disponível em todos os layouts, exceto o Lifestyle.
Neste tutorial, te mostramos como adicionar banners de categorias na página inicial.
Vamos começar!
1. Acesse o painel administrador Nuvemshop.
2. Siga pelo caminho "Minha Nuvemshop > Layout" e depois clique em "Personalizar seu layout atual".
3. Em seguida, clique em "Página Inicial > Banners de categorias". Uma vez dentro, visualizará as opções para adicionar e configurar os banners de categorias.
4. O tamanho e a quantidade dos banners de categorias podem variar conforme o layout. Para saber mais, procure pelo Layout abaixo e clique no botão Ver mais detalhes:
Atlântico, Simple e Trend
Ver mais detalhes
Nos Layouts Atlântico, Simple e Trend é possível configurar até 3 banners de 600 x 600px.
Para carregar a imagem, clique em "Selecionar imagem", procure e carregue a imagem. Lembrando que os formatos suportados pela plataforma são: JPEG, GIF e PNG.
Success
Para que o banner fique com uma boa resolução, observe as indicações de tamanho que a plataforma apresenta. Seguindo as medidas recomendadas, os banners ficarão com uma ótima visualização na loja!
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.
Cubo
Ver mais detalhes
No Layout Cubo é possível configurar até 3 banners de 620 x 620px.
Para carregar a imagem, clique em "Selecionar imagem", procure e carregue a imagem. Lembrando que os formatos suportados pela plataforma são: JPEG, GIF e PNG.
Success
Para que o banner fique com uma boa resolução, observe as indicações de tamanho que a plataforma apresenta. Seguindo as medidas recomendadas, os banners ficarão com uma ótima visualização na loja!
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.
Amazonas
Ver mais detalhes
No Layout Amazonas é possível configurar até 3 banners de 620 x 620px.
Para carregar a imagem, clique em "Selecionar imagem", procure e carregue a imagem. Lembrando que os formatos suportados pela plataforma são: JPEG, GIF e PNG.
Success
Para que o banner fique com uma boa resolução, observe as indicações de tamanho que a plataforma apresenta. Seguindo as medidas recomendadas, os banners ficarão com uma ótima visualização na loja!
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.
Material
Ver mais detalhes
No Layout Material é possível configurar até 3 banners de 770 x 620px.
Para carregar a imagem, clique em "Selecionar imagem", procure e carregue a imagem. Lembrando que os formatos suportados pela plataforma são: JPEG, GIF e PNG.
Success
Para que o banner fique com uma boa resolução, observe as indicações de tamanho que a plataforma apresenta. Seguindo as medidas recomendadas, os banners ficarão com uma ótima visualização na loja!
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.
Silent e Focus
Ver mais detalhes
No Layout Silent é possível carregar até 2 banners de categorias de até 700 x 700 px e Layout Focus é possível carregar até 3 banners de 700 x 700px.
1. Para carregar a imagem, clique em "Selecionar imagem", procure e carregue a imagem. Lembrando que os formatos suportados pela plataforma são: JPEG, GIF e PNG.
Success
Para que o banner fique com uma boa resolução, observe as indicações de tamanho que a plataforma apresenta. Seguindo as medidas recomendadas, os banners ficarão com uma ótima visualização na loja!
Para remover a imagem, após o seu carregamento, irá aparecer algumas opções, basta clicar no ícone da "lata de lixo 🗑️" excluir a imagem.
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.
Idea e Bahia
Ver mais detalhes
Diferentes dos outros Layouts, o Idea e Bahia oferecem uma opção que permite selecionar a quantidade de banners que deverão aparecer na página inicial.
1. Para configurar a quantidade e a posição dos banners, na opção "Quantos Banners de categoria você deseja na sua página inicial?" você deve selecionar o layout dos banners, como o exemplo abaixo:
2. Após selecionar o tipo de configuração dos banners de categorias, clique em "Selecionar imagem", procure e carregue a imagem. Lembrando que os formatos suportados pela plataforma são: JPEG, GIF e PNG.
Success
Para que o banner fique com uma boa resolução, observe as indicações de tamanho que a plataforma apresenta. Seguindo as medidas recomendadas, os banners ficarão com uma ótima visualização na loja!
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.
Info
Para saber como consultar a medida de um banner, siga os passos do tutorial 📝 Quais os tamanhos recomendados para os banners?.
5. Após carregar a imagem do banner de categoria, basta preencher e escolher o conteúdo dos campos de acordo com suas preferências.
Lembrando que as opções estarão divididas por seções e diferirão conforme o layout aplicado em sua loja. Para saber como funciona cada um desses campos, clique no botão abaixo Ver mais detalhes:
Ver mais detalhes
-
Mostrar banner - é aqui onde você habilita ou desabilita a exibição do banner. Basta marcar a opção para ele ficar visível e desmarcá-la quando quiser retirá-lo da loja.
-
Imagem de fundo - você pode escolher uma imagem para representar a categoria. Pode ser uma foto do produto ou um "padrão". (Seguir os passos da etapa 4 desse tutorial para saber como adicionar uma imagem de fundo).
-
Título - a chamada para o banner. Pode ser uma "frase de efeito" ou somente o nome da categoria.
-
Texto do botão - é o nome que aparecerá no botão no banner. Algo como "Veja mais" ou "Confira as ofertas".
-
Link - é o endereço para onde o botão deve direcionar. Para obtê-lo, visite a página da categoria em sua loja e copie o endereço no navegador. Basta colar o link no campo.
-
Alinhamento do texto - você pode escolher o alinhamento centralizado ou à esquerda.
- Cor do texto - a cor do texto poderá ser branco ou preto. A melhor opção dependerá da imagem escolhida para o fundo do banner.
6. Por último, clique em "Publicar Alterações" para finalizar.
Info
Para testar as alterações sem publicar o Layout, recomendamos que use versão de rascunho do Layout. Para saber mais, consulte o tutorial 📝Como editar o layout da minha loja em rascunho?.
Pronto! 🙌
Os banners aparecerão apenas na página inicial, logo abaixo do menu principal e dos banners informativos, ou abaixo do menu principal. A disposição dependerá do layout que estiver usando.
Veja um exemplo da visualização em dispositivos móveis:
Temos também um exemplo da visualização via computador:
