Opret dine egne Elementor Widgets. Ingen kode påkrævet.
Mød Widget Builder af Master Addons – en kraftfuld bro mellem din brugerdefinerede kode og Elementor editor. Gør unikke designs, AI-genererede grænseflader, eller interaktive CodePen uddrag til fuldt funktionelle, genanvendelige Elementor widgets.
Widget Builder-fordelen
Opret virkelig unikke widgets
Byg widgets til dit projekts nøjagtige behov - noget præfabrikerede biblioteker ikke kan tilbyde.
Bring AI & CodePen Designs til live
Integrer brugerdefinerede brugergrænseflader direkte fra AI-værktøjer eller levende prototyper fra CodePen på dit websted som redigerbare Elementor-widgets.
Fuld kreativ kontrol
Du ejer hele stakken: struktur (HTML), stil (CSS) og interaktivitet (JS), plus muligheden for at tilføje eksterne biblioteker.
Genbrug & Spar Tid
Byg en widget én gang, gem den i dit bibliotek, og genbrug den på tværs af ethvert projekt med ensartede, redigerbare indstillinger.
Bygget til Power Users
Hvis du kender Elementor, kan du bruge Widget Builder. Den velkendte fane-baserede grænseflade gør widget skabelse visuel og intuitiv.
Brugerdefinerede widgets på tværs af ethvert websted
Byg en widget én gang og nemt eksportere / importere det til brug på helt forskellige WordPress hjemmesider, hvilket sparer enorm tid
Opret og navngiv din widget
Begynd med at etablere identiteten på din nye komponent. Giv den en klar titel og organiser den inden for en kategori for problemfri adgang, hver gang du bruger Elementor.
- Tildel en unik og beskrivende titel til din widget.
- Kategoriser det for nem fremtidig adgang i editorpanelet.
- Opsæt det grundlæggende fundament for dit genanvendelige element.
Design Editor Experience
Konstruer grænsefladen dine brugere vil interagere med. Ved at tilføje kontroller som toggles og farvevælgere, opbygger du visuelt widgetens indstillingspanel uden at skrive nogen kode.
- Tilføj kontrolelementer (tekst, farve, vælg) fra venstre panel.
- Hver kontrol bliver en redigerbar mulighed i Elementor.
- Visuelt designe hele brugervendte indstillingspanel.
Kortkontroller til din kode
Det er her din widget bliver dynamisk. Bygherren genererer smarte kortkoder for hver kontrol, som du placerer i dine skabeloner for at skabe live links mellem indstillinger og output.
- Brug autogenererede kortkoder som {{color}}.
- Indsæt dem i din HTML-, CSS- eller JS-kode.
- Opret en direkte forbindelse mellem editorindgange og front-end display.
Gem og brug hvor som helst
Når den er gemt, er din brugerdefinerede widget klar til handling. Den vises i Elementor-editoren, klar til at blive trukket ind på en hvilken som helst side og tilpasset med de live-indstillinger, du har bygget.
- Gem for øjeblikkeligt at tilføje det til dit Elementor-panel.
- Træk og slip widgetten til en hvilken som helst side.
- Juster live-indstillinger og se designgengivelsen med det samme.
Klarlavede widgets
Hvad kan du egentlig bygge?
Fra AI til Website
Generer et komplekst priskort eller testimonial skyder med et AI design værktøj, kopier koden, og sæt den i Widget Builder. Det er nu en overskuelig Elementor widget med redigerbar tekst og farver.
CodePen til produktion
Fandt du en fantastisk animeret knap eller et unikt galleri på CodePen? Indsæt det ikke bare - transformer det til en indbygget widget, hvor du kan styre alle parametre.
Byg dit eget brugergrænsefladesæt
Opret en pakke med brugerdefinerede knapper, overskrifter eller infokort med dit brands unikke interaktionsmønstre, og genbrug dem på tværs af alle klientwebsteder.
Tilgængelige muligheder
Text
Tilføj grundlæggende tekstinput.
Kun input numeriske værdier.
For længere tekstindtastninger.
Rig visuel teksteditor.
Input kodestykker direkte.
Gem skjulte baggrundsdata.
Slå en option til/fra.
Åbn avancerede indstillinger popover.
Vælg mellem dropdown muligheder.
Vælg en hvilken som helst farve visuelt.
Vælg en skrifttypefamilie.
Styr al tekststyling.
Vælg en dato/tid.
Input eller vælg links.
Upload eller vælg medie.
Vælg flere billeder sammen.
Vælg fra ikonbibliotek.
Juster værdier med skyderen.
Sæt polstring, margin osv.
Anvend skyggeeffekter visuelt.
Indstil elementbaggrundsegenskaber.
Vælg mellem billedindstillinger.
Opret gentagne indholdsgrupper.
Organiser indhold i faner.
Tilføj farveindstillinger i din widget.