Pridanie CSS alebo JavaScriptu do vášho rozvrhu

• Zistite viac o pridávaní HTML do textových polí
• Zmeňte vzhľad vášho rozvrhu pomocou CSS
• Zmeňte vzhľad vášho widgetu pomocou CSS
• Zistite viac o JavaScriptových fragmentoch a o tom, ako fungujú
• Naučte sa, ako vložiť JavaScript na integráciu dynamických funkcií do vášho rozvrhu
• Pridajte extra možnosti pri použití skriptov, ako je auto text alebo analytický snippet

Pridanie HTML do textových polí

• V poli správy pod Nastavenia rozvrhu
• V poliach správy v každom rozvrhu na stránke Nastavenie > Vzhľad
• V poli pre HTML komentáre, ktoré sa nachádza v prispôsobených formulároch po prechode na Nastavenie > Design
• V poliach správy e-mailov na stránke Nastavenie > Vzhľad, ak je HTML povolené pre e-mailové správy

Zmeňte vzhľad vášho rozvrhu pomocou CSS

Ak chcete pridať špecifické štýly na stránky vášho rozvrhu, aby ladili s vaším webom, môžete použiť CSS. Rovnako ako skripty, CSS môže byť pridané do každého poľa správy, ktoré umožňuje HTML. Kliknite na tlačidlo < > na paneli nástrojov poľa správy, aby ste otvorili pole pre zdrojový kód a pridali CSS. Na použitie CSS vo vašom rozvrhu budete potrebovať základné technické znalosti. Existujú dva spôsoby, ako používať CSS v SuperSaaS: môžete použiť inline CSS alebo odkazovať na externý stylesheet.

Inline CSS

Inline CSS je metóda, ktorá vám umožňuje priamo aplikovať štýly na jednotlivé HTML prvky vo vašom rozvrhu. Robí sa to pomocou atribútu style v otváracom tagu HTML prvku. Napríklad, ak chcete zmeniť farbu textu v odstavci na zelenú a nastaviť veľkosť písma na 16 pixelov, použili by ste inline CSS nasledovne:

Toto je odstavec so zeleným textom a veľkosťou písma 16 pixelov.

Inline CSS je skvelé na rýchle zmeny štýlu konkrétneho prvku bez ovplyvnenia zvyšku stránky. Avšak, stáva sa menej praktickým, keď potrebujete aplikovať rovnaký štýl na veľa prvkov, pretože musíte rovnaký kód opakovať.

Inline CSS v emailoch

SuperSaaS ponúka dva typy e-mailových formátov: jednoduchý text a HTML. Predvolene sú e-maily odosielané ako jednoduchý text, čo umožňuje len základný text. Ak chcete zahrnúť obrázky, HTML alebo aplikovať štýly ako CSS, povolte HTML formátovanie pre e-maily na stránke Nastavenia rozvrhu. V e-mailoch musíte použiť inline CSS, pretože e-maily nepodporujú štýlové listy CSS tak, ako webové stránky. Po povolení HTML formátovania pre e-maily môžete aplikovať inline CSS, ako je vysvetlené vyššie.

Použitie externého stylesheetu

Kým inline CSS je užitočné pre malé zmeny, ak máte veľa CSS, stáva sa neprehľadným, a potom je vhodnejšie použiť externý stylesheet. Ak chcete odkázať na externý stylesheet, je dôležité, aby bol stylesheet prístupný cez iný server, pretože nie je možné ukladať CSS súbory priamo v SuperSaaS. Základná štruktúra na odkazovanie na externý stylesheet vyzerá nasledovne:

Po použití CSS v zdrojovom kóde polí správy, ktoré umožňujú HTML obsah, stlačte ‚Uložiť‘ a navštívte stránku, aby ste sa uistili, že CSS bolo správne aplikované.

Pridanie CSS do vášho widgetu

Môžete tiež pridať CSS do widgetu rozvrhu, ktorý môže byť vložený na váš web. Ak chcete prispôsobiť štýl widgetu, môžete buď pridať vlastné CSS, ktoré bude umiestnené medzi tagy štýlu v každom rámci, alebo odkazovať na externý stylesheet. Majte však na pamäti, že štruktúra a identifikátory widgetu sa môžu meniť s aktualizáciami, takže sa na ne nespoliehajte.

var supersaas = new SuperSaaS("demo", "Therapist", {"custom_css": "h1 {color:red}"})
var supersaas = new SuperSaaS("demo", "Therapist", {"custom_css": "https://….css"})

Viac informácií o prispôsobení vášho SuperSaaS widgetu nájdete v našej dokumentácii pre vývojárov.

Použitie skriptov v SuperSaaS

JavaScriptové skripty môžu byť užitočné na integráciu dynamických funkcií na stránky alebo formuláre rozvrhu, aby zlepšili rezervačný proces. Môžete integrovať rôzne služby alebo funkcie, ako sú live chat, tlačidlá, odpočítavanie alebo sledovacie skripty pre analytické služby ako Google Analytics alebo Bing.

Napríklad, nasledujúci fragment pridáva vyskakovacie tlačidlo ako toto , ktoré možno použiť na zobrazenie ďalších informácií, keď zákazníci rezervujú prostredníctvom vašej rezervačnej stránky.

Ako vložiť skript

1. Nájdite svoje pole správy: Prejdite na pole správy, kde chcete pridať váš JavaScriptový skript. Toto pole správy môže byť na ktoromkoľvek z vyššie uvedených miest
2. Otvorte textové pole so zdrojovým kódom: Kliknite na tlačidlo < > na paneli nástrojov poľa správy, aby ste otvorili pole pre zdrojový kód
3. Skopírujte váš skript: Získajte fragment kódu služby alebo funkcie, ktorú chcete integrovať, napríklad live chat tlačidlo pre živú podporu alebo analytickú službu ako Google Analytics
4. Pridajte ho do poľa so zdrojovým kódom a uložte: Vložte fragment kódu do poľa so zdrojovým kódom v SuperSaaS a kliknite na uložiť. Potom prejdite na spodok stránky rozvrhu a kliknite na tlačidlo uložiť zmeny
5. Testovanie: Po uložení kódu navštívte stránku, kde ste použili fragment kódu, aby ste sa uistili, že bol skript správne aplikovaný. Ak potrebujete fragment na viacerých stránkach, zopakujte proces vloženia pre každé vlastné pole správy

Extra možnosti v SuperSaaS

Použitie auto-textu so skriptmi

Auto-textové reťazce sú sada ‚magických slov‘, ktoré sa automaticky nahrádzajú niečím iným pri generovaní správy. Auto-textové výrazy sú užitočné pre e-maily a správy na obrazovke. Môžu sa však tiež použiť v HTML v kombinácii so skriptom. Na stránke prispôsobenie správ na obrazovke nájdete všetky auto-textové výrazy, ktoré je možné použiť s HTML.

Auto-text sa môže tiež použiť na podmienené pridanie skriptov. Napríklad, na pridanie skriptu len v prípade úspešnej platby. Ak chcete pridať fragment kódu do vášho podmieneného auto-textového výrazu, jednoducho ho vložte dovnútra zložených zátvoriek.