The Kontaktformular 7 Element af Master Addons er en specialiseret widget, der bruges til at integrere og style formularer, der er oprettet ved hjælp af det populære Contact Form 7 plugin i din Elementor designs. Dette giver dig mulighed for at udnytte den robuste funktionalitet af CF7, mens du får en kraftfuld visuel tilpasning gennem Elementor.
Ved hjælp af Kontaktformular 7 Element kan du:
- Select enhver eksisterende kontaktformular 7-formular fra en dropdown.
- Vælg mellem flere Designvariationer (Style One gennem Style Eleven).
- Styr synligheden af Fejlmeddelelser og Valideringsfejl.
- Fuldt tilpasse Form Container, Input- og tekstområdefelter, Etiketter, og den Indsend knap for Normal og Hover stater.
- Stil visningen af Fejl- og valideringsmeddelelser.
Så lad os se, hvordan du tilføjer og tilpasser dette element.
Hvad er kontaktformular 7-widgetten i Elementor? #
Kontaktformular 7 Elementor widget er en Master Addons element, der viser enhver eksisterende Kontaktformular 7 formular inde Elementor og giver dig fuld visuel kontrol over dens design. Det holder CF7 håndtering af formularen logik og e-mail-levering, mens du style beholderen, input felter, etiketter, indsende knap, og fejlmeddelelser fra Elementor's Style fane. Master Addons skibe elleve færdige design forudindstillinger (Style One gennem Style Eleven), så du kan restyle en almindelig CF7 formular til at matche dit websted uden at skrive nogen CSS. Det er en del af den gratis Master Addons widgets og udvidelser library.
Tilføjelse og konfiguration af kontaktformularen 7 Element #
For at tilføje en stilet kontaktformular 7 i Elementor: rediger din side med Elementor, træk i Kontaktformular 7 widget på lærredet, vælg din formular fra dropdown, vælg en af de elleve designvariationer, og finjuster derefter beholderen, felterne, etiketterne og indsend-knappen i Style fane. Trinene nedenfor går gennem hver del i detaljer.
Følg disse trin for at tilføje og konfigurere kontaktformular 7-elementet på enhver side på dit websted.
Trin 1: Opret eller rediger en side #
- Fra dit WordPress dashboard, gå til Sider → Tilføj Ny sådan opretter du en ny side. Du kan også vælge en eksisterende side og klikke Edit.
- Klik dernæst på “Rediger med Elementor” knap.
Trin 2: Find kontaktformular 7-elementet #
- I venstre Elementor panel, brug søgelinjen til at finde “Kontaktformular 7.”
- Træk og slip tilføjelsen til din ønskede sektion af siden.
Trin 3: Tilpas kontaktformular 7-indstillingerne #
Når du har placeret tilføjelsen, finder du tilpasningssektionerne i venstre panel, primært under Content og Style tabs.
Fanen Content #
Det er her, du vælger formularen og definerer fejlsynlighed.
Kontaktformular 7: #
- Vælg Kontaktformular: Vælg den specifikke kontaktformular 7-formular, du ønsker at vise, på rullelisten.
- Fejlstil (Fejlmeddelelser / Valideringsfejl): Vælg om du vil Show eller Hide de overordnede meddelelser om indsendelsessucces/fejl og de feltspecifikke valideringsfejl.
Designlayout: #
- Designvariationer: Vælg en foruddesignet typografi til formularen (Style One gennem Style Eleven).
Style Tab #
Det er her, du styrer formens visuelle udseende og dens elementer.
Formularbeholder: #
- Baggrundstype: Indstil baggrundstypografien for hele formularbeholderen: Classic eller Gradient.
- Border Top Farve: Indstil en farve til beholderens øverste kant.
- Formularbredde (%) / Formularudfyldning: Styr størrelsen og den indvendige afstand mellem formularbeholderen.
Titel: #
- Farve / Justering / Typografi: Stil formularens titel (hvis en sådan er til stede i CF7-strukturen).
Input & Textarea: #
- Baggrundsfarve / tekstfarve: Indstil baggrunds- og tekstfarven for alle input- og tekstområdefelter.
- Polstring: Juster den indre afstand mellem felterne.
- Feltbredde (%): Indstil felternes vandrette størrelse.
- Border Type / Border Radius: Indstil kantstilen og afrundede hjørner for inputfelterne.
Etiketter: #
- Farve / Typografi: Style tekstfarven og skrifttypeindstillingerne for feltetiketterne.
Indsend Knap: #
- Knap Typografi: Styr skrifttypeindstillingerne for knapteksten.
- Normal / Hover: Indstil følgende for knappen i begge tilstande:
- Baggrund Type
- Tekstfarve
- Border Color
- Border Radius / Polstring: Indstil de afrundede hjørner og den indre afstand på knappen.
Fejl: #
- Fejlmeddelelser (Generelt): Style de vigtigste indsendelsesfejlmeddelelser (ofte globale fejl-/succesmeddelelser).
- Tekstfarve / baggrundsfarve / kanttype.
- Valideringsfejl (feltspecifik): Style de fejlmeddelelser, der vises under individuelle felter (f.eks. “Dette felt er påkrævet”).
- Baggrundsfarve / tekstfarve / kanttype.
Trin 4: Gem og udgiv din side #
Når du har tilpasset alt til din smag:
- Klik på “Publicere” knap (hvis det er en ny side) eller “Update” (hvis du redigerer en eksisterende side).
- Test formularindsendelsen og fejlmeddelelserne på frontend for at sikre, at alle typografier anvendes korrekt.
Ofte stillede spørgsmål #
Hvordan styler jeg Kontaktformular 7 i Elementor?
Tilføj Master Addons Contact Form 7 widget til din Elementor side, vælg din formular fra dropdown, og åbn derefter fanen Stil. Derfra kan du genstyle formularbeholderen, input og tekstområde felter, etiketter, send knap og fejlmeddelelser. Du kan også vælge en af elleve færdige design forudindstillinger for at springe manuel styling over.
Er Kontaktformular 7-widgetten gratis i Master Addons?
Ja. Kontaktformular 7-widgetten er en del af den gratis Master Addons widgets og udvidelser bibliotek. Du behøver kun det gratis Contact Form 7 plugin og Master Addons installeret og aktiv; ingen Elementor Pro eller betalt opgradering er påkrævet for at style dine formularer.
Hvor mange Kontaktformular 7 designstile indeholder Master Addons?
Master Addons indeholder elleve præbyggede designvariationer, mærket Style One til Style Eleven. Vælg en under afsnittet Designlayout for at anvende et komplet udseende med det samme, og juster derefter farver, kanter og typografi i fanen Style, så det passer til dit brand.
Kan jeg tilføje et Font Awesome-ikon til knappen Kontaktformular 7 indsend?
Ja. Ud over den indbyggede knapstyling i denne widget kan du tilføje et ikon til send-knappen ved at følge vores vejledning om, hvordan du anvend et Font Awesome-ikon inde i knappen Kontaktformular 7 indsend. Det passer godt sammen med de Normal- og Hover-knapstile, du indstiller her.
Hvorfor vises min kontaktformular 7-styling ikke i Elementor?
Dette er næsten altid caching eller en plugin konflikt. Bekræft både Kontaktformular 7 og Master Addons er aktive, sørg for at du bruger Master Addons Kontaktformular 7 widget (ikke den almindelige CF7 shortcode), og udrens derefter din side cache og hard-reload. Holde aktiver lean hjælper også; se vores tips til fremskynd dit Elementor-websted.
