# Základní vstupní formulář
K vytvoření vlastního vstupního formuláře musíte splnit následující kroky:
* Vytvořte HTML dokument, který bude obsahovat potřebná pole.
* Přidejte CSS styly.
* Pomocí „JavaScript method“ zajistíte posílání dat z formuláře a přiřazení klienta do fronty.
* Nahrajete vytvořený formulář na libovolný hosting podporující protokol **HTTPS** a přidáte odkaz na formulář do administračního rozhraní.
Doporučujeme vytvářet vstupní formulář pomoci webové aplikace **codepen.io** kvůli jednoduchosti a přehlednosti.
```
Zadání:
Vytvořit vlastní vstupní formulář, který obsahuje Jméno, Email, Telefon, a umožňuje položit otázku.
```
### Jak bude formulář vypadat
#### Jak začít
Začít můžete kliknutím na [tento odkaz](https://codepen.io/pen?template=KXZyGp).
#### HTML
Editor kódu, který používáme je propojený s [bootstrap frameworkem](https://getbootstrap.com/docs/4.0/components/forms/).
#### **Poslání jména klienta**
```js
window.parent.postMessage({
type: 'SET_NAME',
name: 'Pan Veselý'
}, '*');
```
#### **Poslání emailu klienta**
```js
window.parent.postMessage({
type: 'SET_EMAIL',
email: 'pan.vesely@email.cz'
}, '*');
```
#### **Poslání telefonu klienta**
```js
window.parent.postMessage({
type: 'SET_PHONE',
phone: '111222333'
}, '*');
```
#### **Poslání vlastního parametru**
```js
window.parent.postMessage({
type: 'ADD_CUSTOM_DATA',
name: 'custom_field_name', // Název pole z call paramu
value: 'any' // string a max 2048
}, '*');
```
#### **Zařazení klienta do fronty**
```js
window.parent.postMessage({
type: 'ENQUEUE'
}, '*');
```
**JavaScript kód našeho příkladu**
#### Nahrát vytvořený formulář na libovolný hosting
V našem případě nejdříve klikněte na tlačítko **Save**, poté exportujte v **.zip** formátu (viz návod níže).
Máme připravený formulář, nyní je potřeba nahrát formulář na internet, abychom na něj mohli odkazovat z administračního rozhraní. V našem případě využijeme GitHub stránky. Bližší informace naleznete [zde](https://pages.github.com/).
V případě, že využijete jiný nástroj než codepen.io bude kód formuláře vypadat takto.
```html
```
#### Poslední krok
Vytvořili jste vstupní formulář pomocí codepen.io. Ten jste následně exportovali na váš počítač. Exportované složky jste nahráli do GitHub repozitáře a poté zapnuli GitHub stránky. Tím jste získali odkaz na formulář, který vložíte do administračního rozhraní.
