SurveyMonkey
Använd CSS för att anpassa din enkät
ENTERPRISE-FUNKTION: Om du är intresserad, kontakta försäljningen. Om du redan har ett Enterprise-konto kan du kontakta din kundrelationsansvariga.
Du kan skapa ett anpassat tema för att göra globala stiländringar. Använd verktygsfältet för textformatering för att göra stiländringar för en specifik enkätfråga.
Enterprise-teamets huvudadministratörer kan lägga till CSS för att skapa ett anpassat enkättema och profilera utseendet på enkäten.
Skapa ett anpassat CSS-tema
Huvudadministratörer kan lägga till CSS för att skapa ett anpassat enkättema som matchar dina visuella resurser, teckensnitt, färger och stilpreferenser.
Så här lägger du till ett nytt anpassat tema i biblioteket:
- Tryck på Mitt team i huvudnavigeringen och välj Bibliotek.
- Välj + Nytt objekt (Lägg till objekt).
- Välj CSS-tema.
- Tryck på Kopiera kod och klistra in i önskat CSS-redigeringsverktyg.
- Anpassa koden och visa sedan en förhandsgranskning genom att lägga till den i rutan under Anpassa tema och sedan välja Skapa förhandsgranskning.
- Tryck på Spara.
TIPS! Förhandsgranska ditt anpassade CSS-tema innan du skickar ut enkäten.
- Använd förhandsgranska enkät för att se ditt anpassade CSS-tema
Uppdatera ett anpassat CSS-tema
När ett anpassat CSS-tema har sparats är det bara huvudadministratören som kan redigera eller ändra sidelementen.
Så här redigerar du ett anpassat tema:
- Tryck på Mitt team i huvudnavigeringen och välj Bibliotek.
- Välj ... och klicka på Uppdatera.
- Välj CSS-tema.
- Tryck på Kopiera kod och klistra in i önskat CSS-redigeringsverktyg.
- Anpassa koden och visa sedan en förhandsgranskning genom att lägga till den i rutan under Anpassa tema och sedan välja Skapa förhandsgranskning.
- Tryck på Spara.
Teammedlemmar kan inte ändra eller redigera enskilda element i en enkät med ett anpassat CSS-tema.
Anpassa sidelement
Allmänna funktioner
| CSS-funktion | Strängvärde |
| Teckensnittsfamilj | Din organisation kan ha en föredragen teckensnittsfamilj. För närvarande kan du bara använda teckensnitt som listas i CSS webbsäkra teckensnitt. |
| Teckenstorlek | En siffra, t.ex. 32 pixlar |
| Färg | Använd en färgväljare för att skapa färgens RGBA-värde. |
| Bakgrundsfärg | Är antingen en hexkod eller ett RGBA-värde. |
Sidans titel
För att hålla enkäten snygg och organiserad kan du lägga till sidtitlar på de olika sidorna i enkäten.
#pageTitle {
color: rgba(0,0,96,1);
background-color: #A1F3FB;
font-family: National2;
font-size: 24;
font-style: NORMAL;
font-weight: REGULAR;
text-decoration: NONE;
}
TIPS! Använd en färgväljare för att skapa färgens RGBA-värde eller hexkod.
- Ändra teckensnitt
- Ändra teckensnittsvikt
- Ändra textdekoration
Enkättitel
Enkättiteln visas högst upp på varje enkätsida när de svarande besvarar enkäten, om du inte väljer att dölja titeln.
#surveyTitle {
color: rgba(0,0,96,1);
font-family: National2;
font-size: 26;
font-style: NORMAL;
font-weight: BOLD;
text-decoration: NONE;
}
- Ändra teckensnitt
- Ändra teckensnittsvikt
- Ändra textdekoration
Enkätsida
Bakgrundsfärgen som visas bakom frågorna i enkäten. Enkätens bakgrundsfärg visas bara om du inte har lagt till någon bakgrundsbild.
#surveyPage {
background-color: rgba(137,230,243,1);
}
#surveyPageSecondaryColor {
background-color: rgba(84,213,231,1);
}
TIPS! Använd en färgväljare för att skapa färgens RGBA-värde.
Frågetitel
Du kan anpassa hur frågetexten ska se ut för olika frågetyper.
#questionTitle {
color: rgba(0,0,96,1);
font-family: National2;
font-size: 22;
font-style: NORMAL;
font-weight: LIGHT;
text-decoration: NONE;
}
- Ändra teckensnitt
- Ändra teckensnittsvikt
- Ändra textdekoration
Brödtext för fråga
Du kan anpassa hur svarsalternativ ska se ut för de svarande. Du kan också anpassa frågetyper som markeras med en färg när de väljs. Till exempel en flervalsfråga.
#questionBody {
color: rgba(0,0,96,1);
font-family: National2;
font-size: 18;
font-style: NORMAL;
font-weight: LIGHT;
text-decoration: NONE;
highlight-color: rgba(31,216,234,1);
}
- Ändra teckensnitt
- Ändra teckensnittsvikt
- Ändra textdekoration
Knapp
Personer som deltar i din enkät använder dessa knappar för att navigera igenom enkäten. När en svarande klickar på knappen Nästa eller Klar på varje sida i enkäten sparas svaren och skickas.
#button {
font-family: National2;
font-size: 15;
font-weight: REGULAR;
}
- Ändra teckensnittsvikt
Fel
Felmeddelanden visas för de svarande om de lämnar en obligatorisk fråga tom eller om deras svar inte ligger inom det obligatoriska intervallet eller gränsen.
#error {
font-size: 16;
font-style: NORMAL;
font-weight: LIGHT;
text-decoration: NONE;
}
- Ändra teckensnitt
- Ändra teckensnittsvikt
- Ändra textdekoration
Avslutningslänk
Avslutningslänkar visas i det övre högra hörnet på varje sida, så att de svarande kan avsluta enkäten utan att spara svaren som angetts på den aktuella sidan.
#exitLink {
background-color: rgba(0,0,0,0);
font-size: 12;
font-weight: LIGHT;
- Ändra teckensnittsvikt
Sidlayout
Du kan använda sidlayouten för att välja hur och var bakgrundsfärgen eller bilden visas.
#pageLayout {
layout: banner;
opacity: 0.0;
}
TIPS! Ställ in opaciteten på 100 för att få en heltäckande bakgrundsfärg.