Doplněk Kontaktní formuláře nabízí možnost si formulář snadno vytvořit pomocí vizuálního editoru. Není třeba tedy mít žádné znalosti programování. V tomto článku si na příkladu ukážeme jak editor používat.
Naším cílem bude vytvoření kontaktního formuláře pro sjednání schůzky.
Videonávod
Vytvoření formuláře
Nový formulář vytvoříme kliknutím na tlačítko “+ Přidat formulář” v administraci.
Nejprve zadejte název, pod kterým pak formulář najdete v administraci.
Na první obrazovce zvolíme název a pomocí přepínače umístění formuláře.
- “Ve všech kategoriích” znamená, že se formulář bude zobrazovat všude.
- “Jen v kategorii”, vám nabídne možnost specifikovat jednu i více kategorií.
- “Na konkrétním místě, použít shortcode” vám umožní vložit formulář na jakékoliv místo i stránku ve vašem Shoptetu.
Pokračujte stisknutím zeleného tlačítka “Uložit a generovat formulář”
Následně se vám zobrazí vizuální editor formulářů. Ten se dělí na dvě hlavní části.
- Pravá část nabízí prvky, které můžete využít.
- Levá část slouží pro vizuální poskládání formuláře.
Zkuste v pravé části kliknout na “Textový vstup” a přetáhnout jej do prázdné plochy. Výsledek by měl vypadat následovně.
Název “Textový vstup” můžete snadno přepsat na libovolný text. Pro naši ukázku zvolíme “Vaše jméno”.
Když na prvek najedete myší – tak se vám v pravé části zobrazí několik ikon. Pomocí ikony tužky se dostanete do nastavení, kde přepínačem “Požadováno” zajistíte, že jméno musí uživatel vyplnit. Sekci podmínek a další atributy nepotřebujete.
Stejným způsobem vložíme další “textový vstup” a přejmenujme jej na “. Váš e–mail”
Následně vložte prvek Datum, jenž pojmenujeme “Který den vám nejlépe vyhovuje pro schůzku?”
A na závěr vložíme “Tlačítko”, ve kterém opět zvolíme ikonu tužky a přepneme záložku na “Možnosti”, kde si tlačítko můžeme přejmenovat např. na “Odeslat” a změníme jej z button na submit. Viz obrázek.
Pod editorem se nachází tlačítko “Vykreslit formulář”, po jehož kliknutí se nám ukáže, jak bude formulář vypadat. Nebojte – jde jen o ukázku – design a barvy si načte dle šablony, kterou máte vybranou v Shoptetu.
Se samotným vzhledem a zarovnáním prvků si můžete ještě trochu vyhrát. Pokud například v pravém panelu použijte šipku tak se dostanete do sekce “HTML elementy”, které vám umožní vložit do formuláře různé texty a nadpisy.
Další nabídka pak obsahuje “Rozložení”, díky kterému můžete dát prvky například vedle sebe. Určitě si to vyzkoušejte. Díky “Sloupec” si můžeme dát “Vaše jméno” a “Váš e-mail” hezky vedle sebe.
A když si formulář nyní vykreslíme, bude vypadat takto:
Jak vidíte, tak vizuální editor vám umožňuje snadno vytvořit formulář libovolného účelu. Vyzkoušejte si vytvořit nějaký přímo pro vás a vaše potřeby.
Nezapomeňte si vaši práci uložit stejnojmenným tlačítkem v pravém panelu.
Tlačítko “vyčistit” vám umožňuje vše smazat a začít znovu.
Následně je potřeba nastavit zobrazení formuláře v Shoptetu. Jak na to? To se dozvíte v následujícím článku ZDE.