O uso de banners adiciona um toque visual atraente ao seu site e confere personalidade ao seu conteúdo, seja ele uma galeria , página , pasta , álbum de cliente ou blog . Você pode adicionar texto alternativo às imagens do banner , o que contribui para a otimização de mecanismos de busca (SEO).
Os banners podem ser colocados na parte superior ou inferior do seu conteúdo (abaixo do cabeçalho do site) e geralmente são usados para exibir uma imagem de banner em tela cheia, uma apresentação de slides de imagens ou um vídeo.
Caso queira apenas exibir uma mensagem de texto na parte superior do seu site, use a barra de Anúncios . Ou, se preferir criar um pop-up que apareça quando os visitantes acessarem seu site, você pode experimentar o Pop-up de Marketing.
Veja como é um Banner:
Verifique um site de demonstração ao vivo.
As configurações do banner são categorizadas como:
1. Conteúdo
As opções na categoria de conteúdo são:
Tipo de banner
Selecione o tipo de banner. Você pode escolher qualquer uma das seguintes opções:
- Slides – Selecione a opção Slides se quiser exibir imagens no banner. Você pode adicionar vários slides de imagem sob um banner.
- Vídeo – Se quiser exibir vídeos como slides de banner, selecione esta opção. Abaixo de cada banner, você pode adicionar vários slides de vídeo.
- Auto – A imagem em destaque da galeria, o título e a descrição serão usados para o banner. Ele será criado automaticamente pelo sistema.
- Inativo – O banner não ficará visível no site.
Slides
- Clique no +Adicionar slides (1) para adicionar os slides personalizados ao banner.
- Depois de carregar os slides, você pode editar (2) ou delete (3) o slide.
Pontos para lembrar:
- O tamanho ideal de uma imagem de Banner será 2560 pixels x 1440 pixels.
- Os formatos de arquivo de imagem suportados para o banner são JPG, JPEG, PNG e GIF.
- Os slides máximos suportados são 25 para cada banner.
- Recomendamos que você carregue imagens de paisagem em vez de retrato.
- Adicione o texto sobre as imagens do Texto mestre/slide campo. Não faça upload de imagens com texto nelas.
Editar slide de imagem/texto
- Uma vez que você clicou no editar ícone, você verá a gaveta de slides de imagem/texto.
As opções disponíveis aqui são:
- Imagem
- Clique no Escolher arquivo botão para mudar a imagem/slide. Clique no Apagar botão para excluir o slide.
- Mude o ponto focal da imagem apenas clicando na imagem em qualquer lugar.
- Imagem Móvel – Carregue uma imagem de banner para celular. Recomendamos adicionar imagens de retrato aqui.
- Especifique o texto alternativo para o slide de imagem. Isso ajuda para fins de SEO.
- Texto do slide - Insira o texto do slide que aparecerá sobre o slide. Você pode colocar o texto em negrito, itálico, sublinhado, vinculá-lo e fazer muito mais.
Veja também: O editor de texto Pixpa.
- Link do slide
-
- Clique no ícone de configurações e insira o link de sobreposição para o slide.
- Você pode especificar qualquer página dentro/fora do seu site, seu e-mail ou um número de contato.
Veja também: Link para texto/botão.
O slide completo será convertido em link somente quando a opção "Texto do banner e botões" estiver selecionada como "Diferente para cada slide".
- Botão e ícones
-
- Adicione até 10 botões/links ao conteúdo do slide.
- Você pode adicionar um botão normal, link de texto ou usar uma imagem/ícone como botão.
Verifique também: Botão & Links.
- Bata o Economize botão para salvar suas alterações.
Texto do banner e botões
- Especifique se o texto e os botões serão os mesmos para todos os slides ou diferentes para cada slide. Quando você seleciona o Igual para todos os slides opção, o texto do banner e os botões 1 e 2 serão usados.
- Quando você seleciona o Diferente para cada slide opção, o texto e os botões especificados para um determinado slide serão usados.
Texto do Banner
- Insira o texto do banner que será comum a todos os slides.
Veja também: O editor de texto Pixpa.
Botões e ícones
- Esses botões/links aparecem sobre os slides do banner (comuns para todos os slides).
Verifique também: Botão & Links.
2. Definições
Na guia Configurações de banner, você obtém as seguintes opções:
- Opções de exibição de banner
- Comportamento do cabeçalho do site
- Visibilidade do banner
- Opções de estilo
- Apresentação de slides de banner
- Botões e links
Opções de exibição de banner
- Largura da Faixa – Especifique a largura do banner.
- 'Largura total' exibirá o banner enquanto cobre toda a largura sem deixar nenhuma margem.
- 'encaixotado' exibirá o banner, deixando uma certa quantidade de preenchimento à direita e à esquerda da tela.
- 'Largura do site' pode ser especificado no Design seção. Você pode especificar uma largura fixa lá.
Ele exibirá o banner aderindo à largura fixa especificada.
-
- Dimensionar e ajustar – As imagens caberão dentro da largura e altura do banner.
- Ajustar à largura (Apenas para desktop) – As imagens serão dimensionadas para a largura do banner. A altura do banner herdará a altura da imagem.
- Altura da área de trabalho do banner – Especifique a altura do banner da área de trabalho se você escolheu o sangramento total or dimensionar e ajustar opção no campo Modo de exibição.
- Altura do banner móvel – Especifique a altura do banner móvel.
Se a seção de banner for adicionada a uma página, a altura do banner será herdada da altura da seção.
Comportamento do cabeçalho do site
- Cabeçalho da página – Selecione o estilo de cabeçalho que será aplicado sobre o banner.
- No caso, você selecionou Padrão, o cabeçalho usará o estilo padrão de cabeçalho do site e o banner será colocado após o cabeçalho. Confira um exemplo vivo.
- No caso, você selecionou Transparente, o plano de fundo do cabeçalho será definido como transparente e os elementos do cabeçalho serão brancos. O banner será colocado sob o cabeçalho. Confira um exemplo vivo.
- Itens de cabeçalho - Se você tem definir o cabeçalho para ser transparente, você pode escolher o cor dos itens de cabeçalho/itens de menu:
- Em caso Cor Padrão é selecionado, a cor dos itens de cabeçalho é herdada do Design seção.
- Em caso Especifique a cor estiver selecionado, você pode clicar e escolher a cor dos itens de cabeçalho.
Veja também: Como estilizar os itens do cabeçalho de qualquer página.
Visibilidade do banner
- Visibilidade – Defina a visibilidade do banner.
- Posição – Especifique a posição do banner.
Finalizadores
- Posição do conteúdo – Especifique a posição do conteúdo sobre o banner.
- Largura do conteúdo – Especifique a largura do conteúdo do banner.
- Cor de fundo – Defina a cor de fundo do banner.
- Sobreposição de cor – Defina a cor de sobreposição do banner.
- Estilo de Navegação – Especifique o estilo de navegação do banner. Você pode selecionar entre Chevron, Setas Longas e Setas Curtas. Selecione Nenhum se desejar desativar os controles de navegação.
- Cor de navegação – Especifique a cor dos controles de navegação no banner.
- Margem Externa – Aplique a margem externa para o banner. Quando a margem externa é aplicada, o espaço livre ocorre na parte inferior do banner.
- Seta de rolagem para baixo – Selecione esta opção para mostrar uma seta de rolagem para baixo sobre o banner.
Slideshow
- Slideshow - Escolha o Autoplay opção para ativar a apresentação de slides para o banner.
- Velocidade da apresentação de slides – Especifique a velocidade da apresentação de slides (em segundos).
- Transição de apresentação de slides – Especifique o estilo de transição de imagem para o banner.
- Finalmente, acerte o Economize botão.
Botão & Links
- Alinhar o botão/links para ser alinhado à esquerda, à direita ou ao centro.
- Especifique o Espaço Entre o Botão/Links que foram adicionados.
- Especifique o Espaço acima do Botão/Links.
- Escolha o pairar Efeito para o botão/links.
- Escolha o tamanho do botão normal que você adicionou no Botão/Links.
- Especifique o altura do botão de imagem se você adicionou um link de imagem no Botão/Links.
- Especifique o tamanho do botão de ícone se você adicionou um ícone social no Botão/Links.
Se você adicionou um ícone de rede social no botão/link , então:
- Escolha o Tipo de ícone social/Forma.
- Escolha o Estilo de cor do ícone social.
Se você escolheu o Cor Selecionada opção acima então:- Especifique o Cor do Ícone Social.
- Especifique o Cor de fundo do ícone social.
3. Layout
Você pode alterar facilmente o layout de um banner. Saiba mais sobre os layouts de banner.