Fundo de partículas de elementor livre (particles.js)

Particles é uma extensão Master Addons gratuita que executa uma animação partlets.js atrás de qualquer seção, coluna ou contêiner Elementor. Ligue-o e você terá o efeito padrão imediatamente: pontos brancos flutuando pela seção, unidos por linhas finas e afastados pelo cursor. Para qualquer outra coisa, como neve caindo, bolhas subindo ou um campo estelar, construa uma configuração no gerador partlets.js e cole seu JSON no painel.

Partículas de neve em uma seção de cartão de férias com o painel Partículas e o gerador de partículas.js

Um fundo em movimento sem um ficheiro de vídeo

As partículas são desenhadas em uma tela pelo script partlices.js, portanto não há vídeo ou imagem para baixar A configuração do índice Z decide onde a camada de partículas fica, para que você possa mantê-la atrás de seus títulos e botões Se você usar partículas em mais de uma seção, mantenha a contagem de partículas modesta e verifique a página em um telefone.

  • Sem arquivos de vídeo ou imagem: a animação é desenhada no navegador.
  • Uma configuração de índice Z para manter a camada de partículas atrás do seu conteúdo.
  • Funciona em seções, colunas e contêineres, cada um com sua própria configuração.

Qualquer efeito de partículas.js de um campo JSON

O campo Particle JSON controla tudo o que as partículas.js podem fazer: contagem de partículas, cor, forma, tamanho, opacidade, linhas de ligação, velocidade e direção, além de interações de hover e clique O link acima do campo abre o gerador de partículas.js. Escolha uma predefinição como NASA, Bubble ou Snow, ajuste-a com controles deslizantes e baixe a configuração Cole-a e a seção atualiza no editor.

  • Predefinições no gerador: Padrão, NASA, Bolha, Neve e Gato Nyan.
  • Formas: círculo, borda, triângulo, polígono, estrela ou sua própria imagem.
  • Passe o mouse e clique em modos como repulsa, agarrar, borbulhar e empurrar.
Fundo de partículas estelares em uma seção de herói escuro com configurações de gerador partles.js

Como adicionar um fundo de partículas no Elementor

As partículas brancas padrão precisam de um fundo escuro ou colorido para aparecer, então defina isso primeiro.

  1. Ative as partículas na guia Extensões do painel de complementos mestre.
  2. Selecione uma seção, coluna ou recipiente e dê-lhe uma cor de fundo escura.
  3. Abra a guia Estilo, expanda Partículas e ligue Habilitar Fundo de Partículas.
  4. Para um efeito diferente, clique no link acima da Partícula JSON, escolha uma predefinição no gerador, baixe o JSON e cole-o no campo.
  5. Defina o índice Z para que a camada de partículas fique atrás do seu conteúdo e depois publique.

Nosso partículas fundo tutorial caminha por cada etapa com capturas de tela.

Particles.js em WordPress: à mão ou com a extensão

particles.js é uma biblioteca JavaScript gratuita, e você mesmo pode adicioná-la ao WordPress. Aqui está o que isso leva em comparação com a extensão.

Adicionando partículas.js manualmentePartículas extensão
Carregando o scriptEnfileire a biblioteca no seu temaCarregado apenas em páginas com seção de partículas
Camada de partículasAdicione um div e posicione-o atrás do conteúdo com CSSAdicionado à seção para você
ConfiguraçãoChame partículasJS () com seu JSON em um scriptCole o JSON no painel
VisualizaçãoNa extremidade dianteiraBem no editor Elementor
CamadasEscreva suas próprias regras de índice zCampo Z-índice

Partículas combinam bem com Glassmorphismo cartas em cima Para outros fundos em movimento, tente Deslizador Fundo ou Fundo de gradiente animado (Pro).

Visualizador de modelos
Facebook
Twitter
WhatsApp
Copiar link
Compre Agora
Ano Novo
Ano Novo
Partículas com Seção Herói
Partículas com Seção Herói
SaaS herói, rede de nó ligado
SaaS herói, rede de nó ligado
Venda de inverno, neve caindo
Venda de inverno, neve caindo
Investimento em ouro, pontos à deriva
Investimento em ouro, pontos à deriva
Local do casamento, bokeh suave
Local do casamento, bokeh suave
Cibersegurança, malha rápida
Cibersegurança, malha rápida
Programação do festival, formas de estrelas
Programação do festival, formas de estrelas
Relatório de impacto, polígonos em ascensão
Relatório de impacto, polígonos em ascensão
Agência CTA, triângulos mínimos
Agência CTA, triângulos mínimos

Perguntas frequentes sobre partículas

Saiba as dúvidas mais solicitadas que os usuários têm sobre Partículas e encontre respostas em um só lugar.
Eu não sou um desenvolvedor As coisas JSON são muito difíceis para mim?

Não. Virar o efeito dá-lhe o olhar padrão sem nenhum JSON em tudo Para outros olhares, o gerador de partículas.js funciona com controles deslizantes e selecionadores de cores Baixe a configuração que ele cria e cole-o no campo Particle JSON.

Sim. no gerador de partículas.js, defina o tipo de forma como imagem e insira a URL da sua imagem, como um pequeno logotipo. Baixe a configuração e cole-a no campo Particle JSON.

Isso funcionará em telefones celulares?

Sim, a animação é executada em telefones e tablets Uma alta contagem de partículas pode desacelerar os telefones mais antigos, portanto, mantenha o número modesto para as seções que os visitantes móveis verão.

Sim. Cada seção, coluna e contêiner tem seu próprio campo Particle JSON, para que seu herói possa mostrar um campo estelar enquanto outra seção usa neve.

Widgets e extensões de elementos de tendência

Construa sites sofisticados em menos tempo.

Extensão Master Addons Glassmorphism para Elementor: cartões de vidro fosco com o controle Blur Value definido como 20 px

Glassmorphismo

Extensão de Glassmorphism de Elementor Livre em Casa: Efeito de vidro fosco em uma alternância O Glassmorphism é o fosco...
Ver detalhes
Extensão Master Addons Container Extras para Elementor: contêiner tampado em uma largura máxima de 1400 px, com controles de largura máxima, altura máxima, largura mínima e altura mínima

Contêiner Extras

Home Elementor Container Max Width e Max Height Controls Container Extras é um Master gratuito...
Ver detalhes
Extensão Master Addons Patterns para Elementor: herói com o estilo Purple Gradient Grid Left, mais três estilos de padrões e o painel Habilitar Padrão

Padrões

Início 70+ Padrões de fundo de elementor gratuitos é uma extensão gratuita de complementos mestres que adiciona...
Ver detalhes
Extensão Master Addons Post/Page Duplicator para Elementor: MA Link de linha Duplicator na lista de páginas WordPress criando uma página de destino - rascunho [duplicado #128]

Duplicador de postagem/página

Home Páginas e postagens de elementos duplicados em um clique Post/Page Duplicator é um Master gratuito...
Ver detalhes
Extensão da barra de progresso de leitura de complementos mestres para Elementor: barra azul 42% preenchida na parte superior de uma página de política de privacidade, com configurações de habilitação, posição, altura e preenchimento de cores

Barra de progresso de leitura

Início Adicionar uma barra de progresso de leitura no WordPress (Elementor) A barra de progresso de leitura é gratuita...
Ver detalhes