Gravity Forms Elementor Widget: Tilføj og stil Gravity Forms uden CSS

Gravity Forms er en Pro-widget i Master Addons, der placerer enhver Gravity Form på en Elementor-side og lader dig style den fra panelet. Vælg formularen fra en dropdown, start fra en af 11 designvariationer, og juster derefter etiketter, felter, afkrydsningsfelter, indsend-knappen, flersidede statuslinjer og fejlmeddelelser. Formularen fortsætter med at fungere nøjagtigt, som du byggede den i Gravity Forms.

weForms-widget Design Variations-forudindstillinger i Master Addons

11 færdige formdesigns

Dropdownen Designvariationer har 11 typografier. Vælg en som udgangspunkt, og skift derefter alt, hvad du kan lide, på fanen Stil. Du kan også skjule titel og beskrivelsessæt i Tyngdekraftsformularer og skrive en brugerdefineret overskrift i Elementor i stedet.

  • Skift mellem 11 designvariationer fra én dropdown.
  • Vis eller skjul formularens titel, beskrivelse, etiketter og pladsholdere.
  • Tilføj en brugerdefineret titel og beskrivelse uden at redigere selve formularen.

Felt-, afkrydsningsfelt- og radioknapstyling

Input og tekstområder får baggrund, tekstfarve, kant, radius, boksskygge og typografi, med en separat Fokustilstand. Indstil bredder og højder for input og tekstområder uafhængigt, plus polstring og tekstindrykning. Radioknapper og afkrydsningsfelter kan have brugerdefinerede størrelser, farver og grænseradius for de normale og kontrollerede tilstande.

  • Normal- og fokustilstande for inputfelter.
  • Separat bredde og højde for input og tekstområder.
  • Brugerdefinerede radio- og afkrydsningsfeltstile, sektionsdelere og produktprisfarver.
weForms danner containerstile i Master Addons-widgetten
weForms input, tekstområde og label styling

Indsend knap, flersidede formularer og meddelelser

Gør indsend-knappen auto, fuld bredde eller en brugerdefineret bredde, og derefter style dens farver, kant, radius, polstring, boks skygge og typografi, med hover farver. Multi-side formularer få styling til sideknapperne og statuslinjen. Fejlmeddelelser, ugyldige felter og takkemeddelelsen har hver deres farveindstillinger, og du kan skjule fejlmeddelelser helt.

  • Auto, fuld bredde eller brugerdefineret bredde indsend knap med hover farver.
  • Sideknap og statuslinjestyling til flersidede formularer.
  • Farver for fejlmeddelelser, ugyldige felter og takkemeddelelsen.

Elementors Shortcode-widget vs Gravity Forms-widgetten

Elementors gratis Shortcode-widget kan også vise en Gravity Form med [gravityform id="1"]. Formen virker, men det ser dog dit tema og Gravity Forms stil det, og ændre det betyder at skrive CSS.

Shortcode widgetMaster Addons Gravity Forms
PriceFreeMaster Addons Pro
Valg af formularenSkriv formular-id'et i en kortkodeVælg det fra en dropdown
Færdiglavede designsIngen11 designvariationer
Felt- og knapstylingBrugerdefineret CSSFanen Style, med fokus- og svævetilstande
Progress bar og fejl stylingBrugerdefineret CSSFanen Style
MobiljusteringerCSS medieforespørgslerResponsive kontroller til størrelser og mellemrum

Brug af en anden form plugin? Master Addons har gratis styling widgets til Kontaktformular 7, WPForms, Ninja Forms og weForms.

Skabelonfremviser
Facebook
Twitter
WhatsApp
Kopier Link
Køb Nu
Avanceret kontaktformular
Avanceret kontaktformular
Caldera Forms
Caldera Forms
Google Map med Kontaktformular
Google Map med Kontaktformular
Grundlæggende kontaktformular
Grundlæggende kontaktformular
Forretningsforespørgselsformular
Forretningsforespørgselsformular
Glas Kontaktformular
Glas Kontaktformular

Sådan tilføjes en Gravity Form til Elementor

Du skal bruge Gravity Forms med mindst én formular oprettet, og Master Addons Pro. Følg derefter disse trin:

  1. Slå Gravity Forms-widgeten til i Master Addons-dashboardet.
  2. Åbn din side i Elementor, søg i widgetpanelet for “Gravity Forms” og træk Master Addons-widgetten på plads.
  3. Vælg din formular i dropdownen Kontaktformular.
  4. Vælg en af de 11 designvariationer.
  5. Beslut om formulartitel, beskrivelse, etiketter og pladsholdere skal vises. Slå Brug Ajax til for at indsende formularen uden at genindlæse siden.
  6. Åbn fanen Stil for at indstille farver, kanter, mellemrum og typografi, og udgiv derefter.

Hvis dropdownen er tom, skal du kontrollere, at Gravity Forms er aktiv, og at du har oprettet en formular.

Ofte stillede spørgsmål til gravitationsformularer

Lær de mest stillede forespørgsler, brugerne har om Gravity Forms, og find svar på ét sted.
Skal jeg have Gravity Forms plugin installeret?

Ja. De widget stilarter formularer du bygger i Gravity Forms, så det plugin skal installeres og aktiv. Uden det, widget viser en meddelelse beder dig om at aktivere Gravity Forms.

Installer Gravity Forms, og opret din formular. I Elementor skal du trække widgetten Master Addons Gravity Forms over på siden, vælge formularen i dropdownen Kontaktformular, vælge en designvariation og style den i fanen Stil. Den trin-for-trin guide ovenfor dækker hver indstilling.

Kan jeg gøre formularerne responsive på mobile enheder?

Ja. Mange af kontrolelementerne til størrelse, afstand og justering har separate skrivebords-, tablet- og mobilværdier, så du kan ændre polstring, feltbredder og knapbredden for mindre skærme.

Ja. Widgetten udsender din formular gennem Gravity Forms selv, så betinget logik, flersidede formularer og tilføjelser fungerer på den måde, du indstiller dem. Widgetten ændrer kun, hvordan formularen ser ud.

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