Gratis Elementor Partikler Baggrund (particles.js)

Particles er en gratis Master Addons udvidelse, der kører en particles.js animation bag enhver Elementor sektion, kolonne eller beholder. Tænd den, og du får standardeffekten med det samme: hvide prikker, der driver hen over sektionen, sammenføjet af tynde linjer og skubbet væk af markøren. For alt andet, som faldende sne, stigende bobler eller et stjernefelt, skal du bygge en config i particles.js generator og indsætte sin JSON i panelet.

Snepartikler på en feriekortsektion med Partikler-panelet og particles.js-generatoren

En bevægelig baggrund uden en videofil

Partiklerne tegnes på et lærred af particles.js scriptet, så der er ingen video eller billede at hente. Z-indeks indstillingen bestemmer, hvor partikellaget sidder, så du kan holde det bag dine overskrifter og knapper. Hvis du bruger partikler på mere end et afsnit, skal du holde partikeltællingerne beskedne og kontrollere siden på en telefon.

  • Ingen video- eller billedfiler: animationen tegnes i browseren.
  • En Z-indeksindstilling for at holde partikellaget bag dit indhold.
  • Arbejder på sektioner, kolonner og containere, hver med sin egen konfiguration.

Enhver particles.js effekt fra ét JSON felt

Particle JSON-feltet styrer alt, hvad particles.js kan gøre: partikelantal, farve, form, størrelse, opacitet, sammenkædningslinjer, hastighed og retning, plus hover og klik interaktioner. Linket over feltet åbner particles.js generator. Vælg en forudindstilling som NASA, Bubble eller Snow, juster den med skydere og download config. Indsæt den og sektionen opdaterer i editoren.

  • Forudindstillinger på generatoren: Standard, NASA, Bubble, Snow og Nyan Cat.
  • Former: cirkel, kant, trekant, polygon, stjerne eller dit eget billede.
  • Hold markøren og klik tilstande som repulse, grab, boble og skubbe.
Stjernepartikelbaggrund på en mørk heltesektion med particles.js generatorindstillinger

Sådan tilføjes en partikelbaggrund i Elementor

De hvide standardpartikler har brug for en mørk eller farverig baggrund for at dukke op, så indstil det først.

  1. Slå Partikler til under fanen Udvidelser på instrumentbrættet Master Addons.
  2. Vælg en sektion, kolonne eller beholder, og giv den en mørk baggrundsfarve.
  3. Åbn fanen Stil, udvid Partikler, og tænd Aktiver partikelbaggrund.
  4. For en anden effekt, klik på linket over Particle JSON, vælg en forudindstilling i generatoren, download JSON og indsæt den i feltet.
  5. Indstil Z-indeks, så partikellaget bliver bag dit indhold, og udgiv derefter.

Vores partikler baggrund tutorial går gennem hvert trin med skærmbilleder.

Particles.js i WordPress: i hånden eller med udvidelsen

particles.js er et gratis JavaScript bibliotek, og du kan selv tilføje det til WordPress. Her er hvad der kræver i forhold til udvidelsen.

Tilføjelse af particles.js i håndenPartikelforlængelse
Indlæser scriptetSæt biblioteket i kø i dit temaIndlæses kun på sider med partikeludsnit
PartikelagTilføj en div og placer den bag indholdet med CSSTilføjet til sektionen for dig
KonfigurationKald particlesJS() med din JSON i et scriptIndsæt JSON i panelet
PreviewPå forendenLige i Elementor-redaktøren
LagdelingSkriv dine egne z-indeks reglerZ-indeksfelt

Partikler passer godt sammen med Glasmorfisme kort på toppen. For andre bevægelige baggrunde, prøv Baggrund Slider eller Animeret Gradient Baggrund (Pro).

Skabelonfremviser
Facebook
Twitter
WhatsApp
Kopier Link
Køb Nu
New Year
New Year
Partikler med Hero Sektion
Partikler med Hero Sektion
SaaS-helt, linket node-
SaaS-helt, linket node-
Vinterudsalg, faldende sne
Vinterudsalg, faldende sne
Guldinvestering, drivende prikker
Guldinvestering, drivende prikker
Bryllupssted, blød bokeh
Bryllupssted, blød bokeh
Cybersikkerhed, hurtig mesh
Cybersikkerhed, hurtig mesh
Festival lineup, stjerneformer
Festival lineup, stjerneformer
Påvirkningsrapport, stigende polygoner
Påvirkningsrapport, stigende polygoner
Agentur CTA, minimale trekanter
Agentur CTA, minimale trekanter

Ofte stillede spørgsmål til partikler

Lær de mest stillede forespørgsler, brugerne har om Partikler, og find svar på ét sted.
Jeg er ikke udvikler. Er JSON-tingene for hårde for mig?

Nej. At slå effekten til giver dig standardlooket uden nogen JSON overhovedet. For andre udseende fungerer particles.js-generatoren med skydere og farvevælgere. Download den konfiguration, den opretter, og indsæt den i Particle JSON-feltet.

Ja. I particles.js generator, indstille form typen til billede og indtaste URL af dit billede, såsom et lille logo. Hent config og indsætte det i Particle JSON feltet.

Vil dette virke på mobiltelefoner?

Ja, animationen kører på telefoner og tablets. Et højt partikelantal kan bremse ældre telefoner, så hold antallet beskedent for sektioner, som mobile besøgende vil se.

Ja. Hver sektion, kolonne og beholder har sit eget Particle JSON-felt, så din helt kan vise et stjernefelt, mens en anden sektion bruger sne.

Trending Elementor Widgets & Udvidelser

Byg sofistikerede websteder på kortere tid.

Master Addons Glassmorphism udvidelse til Elementor: matteret glas kort med Blur Value kontrol indstillet til 20px

Glasmorfisme

Hjem Gratis Elementor Glassmorphism Extension: Frosted Glass Effect i One Toggle Glassmorphism er den frostede...
Se detaljer
Master Addons Container Extras udvidelse til Elementor: container med låg på en 1400px Max bredde, med Max bredde, Max højde, Min bredde og Min højde kontroller

Container ekstraudstyr

Hjem Elementor Container Max bredde og Max højde Controls Container Extras er en gratis Master...
Se detaljer
Master Addons Patterns udvidelse til Elementor: helt med Purple Gradient Grid Left stil, tre flere mønster stilarter og Enable Pattern panelet

Mønstre

Hjem 70 + Gratis Elementor Baggrund Mønstre Mønstre er en gratis Master Addons udvidelse, der tilføjer...
Se detaljer
Master Addons Post/Page Duplicator udvidelse til Elementor: MA Duplicator række link i WordPress Pages liste oprettelse af en Landing Page - [Duplikeret # 128] udkast

Post/Page Duplicator

Hjem Duplikere Elementor Sider og indlæg i One Click Post/Page Duplicator er en gratis Master...
Se detaljer
Master Addons Reading Progress Bar udvidelse til Elementor: blå bjælke 42% udfyldt på tværs af toppen af en privatlivspolitik side, med aktivere, position, højde og fylde farveindstillinger

Læsning Progress Bar

Hjem Tilføj en læsefremskridtsbjælke i WordPress (Elementor) Reading Progress Bar er en gratis...
Se detaljer