Actions

Translations

New Template System in LS3.x/74/nl: Difference between revisions

From LimeSurvey Manual

No edit summary
No edit summary
Line 3: Line 3:
<div class="simplebox">[[File:help.png]] We gebruiken weer het voorbeeld van het uitbreiden van het "bootswatch" thema in LimeSurvey versie 3.4.3.</div>   
<div class="simplebox">[[File:help.png]] We gebruiken weer het voorbeeld van het uitbreiden van het "bootswatch" thema in LimeSurvey versie 3.4.3.</div>   
=== Een aangepast thema maken  ===
=== Een aangepast thema maken  ===
#Extend het "bootswatch" thema zoals eerder is aangegeven.
# Extend het "bootswatch" thema zoals eerder is aangegeven.
#Kopieer <span style="color: #BA2121;">custom.css</span> naar het lokale thema.
# Kopieer <span style="color: #BA2121;">custom.css</span> naar het lokale thema.
===Thema-opties toevoegen===
===Thema-opties toevoegen===
#Kopieer de  inhoud van <span style="color: #BA2121;">/themes/survey/bootswatch/options/</span> naar <span style="color: #BA2121;">/upload/themes/survey/yourThemeName/options/</span>.
# Kopieer de  inhoud van <span style="color: #BA2121;">/themes/survey/bootswatch/options/</span> naar <span style="color: # BA2121;">/upload/themes/survey/yourThemeName/options/</span>.
#Open <span style="color: #BA2121;">/upload/themes/survey/yourThemeName/options/options.twig</span> in de editor en zoek naar "{# Bootstrap Bootswatch theme #}". Voeg direct voor het parent  <nowiki><div class='row'></nowiki> element, toe:<syntaxhighlight lang="html" enclose="div">
# Open <span style="color: #BA2121;">/upload/themes/survey/yourThemeName/options/options.twig</span> in de editor en zoek naar "{# Bootstrap Bootswatch theme #}". Voeg direct voor het parent  <nowiki><div class='row'></nowiki> element, toe:<syntaxhighlight lang="html" enclose="div">
{# Aangepaste enquête-naam in navigatie-taakbalk #}
{# Aangepaste enquête-naam in navigatie-taakbalk #}
<div class='row'>
<div class='row'>
<div class='col-sm-12 col-md-6'>
<div class='col-sm-12 col-md-6'>

Revision as of 14:44, 15 May 2019

Message definition (New Template System in LS3.x)
== Adding theme options to control positioning and display of survey elements  ==
This tutorial will show how to add options to an extended theme to display survey elements in various locations. In this case, we will create theme options to show the survey title in two different locations.
<div class="simplebox">[[File:help.png]] For the sake of simplicity, we will base the tutorial on an extension of the "bootswatch" theme in LimeSurvey version 3.4.3.</div>  
=== Create a custom theme  ===
#Extend the "bootswatch" theme as described above.
#Copy <span style="color: #BA2121;">custom.css</span> to the local theme as described above.
===Create new theme options===
#Copy the contents of <span style="color: #BA2121;">/themes/survey/bootswatch/options/</span> to <span style="color: #BA2121;">/upload/themes/survey/yourThemeName/options/</span>.
#Open <span style="color: #BA2121;">/upload/themes/survey/yourThemeName/options/options.twig</span> in an editor and find "{# Bootstrap Bootswatch theme #}". Directly before its parent  <nowiki><div class='row'></nowiki> element, add this:<syntaxhighlight lang="html">
{# Custom survey name in navbar #}
<div class='row'>
<div class='col-sm-12 col-md-6'>

Thema-opties toevoegen om het plaatsen en tonen van enquête-onderdelen te besturen

Met deze uitleg willen we tonen hoe je opties kunt toevoegen aan een uitgebreid thema om enquête-onderdelen te tonen op een bepaalde plaats. We willen de titel van de enquête op twee verschillende plaatsen kunnen tonen.

We gebruiken weer het voorbeeld van het uitbreiden van het "bootswatch" thema in LimeSurvey versie 3.4.3.

Een aangepast thema maken

  1. Extend het "bootswatch" thema zoals eerder is aangegeven.
  2. Kopieer custom.css naar het lokale thema.

Thema-opties toevoegen

  1. Kopieer de inhoud van /themes/survey/bootswatch/options/ naar /upload/themes/survey/yourThemeName/options/.
  2. Open /upload/themes/survey/yourThemeName/options/options.twig in de editor en zoek naar "{# Bootstrap Bootswatch theme #}". Voeg direct voor het parent <div class='row'> element, toe:<syntaxhighlight lang="html" enclose="div">

{# Aangepaste enquête-naam in navigatie-taakbalk #}