Alguns fundos ficam parados, e alguns derivam Pontos flutuantes conectados por linhas finas, ou neve caindo atrás de uma manchete: efeitos de partículas dão uma seção de movimento silencioso sem um arquivo de vídeo à vista O livre Partículas extensão em Complementos Mestres para Elementor renderiza exatamente isso por trás do seu conteúdo, alimentado pela biblioteca.js de partículas bem conhecidas e configurado com um único campo JSON.
Aqui está a seção de demonstração executando a predefinição Snow na página publicada:
O que a extensão Particles faz #
Uma vez habilitado, seções, colunas e contêineres recebem um Partículas painel em seus Estilo guia. Virar Habilitar fundo de partícula para Sim e o fundo da seção se torna uma tela de partículas vivas O painel mantém o mínimo:
- Habilitar fundo de partícula: o interruptor liga/desliga para o efeito.
- Índice Z: onde a camada de partículas fica na pilha, ela fica atrás do conteúdo.
- Partícula JSON: um campo de código contendo a configuração particles.js: contagem de partículas, cor, forma, tamanho, linhas de ligação, velocidade de movimento e interatividade flutuante, todos vivem aqui.
Uma configuração padrão é fornecida na caixa, pontos brancos unidos por uma rede de linha sutil e o painel é vinculado diretamente ao gerador partlets.js para construir o seu próprio.
Antes de começar #
- WordPress com Elementor instalado e ativo.
- Complementos Mestres para Elementor instalado e ativo. Novo no plugin? siga o guia instalação primeiro.
- Particles é uma extensão gratuita, portanto, nenhuma licença Pro é necessária.
- Não é necessária codificação: o JSON vem de um gerador de apontar e clicar.
Como ativar a extensão Partículas #
Do seu painel WordPress, vá para Adições Mestres e abra o Extensões guia. Partículas ficam no Widgets Animação grupo com crachá Popular, ao lado de Efeitos Flutuantes e Gradiente Animado BG. Clique em sua alternância para que fique roxo e depois bata Salvar alterações e aguarde o verde “Configurações salvas com sucesso no aviso de”.
Encontre o painel Partículas em uma seção #
Selecione o contêiner ou seção no editor Elementor e abra o Estilo guia. O Partículas seção com o emblema MA roxo fica com as outras ferramentas de fundo Master Addons: Fundo de gradiente animado, Deslizador Fundoe padrões.
Ligue-o e cumpra o efeito padrão #
Expanda partículas e troque Habilitar fundo de partícula para Sim. A tela executa imediatamente a configuração padrão: pontos brancos flutuando pela seção, conectados por linhas finas em uma rede em movimento. O Partícula JSON o campo abaixo contém a configuração que o dirige e Índice Z mantém a camada por trás do seu texto.
Pegue uma predefinição do gerador de partículas.js #
O Clique aqui link acima do campo JSON abre o site de demonstração particles.js, um gerador ao vivo com configurações predefinidas: Predefinição, NASA, Bolha, Neve, e Nyan Cat. Escolha um, ajuste os controles deslizantes, se quiser, e bata Baixe a configuração atual (json).
Abra o arquivo baixado, copie o JSON e cole-o no campo Particle JSON A demonstração vai com a predefinição Snow, e a tela muda da rede de linhas para flocos brancos macios caindo sobre a seção no momento em que a configuração cai.
O resultado na página #
Publicar e a seção neva por conta própria, como no GIF no topo desta página As partículas renderizam em uma tela atrás do conteúdo, então tudo na parte superior permanece nítido enquanto o fundo continua se movendo As configurações padrão também reagem ao cursor; o efeito de rede padrão repele partículas no hover.
Uma nota prática: a contagem de partículas impulsiona o desempenho A predefinição Snow executa 400 partículas e permanece suave, mas se uma página empilha várias seções de partículas, mantenha as contagens modestas e verifique-a em um telefone de gama média.
Onde os fundos de partículas se encaixam #
- Secções herói. A rede de pontos conectados lê tecnologia e modernidade por trás de uma manchete ousada.
- Campanhas sazonais. A predefinição Snow transforma qualquer seção promocional no inverno em uma pasta.
- SaaS e páginas de inicialização. Partículas de deriva lenta adicionam profundidade sem distrair o tom.
- Seções escuras. Configurações de campo estelar como a NASA fazem fundos escuros parecerem deliberados.
- Páginas de eventos e lançamentos. O movimento por trás de uma contagem regressiva mantém viva uma página esparsa.
Vídeo Tutorial #
Assista a toda a configuração, desde habilitar a extensão até a neve caindo na página publicada.
Perguntas frequentes #
Como adiciono um fundo de partículas no Elementor?
Habilite a extensão Partículas na guia Extensões de complementos mestre, selecione uma seção e abra Partículas na guia Estilo. Alterne Habilitar fundo de partícula para Sim e a rede animada padrão aparecerá imediatamente, sem necessidade de configuração.
Onde obtenho efeitos de partículas diferentes?
O link Clique aqui no painel abre o gerador partles.js com predefinições como NASA, Bubble, Snow e Nyan Cat. Ajuste as configurações ao vivo, baixe a configuração como JSON e cole-a no campo Particle JSON.
As partículas diminuem a velocidade da página?
O efeito é executado em uma tela leve e permanece suave em contagens típicas; a demonstração Snow executa 400 partículas sem gagueira Mantenha as contagens razoáveis e evite empilhar muitas seções de partículas em uma página, especialmente para visitantes móveis.
As partículas podem reagir ao rato?
Sim. A configuração partlices.js inclui configurações de interatividade, e a configuração padrão repele partículas quando o cursor se move sobre a seção Os comportamentos de pairar e clicar são configuráveis no JSON.
A extensão Particles é gratuita?
Sim. Partículas vem com a versão gratuita de Master Addons para Elementor, no grupo Animation Widgets da guia Extensões A página de preços cobre o que os planos Pro adicionam.
Embrulhando #
A extensão Particles coloca uma tela de partículas ao vivo atrás de qualquer seção Elementor: uma alternância para a rede padrão, uma JSON colada para qualquer coisa que o gerador partlets.js possa sonhar Mantenha as contagens sãs, deixe o índice Z segurar a camada atrás do conteúdo e a seção se move sem um único upload de ativos. Ele fica naturalmente ao lado do Fundo de gradiente animado e Deslizador Fundo extensões na mesma guia Estilo e o conjunto completo de Widgets e extensões Master Addons está a uma página de distância Para compará-lo com a adição de partículas.js à mão, consulte o Página de extensão de partículas.
