Lägg till CSS eller JavaScript i ditt schema

Med HTML kan du lägga till CSS och JavaScript i anpassade meddelanden på skärmen. CSS styr utseendet och JavaScript kan lägga till funktioner, till exempel chatt, knappar och statistik från Google Analytics.

Om du bara vill ändra vanliga texter börjar du med anpassa skärmtexter.

Var kan du lägga till kod?

HTML, CSS och JavaScript kan infogas i textfält som tillåter HTML. Sådana fält finns i kontots layoutinställningar, på sidan Konfigurera > Layout för varje schema och som HTML-kommentarer i anpassade formulär. E-postmeddelanden kan innehålla HTML om HTML-formatet har aktiverats.

JavaScript kan behöva aktiveras av supporten för gratiskonton. JavaScript kan inte användas i e-postmeddelanden.

Anpassa schemats utseende med CSS

Öppna meddelandets källkod med knappen < >. Du kan ange CSS direkt på ett HTML-element eller länka till en extern stilmall. En extern CSS-fil behöver ligga på en annan server, eftersom du inte kan lagra CSS-filer direkt i SuperSaaS.

<p style="color: green; font-size: 16px;">Grön text med teckenstorleken 16 pixlar.</p>

Grön text med teckenstorleken 16 pixlar.

CSS direkt på ett element passar små ändringar. Om många element ska ha samma utseende är en extern stilmall enklare att underhålla. Spara och kontrollera sidan efter ändringen.

<link rel="stylesheet" href="https://{www.insertyoururl}/css/style.css">

CSS i e-post

Aktivera HTML-format för e-post i kontots layoutinställningar för att använda bilder och formatering. I e-post behöver CSS anges direkt på elementen, eftersom e-postprogram inte stöder stilmallar på samma sätt som webbläsare.

Anpassa en bokningswidget

Du kan även lägga till egen CSS i en bokningswidget. Ange CSS eller länken till en extern CSS-fil i alternativet custom_css. Widgetens struktur och identifierare kan ändras när den uppdateras, så kontrollera anpassningarna efter sådana ändringar.

var supersaas = new SuperSaaS("Demokonto", "SPA-Terapeut", {"custom_css": "h1 {color:red}"})

Lägg till funktioner och analys

JavaScript kan lägga till exempelvis chatt, knappar eller statistikverktyg som Google Analytics. Hämta kodsnutten från tjänsten som ska integreras. Läs även bloggartikeln om att lägga till funktioner med JavaScript (på engelska).

Infoga ett skript steg för steg

Öppna det meddelandefält där funktionen ska visas.
Klicka på < > för att öppna källkoden.
Klistra in kodsnutten och spara meddelandet.
Spara även ändringarna längst ner på layoutsidan.
Öppna sidan där skriptet ska användas och kontrollera att funktionen fungerar. Upprepa för andra meddelandefält om funktionen behövs på fler sidor.

Ett textfält rymmer högst 3000 tecken. Längre skript kan ligga i en extern fil som laddas med attributet src. Använd gärna defer för att undvika att skriptet fördröjer sidans innehåll.

Använd autotext och följ slutförda bokningar

Autotext ersätts automatiskt med uppgifter om användaren eller bokningen. Med villkoret $if paid kan ett skript till exempel köras enbart efter en genomförd betalning.

$if paid {Tack för din bokning, $name <script>…</script>}

Om betalningen misslyckas eller en administratör bokar utan att betala körs inte skriptet i det exemplet.

Skicka användaren till en egen tacksida

På Konfigurera > Process kan du ange en webbadress dit användaren skickas efter en lyckad bokning. På den egna tacksidan kan du lägga till analyskod. Adressen kan innehålla $name, $id, $price, $slot_id, $email, $lang och $full_name, som ersätts med motsvarande bokningsuppgifter.