Banners

Banners são ferramentas amplamente utilizadas em publicidade para destacar informações e captar a atenção dos visitantes.

Eles são projetados para direcionar o usuário a uma página específica de um site ou loja virtual por meio de um link.

Neste tutorial você irá aprender sobre como realizar todas as configurações nos banners da sua loja virtual, vamos lá?

Como gerenciar os banners?

1- Para gerenciar os banners de publicidade da sua loja virtual, acesse o painel administrativo da sua loja virtual e clique em Personalização >>Banners.

2- Nesse painel você verá a lista de banners existentes e em frente a cada banner existem algumas possíveis ações a serem realizadas.

3- Na lista de banners, em Grupos, você pode ver o grupo de banners que foi filtrado.

  • Marcações, é possível ver as Tags do banners, que irei explicar detalhadamente mais a frente neste tutorial;

  • Cliques, você pode ver o número de cliques que o banners possui;

  • Vencimento e Agendado para, é possível ver as datas configuradas para o banner;

  • Status, o sinal verde significa que o banner está ativo e o vermelho significa que ele foi desativado;

  • Ações, você pode editar (clicando no lápis amarelo), excluir (clicando no botão vermelho) e ver as estatísticas do banner (clicando no botão branco).

Como adicionar um novo banner?

1- Para adicionar um banner, clique na opção + Novo banner disponível na tela de listagem dos banners.

2- Após clicar em novo banner defina as configurações do banner através dos campos abaixo:

  • Título do banner: defina o título do banner;

  • Grupo do banner: utilizado apenas para categorização do registro. É possível selecionar uma opção existente ou criar uma nova.

HTML

No modo HTML, você poderá inserir um código em HTML para colocar um banner em flash ou pop up em sua loja. Caso use este campo, os campos referentes à imagem e links informados serão desconsiderados.

Carrossel

No modo Carrossel, você pode definir imagens e/ou vídeos para exibição no banner que será mostrado no estilo carrossel, podendo também ser totalmente customizado via CSS.

1- Para adicionar as imagens, clique em Adicionar imagem ou jogue a imagem no espaço embaixo.

É recomendado que as dimensões das imagens estejam proporcionalmente 3 vezes maiores para que a qualidade seja mantida. Caso o arquivo fique muito pesado, é possível utilizar um compressor de imagens online.

Para comprimir imagens em PNG, clique aqui!

Para comprimir imagens em JPEG, clique aqui!

2- Depois disso, é preciso configurar as seguintes opções:

  • Reprodução automática: defina se deseja que a reprodução do banner rotativo deve ser automática ou não;

  • Loop infinito: duplica a última e a primeira imagem dando a impressão de loop infinito;

  • Setas de navegação: exibe os botões de navegação esquerda/direita no banner;

  • Pontos de navegação: exibe os botões de navegação;

  • Itens visíveis: número de imagens visíveis ao mesmo tempo no banner;

  • Tempo de transição: tempo de espera (em segundos) para transação de uma imagem para outra no banner;

  • Velocidade de transição: define a velocidade do efeito de transição (em milisegundos) de uma imagem para outra;

  • Tipo: esta opção altera o tipo de efeito utilizado nas transições das imagens em seu banner.

Agendamento

  • Programado para: se uma programação foi definida, o banner será ativado na data informada. Todos os banners programados são marcados como desativados até que a data informada tenha chegado e então serão marcados automaticamente como ativos;

  • Expira em: se não desejar que o banner expire automaticamente em uma data específica, deixe o campo em branco.

Exibir em uma ou mais categorias

Neste campo é possível escolher em qual categoria o banner deverá ser exibido, caso seja definido para exibir na Página Principal, o banner será exibido apenas na pagina de entrada da loja conforme posição definida.

Referenciamento do banner

  • Posicionamento do Banner: define o posicionamento na tela do banner;

  • Tags/Keywords: se quiser, é possível criar tags para os seus banners. Porém, a principal função das tags é selecionar onde o banner irá aparecer na loja virtual.

1- Após terminar as configurações você pode clicar em Inserir. Se estiver editando um banner, clique em Salvar & manter edição ou Atualizar.

As Tags/Keywords

Para usar as configurações dos banners da melhor maneira possível é preciso entender um pouco como as tags funcionam!

  • billboard: essa tag é usada para banners posicionados abaixo do cabeçalho da loja virtual, em qualquer página, como páginas de produtos ou categorias;

  • billboard_home: essa tag é usada para banners posicionados abaixo do cabeçalho da loja virtual, assim como na tag Billboard. Porém, o banner só será exibido na página inicial da loja virtual;

  • mobile: essa tag é usada apenas para banners posicionados abaixo do cabeçalho da loja virtual. Usando esta tag, é possível exibir o banner apenas em telas pequenas, como as de celulares. Caso a loja seja acessada por um aparelho com a tela maior que a tela de um celular, o banner é desativado;

  • center_top: essa tag exibe o banner abaixo do cabeçalho da loja virtual e entre as colunas laterais;

  • center_bottom: essa tag exibe o banner acima do rodapé da loja virtual e entre as colunas laterais;

  • footer: essa tag exibe o banner acima do rodapé da loja virtual e embaixo das colunas laterais, fora das estrutura da loja;

  • desktop: usando essa tag, é possível deixar de exibir o banner apenas para telas pequenas, como celulares.

Ficou com alguma dúvida? Entre em contato através do nosso chat online.