Vlastní vzhled jídelníčku v iframe (Custom CSS)

Chcete si upravit vzhled jídelníčku nebo registračního formuláře podle designu vašeho webu? Stačí nahrát vlastní CSS soubor.

Jak na to krok za krokem

1️. Nahrajte vlastní CSS soubor

1. V levém panelu klikněte v části Účet na Web.
2. Na obrazovce Web klikněte na odkaz Spravovat vlastní CSS soubor (na původní obrazovce) – nahrávání souboru zatím zůstalo na původní obrazovce Správa účtu → Web.
3. V poli Vlastní CSS soubor nahrajte svůj .css soubor.
4. Uložte změny.

Hotovo – od této chvíle se vaše styly budou načítat automaticky. Jméno nahraného souboru pak uvidíte i na obrazovce Web, popisuje ji Menu na web či intranet, vlastní URL adresa a meta data.

2️. Vložte iframe skript na svůj web nebo intranet

1. V levém panelu klikněte v části Účet na Web.
2. Pod formulářem najdete hotový kód <script>.
3. Zkopírujte celý kód.
4. Vložte jej na místo na svém webu nebo intranetu, kde chcete zobrazit jídelníček.

Kde se vlastní CSS použije?

Vaše styly se automaticky aplikují na:

• Jídelníček zobrazený v iframe (?iframe)
• Registrační formulář otevřený z iframe

Video návod zde:

Doporučené CSS selektory

Aby se vaše styly správně přepsaly přes původní vzhled, používejte konkrétnější selektory.

Jídelníček v iframe

section .container.content .table.table-menu td.col-label {  /* vaše styly */ }
section .container.content .table.table-menu td.col-name { /* vaše styly */ }
section .container.content .table.table-menu td.col-price { /* vaše styly * }

Hlavní tlačítko pod nabídkou

section .container.content a.btn.btn-primary.btn-lg.btn-block { /* vaše styly * }

Registrace z iframe

main.login-page #register-firm-form .form-control { /* vaše styly }
main.login-page #register-firm-form .btn-u.btn-block { /* vaše styly * }
main.login-page #loginForm .input-container { /* vaše styly * }

Důležité pravidlo: Specificita

Aby se váš styl opravdu projevil:

• Používejte kontext (např. main.login-page, section .container.content)
• Používejte ID formulářů (#register-firm-form, #loginForm)
• Pokud se styl nepřepíše, přidejte !important ke konkrétní vlastnosti