Ako si vytvoriť kontaktný formulár vo WordPress

Aby vás vaši zákazníci alebo návštevníci webu mohli kontaktovať, potrebujte mať na svojej stránke kontaktný formulár. V nasledujúcom návode vám popíšem, ako ho vytvoríte vo WordPress.

Ako si vytvoriť kontaktný formulár vo WordPress

Na čo slúži kontaktný formulár

Kontaktný formulár slúži návštevníkom stránky ako jednoduchý nástroj pre kontaktovanie s vami. Návštevníci internetu ho využívajú radšej ako e-mail. Je to preto, že im šetrí čas. Môžu svoju správu napísať priamo na stránke bez toho, aby museli otvárať svoj e-mail.

Kontaktný formulár šetrí čas aj vám. A poskytne vám všetky informácie, ktoré potrebujete:

  • Vo formulári si nastavíte polia pre informácie, ktoré od ľudí vyžadujete. Napríklad telefónne číslo. Tieto informácie by v e-maili pravdepodobne neuviedli.
  • Môžete si nastaviť automatické odpovede, v ktorých používateľovi oznámite základné informácie.

Okrem toho vás používanie kontaktného formulára chráni proti spamu. Ak na webe uverejníte len aktívny e-mail, začnete dostávať množstvo nevyžiadanej pošty.

Ako pridať kontaktný formulár vo WordPress

WordPress ponúka možnosť vytvorenia kontaktného formulára pomocou pluginu. Osobne odporúčam využiť plugin Contact Form by WPForms.

Tento plugin je veľmi jednoduchý na ovládanie. Používa nástroj drag & drop a kontaktný formulár si v ňom rýchlo vytvorí aj začiatočník. V základnej verzii je dostupný zadarmo.

Ak budete potrebovať využívať zložitejšie funkcie, môžete ho upgradovať na WPForms Pro. Oproti free verzii obsahuje navyše možnosť ukladania odoslaných formulárov v databáze, nahrávanie súborov, šablóny formulárov a iné praktické funkcie.

Plugin si nainštalujete priamo z administrácie stránky. Po inštalácii nezabudnite plugin aktivovať. Presný postup sa dozviete v mojom článku Čo je to WordPress plugin? Ako ho nainštalovať?

V administrácii stránky sa vám po aktivovaní pluginu zobrazí nová položka WPForms.

Tvorba formulára pomocou WPForms

Ak chcete vytvoriť nový kontaktný formulár, prejdite na fukciu WPForms > Add new. Zobrazí sa vám nasledujúca stránka:

WPForms Add New
Pridanie kontaktného formulára

Ako prvé zadajte názov kontaktného formulára. Potom si vyberte šablónu, ktorú chcete používať. Základná verzia WPForms ponúka štyri šablóny na vytvorenie formulárov.

Prázdny formulár (blank form) — Ak si vyberiete prázdny formulár, môžete si vytvoriť vlastnú verziu pomocou funkcie drag & drop.

Jednoduchý formulár (Simple Contact Form) — táto šablóna ponúka možnosť použitia vopred pripraveného formulára. Budete si však môcť pridávať a odoberať jednotlivé polia tak, ako potrebujete.

Formulár na odber noviniek (Newsletter Signup Form) — v tejto šablóne vytvoríte formulár pre prihlásenie na odber noviniek vášho webu. Aj tu si môžete pridať a odobrať jednotlivé polia podľa vašich preferencií.

Formulár pre návrhy (Suggestion form) — využijete ho, ak chcete návštevníkov stránky požiadať o názory či návrhy.

💡 Tip: Pre rýchly web ⏱ je kľúčové vybrať si správny hosting. Odporúčam vsadiť na overenú kvalitu ➡️ WebSupport, Webglobe-Yegon alebo Wedos.

Ako vytvoriť jednoduchý formulár

Budeme pokračovať popisom postupu vytvorenia formulára pomocou šablóny Simple Contact Form.

