ElementsKit é um addon Elementor completo que vem com centenas de elementos e recursos que ajudam a construir um site totalmente funcional. Isso inclui o widget Video Gallery.

Com o ElementsKit, você pode criar uma galeria de vídeos sofisticada sem afetar a velocidade da sua página. Usando o widget ElementsKit Elementor Video Gallery, você pode exibir vídeos com vídeos sem nem mesmo fazer upload ou incorporar vídeos no site. Basta digitar a URL do YouTube ou Vimeo e exibir vídeos com controles do player. Leia esta documentação para usar o widget Video Gallery do ElementsKit.

Passo 1: Habilite o widget #

Para usar o Widget de galeria de vídeos do ElementsKit Elementor, você tem que habilitar o widget no painel do WordPress. Para habilitar o widget,

• Vá para ElementsKit > Widgets do seu painel do WordPress.
• Encontre o Galeria de vídeos da lista e ative o widget.
• Clique no SALVAR ALTERAÇÕES.

Etapa 2: Configurar o widget da Galeria de Vídeos do ElementsKit #

Na aba Content, você pode configurar o ElementsKit Elementor Video Gallery. Siga as instruções abaixo para configurar o widget.

2.1 Adicionar conteúdo à galeria de vídeos #

No Contente seção, você pode adicionar conteúdo de vídeo. Para adicionar vídeos à galeria:

• Clique em “+ ADICIONAR ITEM” na seção de conteúdo.

• Escolha o Tipo de vídeo entre "YouTube" e "Vimeo”.
• Introduzir um URL do vídeo link no campo URL.
• Adicione um Categoria para vídeos. Adicionar categorias ajudará você a filtrar os vídeos.
• Adicione um Imagem personalizada (miniatura) se você quiser.

Você pode continuar adicionando itens à galeria de vídeos dessa maneira.

2.2 Configuração de layout #

Você escolhe como o layout da galeria de vídeos do Elementor ficaria. Para configurar o layout:

• Escolha o layout Estilo. Você pode escolher o estilo de layout Grade, Alvenaria ou Carrossel.
• Para Gird e Alvenaria, você pode selecionar o Colunas número.

2.3 Configurações #

As opções de configuração mudam com base no layout que você escolher. As configurações para o layout Grid e Masonry são as mesmas. No entanto, há diferentes conjuntos de opções de configuração para o layout Carousel.

Configuração para layout de grade e alvenaria:

• Escolha como o vídeo será reproduzido com o Ação de clique. Se você escolher “Play In Popup”, o vídeo será reproduzido em um pop-up. Enquanto que com “Play Inline”, o vídeo será reproduzido dentro da janela de visualização de vídeo.

• Depois disso, você pode escolher o Ícone do botão de reprodução.
• Decida se Mostrar filtro ou não.
• E decidir se quer mostrar o Botão de reprodução ao passar o mouse ou torná-lo sempre visível.

Configuração para layout de carrossel:

Ao escolher o layout Carrossel, Configurações do carrossel estará disponível na seção de configurações.

• Ajuste o espaço entre os itens com o Espaçamento Esquerda Direita opção.
• Defina o número de Slides para mostrar na tela por vez.
• Decida quantos Desliza para rolar de cada vez.
• Habilite o Reprodução automática e defina a reprodução automática Velocidade em (milissegundos).
• Habilitar Pausar ao passar o mouse, para que a reprodução automática do slide seja pausada quando o cursor for passado.

• Decidir se para o Mostrar seta.
• Se você decidir mostrar as setas, escolha a Ícone de seta para a esquerda e a Ícone de seta para a direita individualmente.
• Decida se Mostrar pontos.
• Habilitar Loop para que os slides rolem no loop.

Etapa 3: personalize o estilo da galeria de vídeos do ElementsKit Elementor #

Debaixo de Guia de estilo, você pode personalizar o estilo da galeria de vídeos, incluindo o item, a imagem, o ícone de vídeo, o filtro e o estilo de seta.

3.1 Artigo #

Na seção Item,

• Ajusta a Altura dos itens da galeria.
• Escolha o Tipo de plano de fundo para os vídeos. [Nota: isso mudará o fundo do vídeo, não o fundo da galeria inteira.]
• Colocou o Preenchimento.
• Escolher Tipo de borda.
• Definir Raio da Fronteira.

3.2 Imagem #

Para personalizar a imagem em miniatura,

• Colocou o Preenchimento para imagens.
• Escolher Tipo de borda. Em seguida, defina a Borda Largura e Fronteira Cor.
• Além disso, defina o Raio da Fronteira para imagens.

3.3 Ícone de vídeo #

Para personalizar o ícone de reprodução de vídeo,

• Ajusta a Tamanho da fonte do ícone do botão de reprodução de vídeo.
• Escolha o tipo de plano de fundo e selecione um cor de fundo para o ícone. Você também pode adicionar uma imagem como plano de fundo do ícone.
• Também definido Preenchimento, Tipo de borda, e Raio da Fronteira para o ícone do botão de reprodução de vídeo.

3.5 Setas #

As setas só aparecem quando você escolhe Layout de carrossel para a galeria e habilita a opção “Mostrar seta” em Configurações.

Para personalizar as setas,

• Ajusta a Seta tamanho.
• Colocou o Preenchimento para flechas.
• Escolher Tipo de borda. Em seguida, defina a Borda Largura, Fronteira Cor, e Raio da Fronteira.

• Ajustar Posição da seta para a esquerda e Posição da seta para a direita.
• Definir Cor da seta e Fundo de seta Cor.
• Definir separado flutuar cores para cor da seta e cor de fundo da seta.

3.6 Pontos #

Os pontos só aparecem quando você escolhe Layout de carrossel para a galeria e habilita a opção “Mostrar ponto” em Configurações.

Para personalizar o estilo Dots, 

• Escolher Estilo de ponto das opções fornecidas: Padrão, Pontilhado, Tracejado, Paginado.

• Ajuste o espaço entre os pontos usando o Espaçamento Esquerda Direita.
• Ajuste o espaço entre a galeria de vídeos e os pontos usando o Espaçamento de cima para baixo.
• Ajustar pontos Largura e Altura.
• Definir Raio da Fronteira.

• Customizar Ativo pontos escolhendo Tipo de plano de fundo e Cor de fundo.
• Ajusta a Altura dos pontos.

Finalmente, o processo está concluído. Você pode adicionar uma galeria de vídeos sofisticada usando o widget Galeria de Vídeos Elementor do ElementsKit.