Uma apresentação de slides bem projetada pode elevar a aparência da sua loja virtual e aprimorar a experiência do usuário.
Uma das seções mais populares para sites de comércio eletrônico é a Apresentação de slides do banner do herói, que exibe seus principais produtos, promoções ou mensagens de marca no topo da sua página inicial.
O que é uma apresentação de slides e por que usá-la?
Um slideshow é uma série rotativa de banners ou imagens usadas para exibir várias mensagens, promoções ou produtos em uma única seção, normalmente no topo da sua página inicial. Ele ajuda a capturar a atenção rapidamente e manter os visitantes engajados sem sobrecarregá-los.
Ao usar um formato de carrossel, você pode destacar:
- Produtos em destaque ou sazonais
- Promoções ou ofertas por tempo limitado
- Mensagens de marca ou novas coleções
Um slideshow bem projetado pode elevar a aparência da sua loja virtual e melhorar a experiência do usuário.
Como projetar apresentação de slides ou carrossel de imagens com GemPages
Com o GemPages, criar uma apresentação de slides é simples e flexível. Você pode combinar carrossel e Bandeira de herói elementos para criar slides interativos e atraentes que elevam a experiência geral do usuário e geram mais cliques.
Neste guia, mostraremos passo a passo como criar um Slideshow de Banner de Herói usando esses elementos.
Passo 1: Acessar o Editor GemPages
Vou ao Painel GemPages > PÁGINASe localize a página de destino para abrir o editor.
Passo 2: Adicione o elemento Carrossel à sua página
Arraste e solte o Elemento Carrossel na seção onde você deseja que a apresentação de slides apareça.
Observação: O Carousel Element vem com configurações personalizáveis para duração de slides, efeitos de transição e muito mais. Se você não estiver familiarizado com essas configurações, consulte Este artigo.
Etapa 3: adicione o elemento Hero Banner ao carrossel
Na barra lateral esquerda, arraste e solte um Elemento de Banner de Herói no Carrossel.
O Hero Banner vem pré-carregado com um imagem de fundo, título, bloco de texto e botão.
Você pode enriquecer seu Banner de Herói com elementos adicionais, como imagens, ícones, listas de itens, etc.
Passo 4: Personalize seu banner de herói
Agora, vamos personalizar o banner do seu herói no Configurações aba. Na barra lateral esquerda, você pode modificar o elemento do Banner do Herói do seu jeito.
Por exemplo:
- Carregue a imagem no seu banner de herói:
- Alterar cor de fundo:
- Editar título, bloco de texto, botão, etc.
Passo 5: Duplicar o slide
Voltar ao elemento principal do carrossel Configurações aba.
- Clique com o botão direito do mouse no Bandeira de herói > selecione “Selecione o elemento pai” para retornar às configurações principais do carrossel.
- Alternativamente, clique nos pequenos pontos sob o carrossel para acessar suas configurações.
Na barra lateral esquerda, vá para gerenciamento de itens seção e clique na caixa ao lado de Pedido para abrir a caixa de diálogo de gerenciamento de itens.
Passe o mouse sobre Item 1 e clique no duplicar ícone para duplicar o Slider 1.
O controle deslizante duplicado (controle deslizante 2) estará abaixo Item 1, e é automaticamente nomeado como Item 5.
Esta dica economiza tempo permitindo que você reutilize o mesmo design. Simplesmente atualize as imagens e o texto em cada slide duplicado.
Perguntas Frequentes
1. Posso adicionar vídeos à minha apresentação de slides em vez de imagens?
Atualmente, o elemento Carrossel suporta slides baseados em imagens. No entanto, você pode inserir manualmente um elemento de Vídeo em um Banner Hero dentro de cada slide se desejar simular uma apresentação de slides em vídeo. Observe que isso pode afetar a velocidade de carregamento.
2. Quantos slides posso adicionar a um único carrossel?
Não há um limite rígido para o número de slides que você pode adicionar. No entanto, para melhor desempenho e experiência do usuário, recomendamos manter no máximo 5 slides.
3. Posso controlar a velocidade de transição e a animação dos slides?
Sim! Nas Configurações do Carrossel, você pode ajustar a duração da transição, a alternância de reprodução automática, o tipo de animação (desvanecer ou deslizar) e o comportamento do loop.
4. Meu slideshow será responsivo em dispositivos móveis?
Com certeza. Os elementos Carrossel e Banner de Herói no GemPages são totalmente responsivos. Você também pode personalizar o layout para visualização em dispositivos móveis e tablets usando o modo Visualização Responsiva no Editor.
5. Posso adicionar links diferentes para cada slide?
Sim. Cada slide do Banner de Herói pode incluir botões ou imagens clicáveis com links exclusivos. Basta personalizar o elemento do botão ou o link da imagem dentro de cada bloco do Banner de Herói.
6. Por que meu carrossel não está sendo exibido corretamente na página ao vivo?
Verifique se o Ecrã Verifique se a condição está definida corretamente e se o Elemento Carrossel está posicionado em uma seção visível em todos os dispositivos. Além disso, verifique novamente o status da publicação e limpe o cache do navegador.
Obrigado por seus comentários