ElementsKit kommer med widgeten Contact Form 7 som kompletterar funktionerna i plugin-programmet för formulärbyggare. Du kan anpassa stilarna för Kontaktformulär 7 med Elementor genom att utnyttja sidbyggarens funktionalitet till fullo.

Läs den här dokumentationen för att lära dig hur du skapar och anpassar formuläret med Kontaktformulär 7 med Elementor.

Nödvändig förutsättning:

You need to have Kontaktformulär 7 Plugin installerat på din WordPress-webbplats.

Create a form with Contact Form 7 #

Follow the below steps and create your desired form easily.

Step 1: Add New Contact Form #

1. Gå till Kontakt > Lägg till ny.
2. Ange ett formulärnamn.
3. Konfigurera formulärets inställningar och attribut.
4. Klicka på Spara knapp.

Steg-2: Få kontaktformulär 7 i Elementor #

För att få kontaktformulär 7 på Elementor, aktivera först ElementsKit Contact Form 7-widgeten, öppna sedan Elementor-redigeraren och dra och släpp widgeten till designområdet.

Aktivera widgeten Kontaktformulär 7 #

Så här aktiverar du Content Ticker-widgeten:

1. Navigera till ElementsKit > Widgets från WordPress-instrumentpanelen.
2. Hitta Kontaktformulär 7 widget från listan och aktivera widgeten.
3. Klicka på SPARA ÄNDRINGAR.

Dra och släpp widgeten #

Efter det, dra och släpp ElementsKit Kontaktformulär 7 widgeten till Elementor-redigeraren.

Steg 3: Välj ett formulär att redigera med Elementor #

I det här steget kan du välja vilket formulär du vill redigera. För det kan du välja formuläret från rullgardinsmenyn.

I Innehåll > Kontaktformulär 7 > Stil du hittar en lista över formulär skapade med Kontaktformulär 7. Välj ett formulär och fortsätt till nästa steg.

Steg 4: Anpassa kontaktformulär 7 med Elementor #

Nu kan du anpassa stilarna för etiketterna, inmatningsfältet och knappen i Kontaktformulär 7 med Elementor.

Märka #

1. Typografi: Ställ in typografin för etiketttext.
2. Färg: Välj en färgtext för etiketttexten.
3. Marginal: Justera marginalen för formulärfältsetiketten.
4. Antydan: Du kan också ändra typografin och färgen på platshållaren.

Inmatning #

1. Stoppning: Justera utfyllningen av inmatningsfältet.
2. Bredd: Du kan justera bredden på inmatningsfältet.
3. Höjd: Du kan ändra inmatningsfältets höjd.
4. Marginal botten: Ändra marginalen längst ner i inmatningsfältet.

5. Textarea Höjd: För det långa textfältet kan du ändra dess höjd.
6. Utfyllnad av textområde: Du kan också ändra utfyllnaden av textområdet.

7. Bakgrundstyp: Välj en bakgrundsfärgstyp (klassisk eller gradientfärg).
8. Färg: Välj en bakgrundsfärg för inmatningsfältet.
9. Kantradie: Ställ in ramradien för inmatningsfältet.
10. Kanttyp: Välj inmatningsfältets kanttyp.
11. Box Shadow: Du kan ställa in boxskuggan för inmatningsfältet.

Du kan ställa in dessa attribut individuellt för Vanligt, Sväva, och Fokuslägen.

12. Typografi: Ställ in typografin för inmatningstexten.
13. Text färg: Välj en färg för inmatningstexten.
14. Platshållarteckensnittsstorlek: Justera teckenstorleken på platshållaren.
15. Platshållarfärg: Välj en färg för platshållartexten.

Kolla advanced features of ElementsKit 👇