Mindenkinek megvannak a maga kedvencei – tavasszal Péterünk mutatta be az általa leginkább kedvelt Fast Secure Contact Form űrlapkészítő bővítményt, most pedig gyakori vendégszerzőnk, Pári Balázs ír a Contact Form 7-ről, amelyet ő szokott választani, és amelynek segítségével nagyon egyszerűen hozhatsz létre profi űrlapokat.

A Contact Form 7 használatát ajánlom minden WordPress felhasználónak, a kis vállalati vagy hobby honlapoktól kezdve egészen a nagy portálokig. Ebben a bejegyzésben bemutatom, hogy hogyan készíthetsz egy egyszerű űrlapot.

A szokásos bővítménytelepítés után a Vezérlőpulton létrejön egy Kapcsolat nevű menüpont, a Hozzászólás nevű menüpont alatt. Erre kattintva megtekintheted eddigi űrlapjaidat, szerkesztheted őket és újakat hozhatsz létre. (A bejegyzés képeire kattintva megnézheted őket nagyobb méretben.)

Contact Form 7

Új űrlap létrehozásához kattints a lap tetején levő Új hozzáadása feliratú gombra. Ezután a felugró ablakban válaszd ki az űrlap nyelvét, ez esetünkben az alapértelmezett magyar lesz.

Most pedig nézzük meg lépésről-lépésre, hogy hogyan kell létrehozni, majd egy oldalba beilleszteni egy űrlapot.

 

1. lépés: Az űrlap nevének megadása

Az űrlap nevének módosításához húzd a kurzort a jelenlegi név fölé, majd kattints rá kétszer. Így átalakul beviteli mezővé, amit könnyen szerkeszthetsz. Miután megadtad a megfelelő nevet, kattints egy üres területre, és a beviteli mező értéke elmentődik.

Contact Form 7

2. lépés: Az űrlap szerkesztése

Az űrlap tartalmi részét is nagyon egyszerű szerkeszteni. Egy beviteli mező így épül fel:

<p>Mező neve<br />
[text* your-name] </p>

Tehát nyitsz egy bekezdést, jön a mező neve, majd sortörés, utána a mező rövid kódja (a program generálja), végül pedig lezárod a bekezdést.

A bal oldali ablakba kell írni az űrlap törzsének szövegét, a jobb oldaliban pedig a címkék (azaz a mezők, csak ezt így sikerült fordítani) finomhangolása végezhető el.

Contact Form 7

2/a. (opcionális) lépés: Új címke (azaz új mező) hozzáadása (ha szükséges)

Jobb oldalon kattints a Címke létrehozása nevű legördülő menüre, majd válaszd ki a használni kívánt címke típusát. Ezután megjelennek a címke részletes beállításai. Miután elvégezted a finomhangolást (például meghatároztad a beviteli mezők szélességét), a kapott rövid kódot illeszd be az űrlap törzsébe a bal oldali ablakban.

3. lépés: Az e-mail beállítások elvégzése

Az e-mail nevű dobozban beállíthatod azt, hogy hogyan küldje el Neked a rendszer a kitöltött űrlapot.

Az E-mail (2) nevű jelölődoboz bejelölésével egy második e-mail címre is elküldheted a kitöltött űrlapot, tehát így például másolatot küldhetsz a feladónak vagy értesítheted az üzenetről a munkatársadat is.

Contact Form 7

4. lépés: Az üzenetek megváltoztatása, további beállítások megadása

Az Üzenetek nevű dobozban kedved szerint átírhatod a képernyőn megjelenő visszaigazoló szövegeket. A További beállítások nevű dobozban pedig egyedi (css) kódokkal testreszabhatod űrlapod kinézetét.

Contact Form 7

Contact Form 75. lépés: Az elkészült űrlap mentése

Ha elkészültél az űrlappal, görgess fel a lap tetejére, és mentsd el az elkészült űrlapot. A mentés után kapott kódot másold vágólapra (CTRL+C). Az űrlapot a rövid kódja segítségével kedved szerint beillesztheted (CTRL+V) egy oldalba, egy bejegyzésbe, vagy egy widgetbe is. Ez utóbbi esetben figyelj arra, hogy a mezők ne legyenek szélesebbek, mint az oldalsáv (lásd 2/a. lépés, a mezők finomhangolása).

 

A következő bejegyzésben részletesen bemutatom, hogy hogyan hozhatsz létre egy megrendelő űrlapot, ha terméket vagy szolgáltatást szeretnél eladni a weboldaladon, de csak néhány van, így nem érdemes rá egy komplett webáruházat felhúzni.
(A bejegyzés csak WP-Suli Klub tagok számára lesz elérhető.)