SurveyMonkey

CSS gebruiken om uw enquête op te maken in een bepaalde stijl

Enterprise-functie: neem contact op met de afdeling Verkoop als u geïnteresseerd bent. Als u al een Enterprise-account hebt, neemt u contact op met uw Customer Success Manager.

Primaire Enterprise-beheerders kunnen CSS toevoegen om een aangepast enquêtethema te maken dat past bij het uiterlijk van uw enquête.

U kunt een aangepast thema maken om algemene stijlwijzigingen aan te brengen. Gebruik de tekstopmaakwerkbalk om stijlwijzigingen aan te brengen die uniek zijn voor een specifieke enquêtevraag.

Primaire beheerders kunnen CSS toevoegen voor een aangepast enquêtethema dat overeenkomt met uw visuele middelen, lettertypen, kleuren en stijlvoorkeuren.

Een nieuw aangepast thema toevoegen aan de bibliotheek:

  1. Selecteer Mijn team in het hoofdnavigatiemenu en selecteer Bibliotheek.
  2. Selecteer + Nieuw item (item toevoegen).
  3. Kies een CSS-thema.
  4. Selecteer Code kopiëren en plak de code in het CSS-bewerkingsprogramma van uw voorkeur.
  5. Pas de code aan en bekijk een voorbeeld: voeg de code toe aan het vak onder Thema aanpassen en selecteer Voorbeeld genereren.
  6. Selecteer Opslaan.

Tip: Bekijk een voorbeeld van uw aangepaste CSS-thema voordat u uw enquête verzendt.

  • Enquêtevoorbeeld gebruiken om uw aangepaste CSS-thema te bekijken

Als een aangepast CSS-thema eenmaal is opgeslagen, kan alleen de primaire beheerder de pagina-elementen bewerken of wijzigen.

Een aangepast thema bewerken:

  1. Selecteer Mijn team in het hoofdnavigatiemenu en selecteer Bibliotheek.
  2. Selecteer ... en klik op Bijwerken.
  3. Kies een CSS-thema.
  4. Selecteer Code kopiëren en plak de code in het CSS-bewerkingsprogramma van uw voorkeur.
  5. Pas de code aan en bekijk een voorbeeld: voeg de code toe aan het vak onder Thema aanpassen en selecteer Voorbeeld genereren.
  6. Selecteer Opslaan.

Dit zijn de pagina-elementen die u kunt aanpassen met CSS.

CSS-eigenschapTekenreekswaarde
LettertypeUw organisatie heeft mogelijk een voorkeur voor een lettertypefamilie.
Op dit moment kunt u alleen lettertypen gebruiken die worden vermeld bij de CSS-webveilige lettertypen.
TekengrootteEen getal, bijv. 32px
KleurGebruik een kleurenkiezer om de RGBA-waarde van uw kleur te genereren.
AchtergrondkleurIs een HEX-code of een RGBA-waarde.
Afbeelding die laat zien hoe de paginatitel eruitziet

U kunt paginatitels toevoegen aan de verschillende pagina's in uw enquête, zodat deze er overzichtelijk en geordend uitzien. 

#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;
}

Tip: Gebruik een kleurenkiezer om de RGBA-waarde of hexcode voor uw kleur te genereren.

  • De tekenstijl wijzigen
  • Het lettertypegewicht wijzigen
  • De text-decoration wijzigen
Afbeelding van de enquêtetitel.

De enquêtetitel wordt boven aan elke enquêtepagina weergegeven terwijl uw respondenten de enquête invullen, tenzij u de titel verbergt.

#surveyTitle {
color: rgba(0,0,96,1);
font-family: National2;
font-size: 26;
font-style: NORMAL;
font-weight: BOLD;
text-decoration: NONE;
}
  • De tekenstijl wijzigen
  • Het lettertypegewicht wijzigen
  • De text-decoration wijzigen

De achtergrondkleur wordt weergegeven achter de vragen in uw enquête. De achtergrondkleur van de enquête wordt alleen weergegeven als u geen achtergrondafbeelding hebt toegevoegd.

#surveyPage {
background-color: rgba(137,230,243,1);
}
#surveyPageSecondaryColor {
background-color: rgba(84,213,231,1);
}

Tip: Gebruik een kleurenkiezer om de RGBA-waarde van uw kleur te genereren.

Afbeelding die laat zien hoe de vraagtitel eruitziet

U kunt de weergave van de vraagtekst in verschillende vraagtypen aanpassen.

#questionTitle {
color: rgba(0,0,96,1);
font-family: National2;
font-size: 22;
font-style: NORMAL;
font-weight: LIGHT;
text-decoration: NONE;
}
  • De tekenstijl wijzigen
  • Het lettertypegewicht wijzigen
  • De text-decoration wijzigen
Afbeelding die laat zien hoe de vraagtekst eruitziet

U kunt aanpassen hoe de antwoordkeuzes worden weergegeven bij respondenten, evenals vraagtypen die een markeringskleur gebruiken wanneer ze worden geselecteerd. Bijvoorbeeld een meerkeuzevraag.

#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);
}
  • De tekenstijl wijzigen
  • Het lettertypegewicht wijzigen
  • De text-decoration wijzigen
Afbeelding die laat zien hoe een knop eruitziet

Mensen die uw enquête invullen, kunnen deze knoppen gebruiken om door een enquête te navigeren. Als een respondent op elke pagina van de enquête op de knop Volgende of Gereed klikt, worden reacties opgeslagen en verzonden.

#button {
font-family: National2;
font-size: 15;
font-weight: REGULAR;
}
  • Het lettertypegewicht wijzigen
Afbeelding van een foutmelding

Er worden foutberichten weergegeven bij respondenten die een vereiste vraag leeg laten of als hun antwoord niet binnen het vereiste bereik of de vereiste limiet valt.

#error {
font-size: 16;
font-style: NORMAL;
font-weight: LIGHT;
text-decoration: NONE;
}
  • De tekenstijl wijzigen
  • Het lettertypegewicht wijzigen
  • De text-decoration wijzigen

U kunt de paginalay-out gebruiken om te kiezen hoe en waar uw achtergrondkleur of -afbeelding wordt weergegeven.

	#pageLayout {
layout: banner;
opacity: 0.0;
}

Tip: Stel de dekking in op 100 voor een effen achtergrondkleur.