Enquêtes‎ > ‎Vormgeving‎ > ‎

Een Template maken


U kunt de vormgeving van de enquête ook met een HTML-template realiseren. Daarbij kunt u gebruik maken van vormgevingsmogelijkheden die uitgebreider zijn dan die van de vormgevingsmogelijkheden in Survalyzer. U moet echter wel kennis hebben van HTML en CSS om de mogelijkheden ten volle te kunnen benutten.

Een HTML-template is in principe een HTML-bestand dat via een URL benaderd kan worden en dat de plaatshouder {survey} bevat. De enquête-inhoud, vragen en tekstblokken dus, wordt dan getoond op de plaats van de plaatshouder.


Structuur

Begin met het vaststellen van Doctype:

<!DOCTYPE html>

Voor meer informatie verwijzen wij u  naar:

http://www.w3schools.com/tags/tag_doctype.asp

Als volgende komt de gebruikelijke HTML opbouw:

<html>

  <head>

  </head>

  <body>

  </body>

</html>

Wanneer u een standaard html pagina als template aanmaakt dan zijn er geen aanpassingen aan de opmaak te zien.

Header

De header zal de volgende inhoud moeten bevatten:

Viewport

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Viewport is noodzakelijk om het responsive design ook te laten werken.

CSS-Files

<link href="https://[sub].datacoll.net/content/elements.css" rel="stylesheet" type="text/css" />

<link href="https://[sub].datacoll.net/content/defaultvariables.css" rel="stylesheet" type="text/css" />

<link href="https://[sub].datacoll.net/content/site.css" rel="stylesheet" type="text/css" />



Hier zal [sub] vervangen moeten worden met uw eigen subdomein.

Hierna volgend kan u uw eigen stylesheet toevoegen. Met uw eigen stylesheet kunt u naar wens elke stijl aanpassen.

Alle bestanden zullen via een beveiligde verbinding (https) moeten worden aangeboden vanwege beveiligingsvoorschriften.

Body

Door {survey} toe te voegen zal de gehele inhoud van de enquête worden toegevoegd.

Voor een volledig overzicht wat verder toegevoegd kan worden kunt u Enquête-placeholders raadplegen. Dit kan van belang zijn om te bepalen waar onderdelen zoals een kop- of voettekst moeten worden weergegeven.


Voorbeeld template

Een voorbeeldtemplate met alle vraagtypen kunt u hier downloaden.

Hier kunt u dit template ook toegepast zien:

https://marketing.datacoll.net/eokmtslytv?l=nl


Een template gebruiken

Om een template voor een enquête te gebruiken kunt u Vormgeving raadplegen.

Meertalige enquêtes

Bij een meertalige enquête kunt u een HTML-template gebruiken dat verschillende content (bijvoorbeeld een logo) aan deelnemers toont, afhankelijk van de enquêtetaal. Elk paginaobject kan een unieke inhoud per ingestelde enquêtetaal tonen.

Het HTML-element zal hiervoor een taal code nodig hebben, bijvoorbeeld:

lang=”it”

De stijl- en ontwerpopties kunnen in het template worden gedefinieerd met de volgende CSS-syntax:

:lang(languagecode) {

 css declarations;

}


De :lang() selector wordt gebruikt om de elementen te selecteren met een bepaald ‘lang’-attribuut. De waarde van het ‘lang’-attribuut is meestal een code van twee letters, bijvoorbeeld lang=”nl” (voor Nederlands) of lang=”en” (voor Engels).

Voorbeeld:

Drie elementen hebben elk een andere inhoud voor taal:

<div lang="en">Hello, this is English</div>

<div lang="nl">Hallo, dit is Nederlands</div>

<div lang="it">Ciao, questo è italiano </div>


Vervolgens kunt u een stijl bepalen voor een taal (in het voorbeeld Engels):

div:lang(en){

      color: red;

}

Of u kunt juist alles laten verbergen dat niet in het Engels is opgesteld als Engels als enquêtetaal is geselecteerd:

:lang(en) :lang(de), :lang(en) :lang(it){

      display: none;

}


Taalcodes

Een lijst met alle taalcodes vindt u hier: Taalcodes