Sådan formateres en kontaktformular 7 i Divi

At kunne skabe indhold til en webside kræver stor opmærksomhed på detaljer. Hver lille detalje kan forbedres, det er en regel. Og det gælder i endnu højere grad, når vi har en stor hjemmeside eller mange små detaljer at dække. Et eksempel på dette er, hvis vi ejer en onlinebutik, der er oprettet på platforme som Blogger.

Ofte bringer disse typer sider en masse små detaljer til at dække, såsom hvordan produkter kan filtreres i søgemaskinen eller de tilsvarende annoncedesigns.

Givet dette, kan vi indse, hvornår detaljeringsgraden for at kunne dække inden for vores websteder . Det hele afhænger dog af niveauet af kreativitet det vi skal muligvis anstrenge os på vores hjemmeside. For inden da fortæller vi om en lille detalje, som du kan dække på få minutter, nemlig Kontaktformular 7.

ContactForm 7 er et af de mest brugte formular-plugins af brugere af forskellige websider. Det er faktisk en meget effektiv måde at give vores besøgende mulighed for at interagere med os via en kontaktside eller et andet sted.

Men du har den lille detalje, der ofte viser sig at være et lidt simpelt undersøgelsesplugin, til det punkt, at mange betragter dets udseende som noget uskøn . Derfor er vi nødt til at tænke på bedre måder at tilpasse dette populære plugin til vores tema.

Med sidstnævnte i tankerne kan vi nævne Divi som et af de mest populære temaer i WordPress og på grund af dets æstetik. Det er rigtig hyggeligt at se. Af denne grund kan det være lidt kedeligt at bruge Kontaktformular 7 på en webside med Divi, fordi de to stilarter ikke passer sammen.

Det er derfor, vi skal formatere ContactForm 7, så det kan ses i samme æstetiske forstand som Divi. Se nedenfor, hvordan du kan gøre det.

Tilpasning af ContactForm 7 til Divi

Virkelig at kunne bruge Kontaktformular 7 er en velsignelse, når vi ønsker at modtage en besked fra vores besøgende og være i stand til at interagere med dem, hvis vi ønsker det. Men hvis vi har Divi som et tema kan vi have det lille problem, at dette plugin slet ikke kombinerer med vores tema.

Det er derfor, vi skal omformulere udseendet af ContactForm 7 og tilpasse det til udseendet af Divi. Vi kan gøre det på en meget enkel måde. For at gøre dette skal vi gå ind i menuen Divi derefter i den indstilling, der vises som "Temaindstillinger" finder vi her CSS personliggjort. I denne ramme bliver vi nødt til at indtaste kodet Næste .

.wpcf7-text, .wpcf7-textarea, .wpcf7-captchar {

baggrundsfarve: #eee! vigtig;

grænse: ingen! vigtig;

bredde: 100%! vigtig;

-moz-grænse-radius: 0! vigtig;

-webkit-border-radius: 0! vigtig;

grænse-radius: 0! vigtig;

skriftstørrelse: 14px;

farve: #999! vigtig;

polstring: 16px! vigtig;

-moz-boks-størrelse: grænse-kasse;

-webkit-boks-størrelse: border-box;

box-sizing: border-box;

}

.wpcf7-submit {

farve: #8B3C90! vigtig;

margin: 8px auto 0;

markør: pointer;

skriftstørrelse: 20px;

skrifttypevægt: 500;

-moz-border-radius: 3px;

-webkit-border-radius: 3px;

kantradius: 3px;

polstring: 6px 20px;

linjehøjde: 1,7em;

gennemsigtig baggrund;

kant: fast 2px;

-webkit-font-smoothing: anti-aliased;

-moz-osx-font-smoothing: gråtoner;

-moz-overgang: hver 0.2s;

-webkit-overgang: hver 0.2s;

overgang: hver 0.2s;

}

.wpcf7-submit: hover {

baggrundsfarve: #eee;

kantfarve: #eee;

polstring: 6px 20px! vigtig;

}

Husk, at hvert af de steder, hvor det er angivet #eee og #8B3C90 , skal du ændre det, så du yderligere kan tilpasse farverne, så de matcher dem, du bruger på din webside. Alt du skal gøre er at bruge Divi-builderen for at kunne tilpasse form .

Hvorfor ikke bruge andre alternativer?

Du undrer dig måske over, hvorfor du ikke skulle gøre bedre brug af kontaktformularværktøjet, der følger med Divi. Svaret på dette er, at det virkelig ikke er så nyttigt som at bruge ContactForm 7, det har ikke så mange muligheder og det er ikke så intuitivt og enkelt. Det er derfor, det er bedst at holde sig til ContactForm 7 og tilpasse det efter behov.