Simple Contact Form
Vytvorenie jednoduchého formulára

V pravej časti obrazovky nájdete vopred vytvorené polia pre pridanie mena, e-mailu a správy. Keď prejdete myšou na jednotlivé polia, zobrazí sa vám ponuka pre ich vymazanie a úpravu. Môžete si ich tiež jednoducho chytiť myšou a presunúť na iné miesto vo formulári.

Pre pridanie nového poľa prejdite na ponuku v ľavej strane obrazovky. Na vybrané pole kliknite alebo ho pretiahnite myšou na pravú stranu.

Pre uloženie kontaktného formulára nezabudnite kliknúť na Save. Tlačidlo nájdete navrchu obrazovky.

Nastavenie vlastností formulára

Vytvorený formulár sa vám na stránke bude zobrazovať s tlačidlom Submit. Ak chcete nastaviť názov tlačidla v slovenčine, prejdite na Settings > General.

WPForms Settings General
Všeobecné nastavenia formulára

Okrem toho tu nájdete viacero iných možností nastavenia:

  • Form Name — tu upravujete názov kontaktného formulára.
  • Form Description — slúži na popis formulára.
  • Form CSS Class — umožňuje vložiť vlastnú triedu pre formulár.
  • Submit Button Text — tu upravíte text tlačidla
  • Submit Button Processing Text — vyplňte text, ktorý sa má zobraziť po odoslaní formulára.
  • Submit Button CSS Class — toto pole slúži na pridanie vlastnej triedy pre tlačidlo na odoslanie.
  • Enable anti-spam honeypot — okno v tomto riadku odporúčam ponechať zaškrtnuté. Táto funkcia slúži na ochranu proti spamovému odosielaniu formulára.

Pri nastavení vlastností na záložke General nemusíte okrem textu pre tlačidlo Submit a textu, ktorý sa zobrazí po odoslaní formulára nič upravovať.

Nastavenia notifikácii na e-mail

Pod záložkou Settings > Notifications nájdete ďalšie možnosti nastavení. A to nastavenia pre e-mailové upozornenia. Tie sa spravidla odosielajú na e-mailovú adresu správcu webu. Pre prehľadnosť prijímaných správ upravte predmet e-mailu. Ak chcete, môžete upraviť aj iné polia.

WPForms Settings Notifications
Nastavenie zasielania notifikácií
  • Notifications– tu zapínate alebo vypnete funkciu odosielania formulára na váš e-mail. Túto funkciu odporúčam nechať zapnutú. Jednotlivé vyplnené formuláre sa nikde neukladajú. Na vaše informovanie o nich slúži práve e-mailová notifikácia.
  • Send To Email Address— vyplňte e-mailovú adresu, na ktorú sa má formulár odoslať.
  • Email Subject— môžete si nastaviť aj predmet e-mailu.
  • From Name — názov odosielateľa e-mailu. Nájdete tu vopred nastavený názov vašej stránky.
  • From Email— e-mailová adresa odosielateľa.
  • Reply-To— e-mailová adresa pre odpoveď.
  • Message—telo e-mailu. Ak ponecháte nastavenie {all_fields} e-mail bude obsahovať všetky polia formulára.
💡 Tip na šablóny: z prémiových šablón mám dobré skúsenosti so šablónami StudioPress a s multifunkčnými šablónami Divi i Avada.

Nastavenie potvrdenia odoslania formulára

Potvrdenie formulára je to, čo sa návštevníkovi stránky zobrazí potom, ako odošle formulár. Môžete zvoliť poďakovanie za kontaktovanie alebo ho presmerovať na vybranú stránku webu. Nastavenia vykonáte na záložke Settings > Confirmations.

WPForms Settings Confirmations
Nastavenie potvrdenia odoslania

Najskôr si zvoľte typ potvrdenia. V poli Confirmation Type sú na výber tri možnosti:

  • Message– zobrazí text, ktorý napíšete do okna nižšie.
  • Show page– nastavíte presmerovanie na vybranú stránku webu.
  • Go To URL– vložte URL stránky, na ktorú má byť návštevník webu presmerovaný po odoslaní formulára.

