Fondo de partículas elementales libres (particles.js)
Particles es una extensión gratuita de Master Addons que ejecuta una animación particles.js detrás de cualquier sección, columna o contenedor de Elementor. Enciéndalo y obtendrá el efecto predeterminado de inmediato: puntos blancos que se desplazan a lo largo de la sección, unidos por líneas delgadas y alejados por el cursor. Para cualquier otra cosa, como nieve que cae, burbujas ascendentes o un campo estelar, cree una configuración en el generador Particles.js y pegue su JSON en el panel.
Un fondo en movimiento sin un archivo de vídeo
Las partículas son dibujadas en un lienzo mediante el script particles.js, por lo que no hay video ni imagen para descargar. La configuración del índice Z decide dónde se encuentra la capa de partículas, para que pueda mantenerla detrás de sus encabezados y botones. Si usa partículas en más de una sección, mantenga modestos los recuentos de partículas y consulte la página en un teléfono.
- Sin archivos de vídeo ni de imagen: la animación se dibuja en el navegador.
- Una configuración de índice Z para mantener la capa de partículas detrás de su contenido.
- Funciona en secciones, columnas y contenedores, cada uno con su propia configuración.
Cualquier efecto de partículas.js de un campo JSON
El campo Particle JSON controla todo lo que Particles.js puede hacer: recuento de partículas, color, forma, tamaño, opacidad, líneas de enlace, velocidad y dirección, además de interacciones flotantes y de clic. El enlace sobre el campo abre el generador Particles.js. Elija un ajuste preestablecido como NASA, Bubble o Snow, ajústelo con controles deslizantes y descargue la configuración. Péguelo y las actualizaciones de la sección en el editor.
- Ajustes preestablecidos en el generador: Predeterminado, NASA, Bubble, Snow y Nyan Cat.
- Formas: círculo, arista, triángulo, polígono, estrella o tu propia imagen.
- Modos de flotar y hacer clic, como rechazar, agarrar, burbujear y empujar.
Cómo agregar un fondo de partículas en Elementor
Las partículas blancas predeterminadas necesitan un fondo oscuro o colorido para aparecer, así que configúrelo primero.
- Active Partículas en la pestaña Extensiones del panel de complementos maestros.
- Seleccione una sección, columna o contenedor y dale un color de fondo oscuro.
- Abra la pestaña Estilo, expanda Partículas y active Habilitar fondo de partículas.
- Para obtener un efecto diferente, haga clic en el enlace encima de Particle JSON, elija un ajuste preestablecido en el generador, descargue el JSON y péguelo en el campo.
- Establezca el índice Z para que la capa de partículas permanezca detrás de su contenido y luego publíquelo.
Nuestro tutorial de fondo de partículas recorre cada paso con capturas de pantalla.
Particles.js en WordPress: a mano o con la extensión
particles.js es una biblioteca JavaScript gratuita y usted mismo puede agregarla a WordPress. Esto es lo que se necesita en comparación con la extensión.
| Añadiendo partículas.js a mano | Extensión de partículas | |
|---|---|---|
| Cargando el guión | Ponga en cola la biblioteca en su tema | Cargado sólo en páginas con una sección de partículas |
| Capa de partículas | Agregue un div y colóquelo detrás del contenido con CSS | Agregado a la sección para usted |
| Configuración | Llame a ParticlesJS() con su JSON en un script | Pegue el JSON en el panel |
| Vista previa | En la parte delantera | Justo en el editor Elementor |
| Capas | Escribe tus propias reglas de índice z | Campo de índice Z |
Las partículas combinan bien con Vidriomorfismo tarjetas encima. Para otros fondos en movimiento, inténtelo Control deslizante de fondo o Fondo de gradiente animado (Pro).
Preguntas frecuentes sobre partículas
No soy desarrollador. ¿Las cosas de JSON son demasiado difíciles para mí?
No. Activar el efecto le brinda la apariencia predeterminada sin JSON alguno. Para otras miradas, el generador Particles.js funciona con controles deslizantes y selectores de color. Descargue la configuración que crea y péguela en el campo Particle JSON.
¿Puedo usar mi propia imagen (como un logotipo) como partícula?
Sí. En el generador de partículas.js, configure el tipo de forma en la imagen e ingrese la URL de su imagen, como un pequeño logotipo. Descargue la configuración y péguela en el campo Particle JSON.
¿Funcionará esto en teléfonos móviles?
Sí, la animación se ejecuta en teléfonos y tabletas. Un recuento alto de partículas puede ralentizar los teléfonos más antiguos, así que mantenga el número modesto para las secciones que verán los visitantes móviles.
¿Puedo tener diferentes efectos de partículas en diferentes secciones de la misma página?
Sí. Cada sección, columna y contenedor tiene su propio campo Particle JSON, por lo que tu héroe puede mostrar un campo estelar mientras otra sección usa nieve.
Widgets y extensiones de Elementor de tendencia
Cree sitios web sofisticados en menos tiempo.
Vidriomorfismo
Extras de contenedores
Patrones
Duplicador de publicaciones/páginas
