Exiba vídeos, imagens e áudio em seu site para capturar a atenção dos visitantes. Use esses widgets para apresentar seus produtos e aumentar o engajamento em todas as suas páginas.
O widget Media Slider oferece slides com vídeo, imagem e somente texto, com diversos layouts. Use este widget para depoimentos, perguntas frequentes, apresentações de produtos ou seções de serviços para fornecer conteúdo interativo aos visitantes.
Antes de começar
- O som está desativado para vídeos usados como plano de fundo dos slides.
- A reprodução automática de vídeos depende das restrições do navegador e das configurações do dispositivo, como o modo de economia de energia. Para obter ajuda, consulte Solução de problemas do widget de vídeo.
- É possível incluir no máximo 25 slides.
- Os arquivos suportados incluem
.svg, .png, .jpg, .gife todos os formatos de vídeo.
- Clique no widget e selecione a aba Conteúdo.
- Para adicionar um novo slide, clique em Adicionar novo slide.
- Selecione + Clique para adicionar mídia e abrir a Biblioteca de Mídia.
- Para adicionar novas imagens à sua biblioteca de mídia, acesse a guia Imagens:
- Clique em + Carregar imagens para adicionar imagens do seu computador. Você pode selecionar várias imagens.
- Clique em Importar imagens para importar imagens de uma fonte externa:
- Selecione De um site, insira o site relevante e clique em Mostrar imagens. Selecione as imagens relevantes e clique em Importar imagens.
- Selecione Em plataformas online, conecte-se à plataforma desejada e siga as instruções na tela.
- Clique em Concluído.
-
Para adicionar novos vídeos à sua biblioteca de mídia, acesse a guia Vídeos:
Clique em + Carregar vídeos, conecte a plataforma relevante e siga as instruções na tela.
- Clique em Concluído.
Ações adicionais:
- Para duplicar um slide, passe o cursor sobre ele e clique
. - Para substituir um slide, selecione o slide e clique
ao lado de "Substituir". - Para excluir um slide, passe o cursor sobre ele e clique
ou selecione o slide e clique ao lado de "Substituir". - Para posicionar o slide, selecione a direção desejada.
- Para adicionar texto alternativo, insira o texto desejado em "Tag de texto alternativo da imagem" ou clique no ícone correspondente.
Para usar o Assistente de IA, ele gera texto alternativo no idioma atual da página. - Para adicionar texto ao slide, insira o texto desejado no campo fornecido.
- Para adicionar uma descrição ao slide, insira o texto desejado no campo fornecido.
- Para exibir ou ocultar um botão no slide, clique
. Digite o texto para o botão no campo fornecido. - Para adicionar um link ao botão, clique em Adicionar um link e selecione a opção desejada.
- Para excluir todos os slides, clique em Excluir tudo.
Insira imagens para decorar seu site ou exibir produtos. Você também pode configurar imagens para funcionarem como botões que direcionam para outras páginas, arquivos ou janelas pop-up.
Antes de começar
- Os sites suportam até 15.000 arquivos de mídia.
- O limite de tamanho por arquivo é de 50 MB.
- Evite espaços ou caracteres especiais nos nomes dos arquivos.
- Certifique-se de ter permissão para usar fotos de terceiros.
- Tipos de arquivo suportados:
png, jpg, jpeg, gif, svg, webp, ico.
- Clique no widget e selecione a aba Conteúdo.
-
Na janela pop-up "Visualização rápida do seletor de imagens", pesquise e selecione imagens, texturas ou GIFs. Como alternativa, clique em + Carregar para selecionar fotos dos seus arquivos pessoais. Você pode selecionar várias imagens.
Clique em "Visualização completa" para mais opções de seleção de imagem.
- Para remover o fundo da imagem, clique
ao lado de "Substituir". - Para adicionar texto alternativo, insira o texto desejado em "Tag de texto alternativo da imagem" ou clique para usar o Assistente de IA, que gera texto alternativo no idioma atual da página.
- Para substituir uma imagem, selecione o slide e clique ao lado de "Substituir".
- Para adicionar uma dica de ferramenta à imagem ao passar o cursor sobre ela, insira o texto desejado no campo "Dica de ferramenta".
- Para adicionar uma legenda à imagem ao passar o cursor sobre ela, insira o texto desejado no campo "Legenda".
- Para substituir a imagem ao passar o cursor sobre ela, clique em + Imagem e selecione a imagem desejada.
- Clique ao lado de "Substituir" para editar a imagem alternativa. Saiba mais sobre o editor de imagens. Clique em Salvar.
- Clique ao lado de "Substituir" para excluir a imagem alternativa.
- Para adicionar texto alternativo, insira o texto desejado em "Tag de texto alternativo da imagem" ou clique para usar o Assistente de IA, que gera texto alternativo no idioma atual da página.
- Clique
- Para remover o fundo da imagem, clique
Clique no widget e selecione a aba Design para alterar o layout da imagem, as animações, as opções de exibição e o estilo.
Observação:
Desativar a otimização de imagens pode afetar a velocidade e/ou o desempenho da página.
Use o carrossel de imagens para exibir depoimentos, perguntas frequentes, apresentações de produtos ou seções de serviços em seu site. Isso fornece prova social e aumenta a confiança dos seus clientes.
Antes de começar
Os arquivos suportados incluem .svg, .png, .jpg, .gif e todos os formatos de vídeo.
- Clique no widget e selecione a aba Conteúdo.
- Para adicionar uma nova imagem, clique em Adicionar imagem.
- Clique em + Carregar imagens para adicionar imagens do seu computador. Você pode selecionar várias imagens.
- Clique em Importar imagens para importar imagens de uma fonte externa:
- Selecione De um site, insira o site relevante e clique em Mostrar imagens. Selecione as imagens relevantes e clique em Importar imagens.
- Selecione Em plataformas online, conecte-se à plataforma desejada e siga as instruções na tela.
- Selecione as imagens relevantes e clique em Concluído.
- Clique no X em uma imagem para excluí-la. Como alternativa, clique em Excluir todas as imagens para excluir todas as imagens.
Configurações de imagem
Clique em uma imagem existente para abrir as "Configurações da Imagem", onde você encontrará as seguintes configurações adicionais:
- Para substituir uma imagem, clique ao lado de "Substituir".
- Para excluir uma imagem, clique ao lado de "Substituir".
- Para posicionar o slide, selecione a direção desejada.
- Para adicionar um link ao botão, clique em Adicionar um link e selecione a opção desejada.
- Para exibir ou ocultar o título de uma imagem, clique . Insira o texto desejado no campo "Título do slider".
- Para exibir ou ocultar a legenda de uma imagem, clique . Insira o texto desejado no campo "Legenda do slider".
- Para exibir ou ocultar um botão no slide, clique . Digite o texto para o botão no campo fornecido.
- Para adicionar texto alternativo, insira o texto desejado em "Tag de texto alternativo da imagem" ou clique no ícone correspondente. Para usar o Assistente de IA, ele gera texto alternativo no idioma atual da página.
Adicione várias imagens de uma só vez usando o widget Galeria de Fotos. Os visitantes podem abrir as imagens em uma galeria lightbox ou clicar nelas para visitar links, âncoras ou endereços de e-mail.
- Clique no widget e selecione a aba Conteúdo.
- Clique em + Imagem para adicionar uma nova imagem.
-
Na janela pop-up "Seletor de imagens - visualização rápida", pesquise e selecione imagens, texturas ou GIFs. Como alternativa, clique em + Carregar para selecionar fotos dos seus arquivos pessoais. Você pode selecionar várias imagens.
Clique em "Visualização completa" para mais opções de seleção de imagem.
- Clique em Concluído.
- Selecione uma imagem para abrir suas configurações:
- Para substituir uma imagem, clique ao lado de "Substituir".
- Para excluir uma imagem, clique ao lado de "Substituir".
- Para posicionar o slide, selecione a direção desejada.
- Para adicionar um link ao botão, clique em Adicionar um link e selecione a opção desejada.
- Para exibir ou ocultar o título de uma imagem, clique . Insira o texto desejado no campo "Título".
- Para exibir ou ocultar a descrição de uma imagem, clique . Insira o texto necessário no campo "Descrição".
- Para exibir ou ocultar um botão no slide, clique . Digite o texto para o botão no campo fornecido.
- Para adicionar texto alternativo, insira o texto desejado em "Tag de texto alternativo da imagem" ou clique no ícone correspondente. Para usar o Assistente de IA, ele gera texto alternativo no idioma atual da página.
- Para substituir uma imagem, clique
- Opcional: Ative a opção Habilitar links nas imagens da galeria para habilitar os links nas imagens da galeria.
- Clique no X em uma imagem para removê-la. Como alternativa, clique em Excluir todas as imagens para excluir todas as imagens.
Adicione um feed do Instagram
Usuários com conta privada ou pública do Instagram (exceto contas comerciais) podem adicionar um feed do Instagram ao widget da galeria de fotos.
Selecione um ícone de uma biblioteca com mais de 1000 opções prontas ou carregue seu próprio arquivo SVG.
Antes de começar
- Os arquivos SVG podem ser redimensionados sem perder a resolução.
- Para manter a velocidade do site, simplifique o código SVG complexo usando uma ferramenta de otimização ou converta vetores de alta resolução em formatos achatados como .png, .jpeg, etc.
- Clique no widget e selecione a aba Conteúdo.
- Clique em Alterar ícone para abrir a biblioteca de ícones.
- Procure e selecione um ícone. Como alternativa, clique em + Carregar para adicionar arquivos de uma plataforma de terceiros.
- Para vincular o ícone, clique em Vincular ícone e selecione a opção desejada.
- Digite o texto alternativo para o ícone ou clique para usar o Assistente de IA para gerar texto alternativo. O texto alternativo permite que os mecanismos de busca reconheçam o conteúdo do ícone. Use um texto que descreva o ícone claramente.
Clique no widget e selecione a aba Design para alterar o layout do ícone, as animações, as opções de exibição e o estilo do botão.
Ative a opção Flutuante para fixar o ícone em uma posição fixa na tela.
Faça upload de vídeos ou integre conteúdo do YouTube, Vimeo ou Dailymotion. Os vídeos são uma maneira eficaz de comunicar o valor do seu negócio e aumentar as conversões.
Antes de começar
- Os arquivos enviados são públicos. Não envie informações confidenciais.
- O envio de um vídeo não afeta a velocidade do site.
- Os sites suportam até 100 arquivos de vídeo.
- O limite de tamanho por arquivo é de 200 MB.
- Clique no widget e selecione a aba Conteúdo.
- Clique em Selecionar vídeo para escolher um vídeo da biblioteca de vídeos. Clique em + Carregar para adicionar arquivos de uma plataforma de terceiros. Como alternativa, cole um URL do YouTube, Vimeo ou Dailymotion.
- Ative a opção Ocultar vídeos relacionados para desativar as recomendações de vídeos relacionados da plataforma que você usou.
- Para excluir um vídeo, clique em Excluir.
Clique no widget e selecione a aba Design para personalizar a aparência do vídeo.
Use o widget Forma para destacar mensagens, criar botões personalizados ou indicar preços promocionais. Você pode adicionar imagens, texto e sombras a qualquer forma.
- Clique no widget e selecione a aba Conteúdo.
- Selecione o formato de sua preferência.
- Clique em Adicionar link para torná-lo clicável. Selecione a opção relevante.
- Para exibir ou ocultar um título, clique . Insira o texto desejado no campo "Título".
- Para exibir ou ocultar uma descrição, clique . Insira o texto desejado no campo "Descrição".
- Para exibir ou ocultar uma dica de ferramenta no slide, clique . Insira o texto da dica de ferramenta no campo fornecido.
- Para adicionar texto alternativo, insira o texto desejado em "Tag de texto alternativo da imagem" ou clique no ícone correspondente. Para usar o Assistente de IA, ele gera texto alternativo no idioma atual da página.
Clique no widget e selecione a aba Design para personalizar a aparência do ícone.
- Clique em Espaçamento para usar margens negativas caso queira sobrepor outros widgets.
- Ative a opção Flutuante para fixar a forma em uma posição fixa na tela.
Para criar uma forma no cabeçalho:
- Crie uma linha com duas colunas.
- Escolha uma forma amorfa e adicione-a à coluna do lado direito.
- Faça a forma tão grande quanto a coluna.
- No Editor de Design, selecione o layout com a imagem de fundo e substitua a imagem pela que você deseja.
Para usar uma forma como botão, adicionando um link e um efeito de passar o mouse:
- Selecione a forma circular e adicione um título e uma descrição.
- Selecione as cores para a forma e o texto.
- Para posicionar a forma no canto de uma imagem, use uma margem negativa no lado esquerdo da forma (espaçamento > margem > -50px margem esquerda e superior).
Utilize formas para destacar um plano ou serviço específico:
- Escolha o formato da bandeira e adicione um título e uma breve descrição.
- Desative a opção "Manter proporção" para que você possa ajustar apenas a largura.
- Selecione as cores para a forma e o texto.
- Para posicionar a forma de modo que ela se sobreponha à parte superior de uma coluna, use uma margem superior negativa (espaçamento > margem > -30px margem superior).
Use uma forma para criar um botão de rolagem:
- Escolha o formato de diamante e adicione um título.
- Desative a opção "Manter proporção" para que você possa ajustar apenas a largura.
- Selecione as cores para a forma e o texto.
- Para posicionar a forma sobre uma imagem, use uma margem superior negativa (espaçamento > margem > -50px de margem superior).
Apresente uma comparação visual impactante com o widget Antes e Depois. Ele inclui um controle deslizante que os visitantes podem usar para navegar entre as duas imagens.
- Clique no widget e selecione a aba Conteúdo.
- Imagem de antes: Clique em + Imagem para selecionar sua "Imagem de antes".
- Imagem posterior: Clique em + Imagem para selecionar sua "Imagem posterior".
- Selecione uma imagem para abrir suas configurações:
- Para substituir uma imagem, clique ao lado de "Substituir".
- Para excluir uma imagem, clique ao lado de "Substituir".
- Para adicionar uma etiqueta à imagem, insira o texto desejado no campo "Etiqueta".
- Para adicionar texto alternativo, insira o texto desejado em "Tag de texto alternativo da imagem" ou clique no ícone correspondente. Para usar o Assistente de IA, ele gera texto alternativo no idioma atual da página.
- Para substituir uma imagem, clique
Clique no widget e selecione a aba Design para personalizar a aparência do widget:
- Clique em Imagens e Slider para personalizar a aparência do slider.
- Use a seção Rótulos para formatar o texto para diferentes dispositivos.
Compartilhe podcasts, músicas ou tutoriais integrando arquivos do SoundCloud ou Mixcloud. Copie o link da fonte e adicione-o ao seu site através do widget.
- Clique no widget e selecione a guia Editar.
- Clique em Selecionar áudio para escolher um arquivo de áudio. Clique em + Carregar áudio para adicionar um arquivo de áudio de uma plataforma de terceiros. Como alternativa, cole um URL do SoundCloud ou Mixcloud no campo.
Clique no widget e selecione a aba Design para personalizar a aparência do widget.
As opções de layout dependem da plataforma utilizada. Para manter a consistência do design, utilize a mesma plataforma (SoundCloud ou Mixcloud) para todos os arquivos de áudio do seu site.
Adicione animações com qualidade vetorial ao seu site usando o widget de animação Lottie. Você pode navegar pelo LottieFiles em busca de animações existentes ou fazer o upload de seus próprios arquivos JSON.
- Clique no widget e selecione a aba Conteúdo.
- Cole o URL da animação Lottie.
- Selecione Animação em Loop ou Animar ao clicar.
- Para adicionar um link ao botão, clique em Adicionar um link e selecione a opção desejada.
Observação:
Se estiver usando um LottieFile gratuito, você deve incluir as credenciais do criador, conforme estipulado no contrato de licença.
Clique no widget e selecione a aba Design para redimensionar a animação ou bloquear suas proporções.