Úprava, odstránenie a duplikovanie formulára

Všetky vytvorené formuláre sa zobrazia v zozname formulárov po kliknutí na WPForms v administrácii stránky. Keď prejdete myšou na názov formulára, zobrazí sa ponuka dostupných funkcií. Môžete si vybrať, či chcete formulár upravovať, zobraziť jeho náhľad, vymazať alebo duplikovať.

Poslednou z funkcií je počet zobrazení. Táto funkcia je dostupná len v Pro verzii. Vďaka nej sa vyplnené formuláre ukladajú priamo do administrácie stránky.

💡 Chcete rýchlejšiu ⏱ webstránku? Rýchlosť webstránky je dôležitá pre návštevníkov a aj z hľadiska SEO. Najlepšie výsledky som dosiahol s pluginom WP Rocket, ktorý jednoznačne odporúčam.

Ako pridať vo WordPress kontaktný formulár na stránku

Po vytvorení na nastavení vlastností formulára vo WPForms je ešte potrebné vložiť ho na stránku. Ako prvé si otvorte existujúcu stránku, ktorú chcete upravovať, alebo si vytvorte novú.

Na pridanie sa používa shortcode kontaktného formulára. Nájdete ho:

  1. na stránke úpravy formulára pod tlačidlom Embed embed v pravom hornom rohu,
  2. na stránke zoznamu všetkých formulárov v stĺpci shortcode.

Na stránke, kam chcete kontaktný formulár vložiť, si vytvorte nový blok. Do neho vložíte shortcode. Nezabudnite si uložiť všetky zmeny na stránke.

WPForms Insert Shortcode
Vloženie shortkódu

Takto bude vyzerať stránka po vložení shortcode.

Insert Contact Form
Vloženie kontaktného formulára na stránku

Ako pridať kontaktný formulár na bočný panel

Kontaktný formulár sa vo WordPress dá pridať aj na bočný panel, do hlavičky či päty stránky. V administrácii prejdite na možnosť Vzhľad > Widgety. V zozname widgetov zrolujte nižšie a nájdete WPForms.

Widgets WPForms
Widget WPForms

Formulár pridáte rovnako ako iné dostupné widgety pretiahnutím myšou na zvolené miesto.

Insert Contact Form To Sidebar
Pridanie kontaktného formulára na bočný panel

Vyplňte názov a vyberte formulár, ktorý chcete použiť. Nezabudnite na uloženie vykonaných zmien. Úpravy vloženého formulára môžete vykonávať aj so živým náhľadom.

Edit Sidebar
Úprava bočného panela s náhľadom

WPForms Premium vs WPForms Lite

Platená verzia WPForms Premium dokáže oproti bezplatnej (lite) verzii napríklad tieto užitočné tieto veci:

  • Možnosť vytvárať neobmedzené množstvo formulárov.
  • Väčšie množstvo šablón pre formuláre.
  • Možnosť používať podmienenú logiku na ovládanie viditeľnosti polí formulára.
  • Možnosť vytvárať viac-stránkové formuláre.
  • Možnosť vytvárať formuláre pre registráciu používateľov.
  • Pokročilá ochrana pred spamom.
  • Možnosť nahrávať a prijímať súbory cez formulár.
  • Pokročilé typy polí ako sú polia pre dátum a čas.
  • Možnosť ukladať, vidieť a spravovať odpovede z formulárov priamo v administrácii WordPress.
  • Integrácia so službami tretích strán ako sú napríklad: PayPal, Stripe, Mailchimp, AWeber, GetResponse, Constant Contact, Drip, Zapier…
Pomohol vám tento článok? Podporte ma prosím jeho zdieľaním. 👍

ZANECHAŤ ODPOVEĎ

Please enter your comment!
Please enter your name here
Súhlasím so spracovaním osobných údajov.