Theme editor/sl

Predstavitev

LimeSurvey ima osnovni sistem za predloge in stile, ki omogoča tematsko prilagoditev aplikacije za uporabo v številnih brskalnikih.  Tukaj jih enostavno imenujemo Predloge.  Predloge omogočajo upravljanje z izgledom in občutkom pri anketiranju. Skrbnik lahko izbere predlogo, jo uporabi za vsako anketo in tako prilagodi izgled ter občutek anket svojim potrebam. Spremembe na predlogah so lahko tako enostavne, kot je dodajanje posebnega logotipa na pozdravno stran, menjava barv odzadja ali morda nova barva besedila za določene tipe vprašanj.

Z LimeSurvey-em dobite komplet predlog.Te prvotne predloge se nahajajo v imenikih znotraj LimeSurvey-eve namestitve v mapi "templates". Vsaka predloga ima svojo lastno mapo. Znotraj glavne mape vsake predloge se nahaja kopica datotek: predloge (.pstpl), oblikovni stili (.css), slike (.jpg ali .png) in morda še druge.

Kot pri ostalih sistemih, ki temeljijo na temah, so deli HTML kode shranjeni v datotekah predlog (.pstpl). Ta koda je prebrana in uporabljena za izgradnjo strani za prikaz anketirancem med anketiranjem. Pogosto se uporabljajo ključne besede, obdane z zavitimi oklepaji, ki so vključene v datoteke in se nato zamenjajo s pravim besedilom.  Poglejmo si primer takšne vsebine datoteke predloge in njen rezultat pri prikazu na strani za anketiranje:

<center><font face='verdana' color='red'>{SURVEYNAME}</font><br />
<font face='verdana' color='blue'><u>{SURVEYDESCRIPTION}</u></center>

Anketiranec vidi stran podobno tej:

Moja nova anketa To je moja anketa, s katero raziskujem vrsto čokolade, ki jo imajo ljudje najraje.

Predloge, sestavljene iz HTML kode, skrbijo za opredelitev položaja in vrsto prikazanega besedila ter podobne strukturne značilnosti strani. Pogosto vključujejo ali se sklicujejo na druge datoteke. Večina sklicevanj je na datoteke za oblikovne stile (CSS-je), ki opredeljujejo slog pisave, barvo, velikost, ozadje in podobne parametre, skupne vsem stranem ankete. HTML parametri za sklicevanja na CSS oblikovne stile so povezani z različnimi vrstami predmetov v HTML kodi. To omogoča oblikovnim stilom enkraten opis, kako naj prikaže vsakega od mnogih vrst pisav za besedilo ali druge predmete, ki se lahko prikažejo na več mestih. Obstajajo edinstveni razredi za vsak LimeSurvey-ev tip vprašanja, ki s tem omogočajo podroben nadzor nad videzom posameznega vprašanja. Datoteke predlog se lahko prav tako sklicujejo na datoteke slik, kot so logotipi ali gradniki za vrstico s prikazom napredka. Tudi posebne ključne besede med zavitimi oklepaji se zamenjajo z besedilom, ki je opredeljen v anketi za vsak pripadajoč prevod jezika (na primer naslov ankete ali besedilo vprašanja za vsak opredeljen jezik).

Če ustvarite novo predlogo po meri, prosimo razmislite o prispevanju nazaj v LimeSurvey-evo skupnost in jo tako omogočite za uporabo drugim uporabnikom. Z vašo pomočjo lahko raste naša zbirka predlog, anket in drugih dodatkov ter tako skupaj naredimo LimeSurvey še boljši! Poglejte si obstoječo zbirko predlog

Ustvarjanje nove predloge

Da lahko ustvarite novo predlogo (ali uredite obstoječo), potrebujete na anketnem sistemu kot uporabnik pravico za urejanje predlog in prav tako pravico za delo z datotekami v osnovnem operacijskem sistemu, na katerem gosti vaš anketni sistem.

Opozorilo:Ker lahko spremembe vplivajo na vse obstoječe ankete v anketnem sistemu, je smiselno omejiti pravico urejanja predlog na uporabnike, ki so usposobljeni in ki razumejo splošno zamisel kodnega zapisa. Predloge so napredne oblike HTML datotek, ki ne dovoljujejo preizkušanja tistim, ki niso seznanjeni s takšnim delom.

Zaželeni način za izdelavo nove predloge je s pomočjo urejevalnika predlog (glej v nadaljevanju) preko spletnega vmesnika za skrbnike. Nekateri uporabniki bi morda raje delali neposredno z datotekami predlog, da bi lahko uporabljali svoj priljubljeni urejevalnik besedila namesto spletnega vmesnika. Tudi v tem primeru je potrebno najprej uporabiti urejevalnik predlog, da z njim izdelate novo predlogo. Tako se bodo ustvarile nove osnove za predlogo z vsemi potrebnimi datotekami v mapi LimeSurvey-ev_spletni_koren/upload/templates/vaša_nova_predloga. Od tu naprej lahko uporabljate vaš priljubljeni urejevalnik besedila za ročno prilagajanje datotek predloge.

Opozorilo glede dovoljenj: na sistemih unix/linux bodo te datoteke predlog v lastništvu skupine in uporabnika, ki poganja spletni strežnik (na nekaterih sistemih je to "www"). Prepričajte se, da imate dostop za urejanje teh datotek in da pri shranjevanju ne zamenjajo lastništva (da jih bo mogoče kasneje urejati z urejevalnikom predlog, če bo to potrebno).

Morda datoteke predlog zgledajo na prvi pogled zapletene. Dobro je razumeti HTML označevalni jezik, po možnosti še CSS oblikovanje in imeti dostop do osnovnih namestitvenih datotek anketnega sistema, če datoteke in mape predlog ni mogoče urejati. Da si lažje razjasnite koncept predlog, se malce poigrajte z njeno vsebino. Pred tem ne pozabite ustvariti kopijo obstoječe predloge v novo mapo.

Številne LimeSurvey-eve 'javne' elemente je možno nastaviti z vrsto predlog. V tem razdelku je prikazana zelo kratka razlaga takšnih predlog.

LimeSurvey-ev urejevalnik predlog

Za lažje razumevanje in hitro posodobitev predlog LimeSurvey omogoča uporabo urejevalnika predlog, dosegljivega v glavni skrbniški orodni vrstici anketnega sistema. Ta urejevalnik predlog je na voljo le uporabnikom z dano pravico v varnostnih nastavitvah uporabnikov. Predloge vplivajo na vse ankete in lahko povzročijo, da je anketa neuporabna, če niso pravilno urejene. Zato je smiselno omejiti urejanje predlog zgolj na del uporabnikov, ki to delo res obvladajo. Imeti pravico za vstop v urejevalnik besedil ni dovolj.

LimeSurvey-ev urejevalnik besedil vam dovoljuje urejanje vsebine predlog neposredno na spletu. V urejevalnik predlog vstopite s klikom na ikono "Urejevalnik predlog" v LimeSurvey-evi skrbniški orodni vrstici. Glavno okno je podobno LimeSurvey-evemu oknu za delo z anketami. Omogoča vam izbiro predloge za urejanje ali ogled. Ko ste izbrali predlogo, lahko izbirate med številnimi zasloni ankete, ki se prikazujejo anketirancem. Predstavi se vam seznam datotek izbrane predloge, ki sestavljajo ta izbran zaslon.

Meni za delo s predlogami

• Ikona za urejanje: ikona za "urejanje" nakazuje ali je predlogo možno urejati ali ne. Nejasna ikona nakazuje, da je predloga le za branje, med tem ko izpostavljena/obarvana ikona pomeni, da je možno predlogo spreminjati. Za spreminjanje ikone iz zamegljene v obarvano je potrebno spremeniti dovoljenja predloge.
• Uvozi predlogo: omogoča uvažanje predlog.
• Izvozi predlogo: omogoča izboz trenutne predloge v datoteko oblike .zip.
• Kopiraj to predlogo:omogoča ustvarjanje nove predloge, ki je kopija trenutno izbrane.
• Preimenuj to predlogo: omogoča spreminjanje imena izbrane predloge. Običajno se uporablja po kopiranju obstoječe predloge ali po uvažanju predloge za spreminjanje map v ozadju predlog.

Spustni seznam "Zaslon" na desni strani vam omogoča izbiro določenega dela ankete, ki ga želite videti.

Uvažanje/izvažanje/kopiranje predloge

Kadar predlogo izvozite, s tem ustvarite arhiv v obliki zip datoteke, v kateri se nahajajo vse datoteke, ki sestavljajo predlogo (.pstpl datoteke, slike, css datoteke, ...). Izvoženo zip datoteko lahko enostavno uvozite v drug LimeSurvey-ev anketni sistem z uporabo njene funkcionalnosti za uvažanje ali s pomočjo ročnega kopiranja arhivske datoteke v namestitvene mape drugega anketnega sistema ter razpakiranjem v njeno ustrezno mapo za predloge. Če kopirate predlogo na isti anketni sistem, boste morali preimenovati mapo z drugim imenom kopije te predloge.

V kolikor vaše pravice za dostop do LimeSurvey-evih datotek in map vključujejo pravico branja in pisanja, potem lahko za ustvarjanje lokalne kopije predloge uporabite programa copy in rename.

Zgradba strani / uporaba v predlogah

• Pozdravna stran: startpage.pstpl, welcome.pstpl, privacy.pstpl, navigator.pstpl, endpage.pstpl
• Strani z vprašanji: startpage.pstpl, survey.pstpl, startgroup.pstpl, groupdescription.pstpl, question.pstpl, endgroup.pstpl
• Stran za oddajo ankete: startpage.pstpl, survey.pstpl, submit.pstpl, (privacy.pstpl), navigator.pstpl, endpage.pstpl
• Zaključna stran: startpage.pstpl, assessment.pstpl, completed.pstpl, endpage.pstpl

Datoteke predlog

Sledi seznam datotek za predloge, ki se uporabljajo za izgradnjo javne ankete in ki morajo obstajati v vsaki novo ustvarjeni mapi za predloge:

• startpage.pstpl: oblikuje začetek vsake html strani. Prične se pri oznaki "<head>" in ne sme vsebovati oznake "<html>". Ta 'sam začetek' standardne html strani je napisan s pomočjo ukaznih datotek (skript). Prosimo poskrbite, da vaše datoteke startpage.pstpl vsebujejo oznako <body>, kljub temu da z upoštevanjem W3 HTML standarov tega številni brskalniki ne zahtevajo striktno. Za zagon določenih javascript elementov morajo to oznako <body> najti LimeSurvey-eve ukazne datoteke. Ne pričakuje se, da se bodo v datoteki startpage.pstpl uporabljale številne 'ključne besede', najbrž pa si boste želeli v naslov vstaviti {SURVEYNAME}. Datoteka startpage.pstpl lahko vsebuje oznake, ki se zaključijo v ustrezni datoteki endpage.pstpl. Tako lahko začnete tabelo v tej datoteki in jo zaključite v datoteki endpage.pstpl. Datoteki startpage.pstpl in endpage.pstpl objameta vse možne datoteke, ki jih uporablja LimeSurvey.
• survey.pstpl: ta datoteka je druga najpogosteje uporabljena na večini anketnih straneh in zagotavlja prostor za umestitev imena in opisa ankete. Ta datoteka nima ustrezne 'zaključne' datoteke in je tako posledično potrebno zapreti vse odprte oznake v tej datoteki (oziroma ne puščajte odprtih tabel v tej datoteki, ker jih ni mogoče nikjer drugje zaključiti)
• welcome.pstpl: ta datoteka se uporablja le na pozdravni strani (kar je tudi glavna stran za ankete v obliki 'Vse skupaj'). To datoteko lahko uporabite, če želite natisniti pozdravno besedilo in ostale informacije, ki se naj bi nahajale v uvodni predstavitvi. Podobno kot pri datoteki 'survey.pstpl' za to datoteko ne obstaja ustrezna 'zaključna' datoteka, zato je potrebno prav tako zapreti vse odprte oznake v tej datoteki.
• startgroup.pstpl: ta datoteka nudi 'povzetek' za vprašanja znotraj skupine. Ima ustrezno zaključno datoteko 'endgroup.pstpl', ki jo lahko uporabimo za zapiranje odprtih oznak v tej datoteki, zato lahko odpremo tabelo znotraj te datoteke.
• groupdescription.pstpl: ta datoteka predloge se uporablja za prikaz opisa skupine. Je ločena od datoteke startgroup.pstpl, ker je v anketi oblike "Po vprašanjih" prikazana na svoji strani med skupinami, medtem ko v anketi oblike "Po skupinah" ali "Vse skupaj" ta datoteka skrbi za glavo za naslednja vprašanja. Datoteka groupdescription.pstpl nima ustrezne 'zaključne' datoteke, zato morajo biti vse oznake ustrezno zaključene.
• question.pstpl: ta datoteka vsebuje vaše anketno vprašanje, njen odgovor in območje za besedilo pomoči. Pri anketah oblike "Po skupinah" in "Vse skupaj" se ta datoteka predloge ciklično ponavlja za vsako vprašanje. Zanjo ni ustrezne zaključne datoteke, zato morajo biti vse oznake ustrezno zaključene.
• question_start.pstpl: ta datoteka vsebuje posamezne elemente, ki se nahajajo na začetku vprašanja. Vključena je znotraj datoteke 'question.pstpl' preko ključne besede {QUESTION}. To naj bi omogočilo oblikovalcem predlog več nadzora nad izgledom vprašanja. Ta del predloge se nahaja zunaj običajnega sistema predlog in je bila nadomeščena (od LS1.87 naprej). Vse ključne besede iz tega dela predloge so sedaj na voljo neposredno v datoteki question.pstpl. Opozorilo: predloge, ki uporabljajo datoteko question_start.pstpl, bodo še vedno delovale vsaj za nekaj nadaljnjih različic LS 1.x
• submit.pstpl (in privacy.pstpl): ta stran je predzadnja stran za vse oblike anket (razen za obliko "Vse skupaj"), kjer je anketirancu ponujena možnost pregleda vprašanj pred oddajo njihovih odzivov. Zagotavlja podatke o zasebnosti, kadar je anketa anonimna, ki jih izlušči iz datoteke privacy.pstpl.
• completed.pstpl: ta stran se prikaže kot končna stran, ko so odzivi na anketo shranjeni in je anketa zaključena. Uporabi se lahko za prikaz "povezave za posredovanje", katera se navede v nastavitvah ankete.
• endgroup.pstpl: ta datoteka zaključi skupino in se lahko uporabi za zaključevanje morebitnih odprtih oznak v datoteki startgroup.pstpl.
• navigator.pstpl: ta datoteka vsebuje gumbe za navigacijo po anketi (povezave "naslednja", "prejšnja", "zadnja", "oddaj", "shrani" in "počisti vse"). Uporablja se na vseh straneh razen na zaključni strani.
• printanswers.pstpl: ta datoteka vsebuje HTML sveženj za tiskanje ankete.
• print_group.pstpl: ta datoteka je enaka kot startgroup.pstpl in endgroup.pstpl skupaj,vendar je namenjena za tiskanje ankete.
• print_question.pstpl: ta datoteka je enake kot question.pstpl, vendar je namenjena za tiskanje ankete.
• print_survey.pstpl: ta datoteka je enaka kot survey.pstpl, vendar je namenjena za tiskanje ankete.

CSS in Javascript

Za predlogo se vedno uporabljata dve datoteki: template.css za css in template.js za javascript.

• {TEMPLATECSS}: doda vrstice za privzeto obliko css, template.css in template-rtl.css za rtl jezik.
• {TEMPLATEJS}: doda vrstice za privzete datoteke javascript-a, template.js in vse datoteke oblike js, ki jih potrebuje LimeSurvey.

Zamenjava privzetega css-ja ali javascript-a

Nekatera vprašanja uporabljajo posebne datoteke za javascript ali css. Lahko uporabite tudi svoje datoteke. Vse uporabljene datoteke v vaši anketi vključene v ./scripts ali v .//styles-public so lahko zamenjane. Potrebno je samo dodati datoteko z enakim imenom v vašo predlogo.

Druge datoteke predloge

Datotek privacy.pstpl, invitationemail.pstpl, reminderemail.pstpl in confirmationemail.pstpl LimeSurvey več ne uporablja. Namesto tega je vsebina privzeto nastavljena v ustreznih jezikovnih datotekah. Elektronska sporočila se lahko tako zdaj urejajo v anketi na nivoju ankete.

Standardne datoteke

Obstaja deset standardnih strani, ki jih lahko anketiranec vidi med anketiranjem ali dostopanjem do anketnega sistema. Vsaka stran je sestavljena iz več skupnih datotek predloge, ki je določena v nastavitvah ankete. Spodnja tabela nakazuje katere datoteke predlog se uporabljajo pri sestavljanju posamezne strani.

Strani ankete: Datoteke predloge	Anketa Seznam	Dobrodošlica	Vprašanje	Zaključeno	Počisti vse	Registracija	Naloži	Shrani	Natisni Odgovori	Natisni Anketa
Anketni seznam
Dobrodošlica
Zasebnost
Navigacija
Anketa
Uvodna skupina
Opis skupine
Vprašanje*
Končna skupina
Ocena
Zaključeno
Počisti vse
Registracija
Naloži
Shrani
Natisni odgovore
Natisni anketo
Natisni skupino
Natisni vprašanje
Začetna stran Zaključna stran Template.css

*Opomba: v različici 1.90 in višji ta nadomešča question.pstpl in question_start.pstpl. Če uporabljate starejšo predlogo po meri, boste morali na začetek datoteke question.pstpl dodati naslednje vrstice:

<div {QUESTION_ESSENTIALS} class="{QUESTION_CLASS}{QUESTION_MAN_CLASS}{QUESTION_INPUT_ERROR_CLASS}">

In potem dodajte še ustrezne zaključne oznake na konec datoteke question.pstpl:

</div>

*Opomba: LimeSurvey-eve js datoteke v različici 1.91 in prejšnjih niso vključene s predlogo. V različici 2 morate uporabiti ključno besedo {TEMPLATEJS} v eni izmed vaših datotek predloge, da s tem dodate povezavo do js datoteke. Lahko jo dodate v datoteki startpage.pstpl ali v datoteki endpage.pstpl. Odstranite lahko vrstico {TEMPLATEURL}/template.js in jo nadomestite z {TEMPLATEJS}, da s tem posodobite osebno predlogo.

Področje za kontrolo datotek

V oknu za "kontrolo datotek" na levi lahko izberete eno od datotek predloge, ki se uporablja za sestavo strani. HTML koda za to datoteko se bo potem prikazala na sredini v oknu "Sedaj urejam". Če je predloga na voljo za urejanje (določeno s pravicami map), lahko spreminjate vsebino datotek in jih potem shranite.

V oknu "Druge datoteke" je prikazan seznam vseh drugih datotek, ki se nahajajo v mapi predloge. Desno stran lahko uporabite za nalaganje in izbiranje slikovnih datotek (vaših slik, logotipov,...) ali drugih datotek, ki so potrebni za izgradnjo vaše predloge. Opomba: namesto neposrednih povezav do vsake slike v vaši predlogi lahko uporabite ključno besedo {TEMPLATEURL}. Tako namesto:

img src='/limesurvey/templates/yourtemplate/mypicture.jpg'

Lahko uporabite:

img src='{TEMPLATEURL}mypicture.jpg'

"Primer" strani predloge, ki jo urejate, je viden na dnu okna. Na noben način predloge ne morete izbrisati iz urejevalnika predlog. To mora biti narejeno z dostopom do sistemskih map in brisanjem datotek na tem nivoju.

Opomba: poslanih predlog ni mogoče urejati z urejevalnikom predlog in jih tudi naj nebi spreminjali. Če jih želite spreminjati, najprej ustvarite kopijo, na kateri delajte spremembe.

Mesto datotek predloge

LimeSurvey shranjuje vse 'standardne' predloge v njihove lastne različne podmape znotraj mape /templates, ki se nahaja v javni mapiz ostalimi LimeSurvey-evimi javnimi datotekami. Prilagojene predloge uporabnika se shranijo v mapo /upload/templates.

Da ustvarite novo predlogo, morate izbrati ustrezno ikono v urejevalniku predlog.

VEDNO mora obstajati mapa "default" v mapi predlog. Ta predloga se privzeto uporablja in se uporabi kot nadomestna, če mapa predloge ne obstaja ali je ni mogoče najti. Mapa "default" je vključena v paket za namestitev sistema.

Uporabite lahko poljubno sliko, ki ste jo naložili v območje za upravljanje predloge, z uporabo zapisa podobnega temu:

{TEMPLATEURL}imedatoteke.xyz

CSS oblikovanje vprašanj

Oblikovanje vprašanj je z uporaba CSS-ja postalo veliko enostavnejše. Vsak tip vprašanj ime sedaj svoj edinstven razred. Obvezna vprašanja imajo prav tako dodaten obvezni razred. Primer za neobvezno vprašanje:

<div id="question5" class="gender">
...
</div>

in v kolikor je vprašanje obvezno

<div id="question5" class="gender mandatory">
...
</div>

in če uporabnik ni odgovoril na obvezno vprašanje ali če je za vprašanje predvidena potrditev

<div id="question5" class="gender mandatory input-error">
...
</div>

in če ima vprašanje predvideno preverjanje, vendar je anketiranec napačno odgovoril

<div id="question6" class="text-short input-error">
...
</div>

Globalni razredi, ki se nanašajo na vprašanja

Ti razredi se uporabljajo za vsako vrsto vprašanja. Nekatere vrste vprašanj uporabljajo samo enega ali dva razreda, nekateri pa jih lahko uporabljajo več.

Globalni razredi

Ime razreda	Območje	Vrsta vprašanja	Primeri	Opomba
.question	Celoten blok vprašanja	Vse vrste vprašanj	<p class="question">, <ul class="question">, <table class="question">
.subquestions-list	Seznam podvprašanj	Več izbir, lestvica	<ul class="subquestions-list">, <table class="subquestions-list">	uporablja se tudi .questions-list
.answers-list	Seznam vprašanj	Vprašanja z eno izbiro, lestvice, vprašanja za več vnosov besedil	<ul class="answers-list">, <table class="answers-list">
.answer-item	Nanaša se na odgovore: en odgovor	Vprašanje z eno izbiro, lestvica, vprašanje za več vnosov besedil	<li class="answer-item">, <td class="answer-item">
.noanswer-item	Nanaša se na odgovore: brez odgovora	Vprašanje z eno izbiro, lestvica	<li class="noanswer-item">, <td class="noanswer-item">	Tudi če ni odgovora, je to prav tako odgovor. V tem primeru imamo dvojni razred noanswer-item in answer-item
.question-item	Nanaša se na vprašanje: eno vprašanje	Vprašanje z več besedila, lestvica	<li class="question-item">, <tr class="question-item">	Nekateri odgovori so prav tako vprašanja. V tem primeru imamo veliko razredov="question-item answer-item"
.checkbox-list	Seznam potrditvenih polj	Več izbir, tabela številk (potrditvena polja)	<ul class="checkbox-list">, <tr class="checkbox-list">	Nekatere vrste vprašanj imajo razred večih seznamov: kot seznam s komentarjem: razred="checkbox-list text-list"
.checkbox-item	Nanaša se na odgovore s potrditvenimi polji	Več izbir, tabela številk (potrditvena polja)	<li class="checkbox-item">, <td class="checkbox-item">
.radio-list	Seznam izbirni gumbi	Vprašanje z eno izbiro, lestvica	<ul class="radio-list">, <tr class="radio-list">
.radio-item	Nanaša se na odgovore s potrditvenimi polji	Vprašanje z eno izbiro, lestvica	<li class="radio-item">,
.text-list	Seznam za vnos besedila	Vprašanje z več besedila, besedilna lestvica	<ul class="text-list">, <tr class="text-list">
.text-item	Nanaša se na odgovore za besedilni vnos	Vprašanje z več besedila, besedilna lestvica	<li class="text-item">,
.numeric-list	Seznam vnosa besedila le s številčnimi odgovori	Več številskih odgovorov, lestvica s številkami	<ul class="text-list numeric-list">, <tr class="text-list numeric-list">
.numeric-item	Nanaša se na odgovore za vnos številk	Več številskih odgovorov, lestvica s številkami	<li class="numeric-item">, <td class="numeric-item">
.select-list	Seznam izbir	Lestvica številk, dvojna lestvica izbir	<table class="select-list">
.select-item	Nanaša se na odgovore z izbirami	Lestvica številk, dvojna lestvica izbir, ena možnost z izbiranjem	<p class="select-item">, <td class="select-item">
.hide	Uporablja se za dostopnost: skrito s css-jem vendar berljivo z bralnikom zaslona	Kratko besedilo	<label class="hide">	Lahko se uporablja za druge namene
.dontread	Uporablja se za dostopnost: ni berljivo z bralniki zaslonov	Lestvica	<th class="dontread">
.checkbox	vnos[vrsta=potrditveno polje]	Vprašanje s potrditvenimi polji	<input type="checkbox" class="checkbox">	Skupaj s sodobnim brsklanikom: ni potrebno vendar nekateri starejši brskalniki ga potrebujejo
.radio	vnos[tip=izbirni gumbi]	Vprašanje z izbirnimi gumbi	<input type="radio" class="radio">	Skupaj s sodobnim brsklanikom: ni potrebno vendar nekateri starejši brskalniki ga potrebujejo
.text	vnos[vrsta=besedilo]	Vprašanje za vnos besedila	<textarea class="text">
.answertext	Lestvica	Nanaša se ne odgovor lestvica	<th class="answertext">
.col-answers	Lestvica	Stolpec odgovorov	<col class="col-answers">
.odd .even	Lestvica	Menjava za stolpec	<col class="odd">
.odd .even	Lestvica	Menjava za stolpec	<col class="odd">
.array1 .array2	Lestvica	Menjava za stolpec	<tr class="array1">

Nekateri primeri vprašanj z razredi

Vprašanje vrste kratkega besedila:

<p class="question answer-item text-item ">
<label class="hide label" for="answerSGQA">Answer</label><input type="text" value="" id="answerSGQA" name="SGQA" size="50" class="text  empty">
</p>

Večkratno kratko besedilo

<ul class="subquestions-list questions-list text-list">
  <li class="question-item answer-item text-item" id="javatbdSGQA">
    <label for="answerSGQA">Some example subquestion</label>
     <span><input type="text" value="" id="answerSGQA" name="SGQA" size="20" class="text empty"></span>
  </li>
</ul>

Vprašanje vrste lestvica

<table class="question subquestion-list questions-list ">
	<caption class="hide read">Some explanation for accessibility.</caption>
	<colgroup class="col-responses">
		<col width="50%" class="col-answers">
		<col width="25%" class="odd">
		<col width="13.3%" class="col-no-answer even">
	</colgroup>
	<thead>
		<tr class="array1 dontread">
			<td>&nbsp;</td>
			<th>1</th>
			<th>No answer</th>
		</tr>
	</thead>
	<tbody>
		<tr class="array2 answers-list radio-list" id="javatbdSGQ">
			<th width="20%" class="answertext">Some example subquestion
			</th>
			<td class="answer_cell_001 answer-item radio-item">
				<label for="answerSGQA" class="hide read">1</label>
				<input type="radio" value="1" id="answerSGQA" name="SGQA" class="radio">
			</td>
			<td class="answer-item radio-item noanswer-item">
				<label for="answerSGQA" class="hide read">No answer</label>
				<input type="radio" value="" id="answerSGQA" name="SGQA" class="radio">
			</td>
		</tr>
	</tbody>
</table>

Celotni seznam razredov vprašanj

Vrsta vprašanja	Razred vprašanja	ID vprašanja
Pet stopenjska lestvica	.choice-5-pt-radio	5
Lestvica (10 stopenjska)	.array-10-pt	B
Lestvica (5 stopenjska)	.array-5-pt	A
Dvojna velikost polja	.array-flexible-duel-scale	1
Lestvica (povečalo, ostalo enako, zmanjšalo)	.array-increase-same-decrease	E
Array (Multi Flexible) (Numbers)	.array-multi-flexi	:
Polja (besedila)	.array-multi-flexi-text	;
Lestvica (da/ne/neodločen)	.array-yes-uncertain-no	C
Polje	.array-flexible-row	F
Polje po stolpcih	.array-flexible-column	H
Maskirano vprašanje	.boilerplate	X
Datum	.date	D
Spol	.gender	G
Ogromno besedilo	.text-huge	U
Zamenjava jezika	.language	I
Seznam (izbirni seznam)	.list-dropdown	!
Seznam (izbirni gumbi)	.list-radio	L
Seznam s komentarjem	.list-with-comment	O
Dolgo besedilo	.text-long	T
Več številskih odgovorov	.numeric-multi	K
Več možnosti	.multiple-opt	M
Več možnosti s komentarjem	.multiple-opt-comments	P
Več kratkih besedilnih vnosov	.multiple-short-txt	Q
Številski vnos	.numeric	N
Razvrščanje	.ranking	R
Kratko besedilo	.text-short	S
da/ne	.yes-no	Y

Celoten seznam razredov za potrjevanje

Opomba:  Pred različico 1.92 sta bila na voljo le razreda .mandatory in .input-error.

To se nanaša na sporočila za pomoč in/ali preverjanje, tako da je lahko vsaka vrsta posebej oblikovana.

Možnosti .hide-tip in .input-error privzeto sodelujeta, tako da lahko imate na začetku namige za preverjanje skrite. Pokažejo se, ko pride do napake pri preverjanju in ponovno izginejo, ko so te napake odpravljene.

Vse to je narejeno za to, da se odpravi potreba po opozorilih, ki bi se prikazovala v novih oknih. Namesto tega se lahko namigi prikažejo ali izginejo po potrebi in so kodirana z barvami. Tako lahko nakažejo če odgovori opravijo kriterije preverjanja.

Poleg tega kadar prvič obiščete stran, ki ne zadošča kriteriju preverjanja, lahko nasvete barvno kodirate v želeni barvi, da izpostavite kateri kriterij preverjanja ni bil izpolnjen. Potem ponovno prikažete stran z uporabo poudarjene barve, če anketiranec oddaja stran s ponavljajočimi napakami pri preverjanju.

Namen	CSS razred	Opis
Obvezno	.mandatory	vprašanje je obvezno
Napačen vnos s strani anketiranca	.input-error	vprašanje ima vsaj eno napako pri preverjanju
Skrij namig	.hide-tip	dodano, če uporabljate možnost hide_tip
Številčni odgovori	.em_num_answers	za min_answers in max_answers
Razpon vrednosti	.em_value_range	za min/max_num_value_n in multiflexible_min/max
Razpon vsote	.em_sum_range	za min/max/equals_num_value
Regex preverjanje	.em_regex_validation	za preverjanje regularnosti izrazov v vprašanju
Funkcija preverjanja stopnje vprašanja	.em_q_fn_validation	za možnost em_validation_q
Funkcija preverjanja stopnje podvprašanja	.em_sq_fn_validation	za možnost em_validation_sq
Ostali obvezni komentarji	.em_other_comment_mandatory	za ostele možnosti obveznih komentarjev - prikažejo se, kadar je izbrana možnost "drugo", vendar manjka povezan komentar.

Uvažanje stilov v vašo prilagojeno predlogo

Prilagojene oblike vprašanja so proti koncu vsake CSS datoteke predloge in se pričnejo z:

/* --------------------------- START: Question styles  ------------------------------ */

Če oblikujete svojo prilagojeno predlogo, lahko kopirate vse iz templates/default/template.css (postavitve na osnovi tabel) ali /templates/limespired/template.css (postavitve na osnovi CSS-ja) v vaš lasten oblikovni slog brez kakršnega koli vplivanja na vaše druge oblike.

Pogojne oblike slogov za Internet Explorer

Zaradi izrazitega neskladja pri usklajevanju med IE6, IE7 in večine drugih brskalnikov, obstajajo posebne pogojne oblike slogov za IE vključene v vsako predlogo.

<!--[if IE]>
  <link rel="stylesheet" type="text/css" href="{TEMPLATEURL}IE_fix_all-versions.css" />
<![endif]-->
<!--[if lt IE 7]>
  <link rel="stylesheet" type="text/css" href="{TEMPLATEURL}IE_fix_older-than-7.css" />
<![endif]-->
<!--[if IE 8]>
		<link rel="stylesheet" type="text/css" href="{TEMPLATEURL}ie_fix_8.css" />
<![endif]-->

Zgornjo kodo morate vključiti v vašo datoteko startpage.pstpl in kopije obeh oblik slogov bodisi iz /templates/default/ ali /templates/limespired za razporeditev na osnovi tabel in CSS-jev.

Opomba: če kopirate oblike v vašo lastno obliko slogov, jih boste skoraj zagotovo morali popravljati.

Druge rešitve za Internet Explorer

V datoteko startpage.pstpl lahko vstavite pogojni razred za telo in uporabite ta razred v vapi datoteki template.css. Ta metoda je uporabljena v predlogi citronade.

<!--[if lt IE 7 ]> <body class="lang-{SURVEYLANGUAGE} {SURVEYFORMAT} ie ie6 ielt7 ielt8 ielt9 no-js"> <![endif]-->
<!--[if IE 7 ]> <body class="lang-{SURVEYLANGUAGE} {SURVEYFORMAT} ie ie7 ielt8 ielt9 no-js"> <![endif]-->
<!--[if IE 8 ]> <body class="lang-{SURVEYLANGUAGE} {SURVEYFORMAT} ie ie8 ielt9  no-js"> <![endif]-->
<!--[if IE 9 ]> <body class="lang-{SURVEYLANGUAGE} {SURVEYFORMAT} ie ie9 no-js"> <![endif]-->
<!--[if gt IE 9]><!--><body id="body" class="lang-{SURVEYLANGUAGE} {SURVEYFORMAT} no-js"><!--<![endif]-->
<script type='text/javascript'>/*<![CDATA[*/(function(H){ H.className=H.className.replace(/\bno-js\b/,'js') })(document.getElementsByTagName('body')[0]);/*]]>*/</script>

In v uporabi template.css

.ie6{/*posebej za internet explorer 6*/}
.ielt8{/*posebej za internet explorer 6 in 7*/}
.ie{/*posebej za vse različice internet explorerja */}

Jeziki od desne-proti-levi (RTL(right-to-left)) in poravnave

LimeSurvey-ev urejevalnik besedila je zmožen oblikovati RTL besedilo. Sam urejevalnik kaže RTL jezik v obliki od leve proti desni, kadar je poravnano. To je zgolj stvar prikaza urejevalnika. Od desne proti levi in poravnano vprašanje ali besedilo se bo v vaši anketi ali v predogledu prikazalo pravilno od desne proti levi tudi če je poravnano.

Ključne besede

Ključne besede, ki se nahajajo znotraj datotek predloge, bodo zamenjane s trenutnimi podatki ankete. Obdane so z zavitimi oklepaji, na primer: {SURVEYNAME}

Naslednje nize bo LimeSurvey zamenjal, ko bo razčlenjeval datoteke predloge in rezultate predstavil anketirancem. Ta polja nizov bodo delovala na skoraj vseh straneh predloge razen na 'zaključni strani'. (Večino teh nizov lahko najdemo v datoteki common.php. Če je tam ne najdete, poglejte v datoteko index.php)

Ključna beseda	Datoteke predloge	Opis
{SURVEYNAME}	Vse datoteke	Naslov ankete
{SURVEYDESCRIPTION}	Vse datoteke	Opis ankete
{WELCOME}	Vse datoteke (večinoma za welcome.pstpl)	'Pozdravno' besedilo ankete
{PERCENTCOMPLETE}	survey.pstpl	Majhen graf, ki prikaže procent opravljene ankete
{GROUPNAME}	startgroup.pstpl, groupdescription.pstpl, endgroup.pstpl	Prikaže ime trenutne skupine
{GROUPDESCRIPTION}	startgroup.pstpl, groupdescription.pstpl, endgroup.pstpl	Prikaže opis trenutne skupine
{NUMBEROFQUESTIONS}	welcome.pstpl	Prikaže celotno število vprašanj v anketi (le številko)
{THEREAREXQUESTIONS}	welcome.pstpl	Prikaže stavek "V anketi je X vprašanj" - iz datoteke ustreznega jezika. X je zamenjan s številom vprašanj. Vedite da bo ta del pravilno prikazan za ednino ali množino. Če je v anketi le eno vprašanje, se prikaže napis "V anketi je 1 vprašanje".
{CHECKJAVASCRIPT}	Vse datoteke (večinoma za welcome.pstpl)	Prikaže se opozorilo, kadar ima brskalnik anketiranca izklopljen javascript
{QUESTION}	Question.pstpl	(Je bilo zamenjano s ključnimi besedami {QUESTION_...} od različice LS1.87 naprej) Prikaže besedilo trenutnega vprašanja (oblika {QUESTION} se lahko prilagodi z urejanjem datoteke 'question_start.pstpl'). Namesto {QUESTION} uporabite sledeče: {QUESTION_TEXT}, {QUESTION_MANDATORY}, {QUESTION_HELP}, {QUESTION_MAN_MESSAGE}, {QUESTION_VALID_MESSAGE}, {QUESTION_INPUT_ERROR_CLASS} in ustrezne HTML oznake
{ANSWER}	question.pstpl, print_question.pstpl	Prikaže obrazec za trenutno vprašanje
{SGQ}	question.pstpl, besedilo vprašanja	Lahko se uporabi v samem besedilu vprašanja, da dinamično poveže polje za vnos odgovora na vprašanje s prikazom id-ja vprašanja za trenutno vprašanje.
{QUESTIONHELP}	question.pstpl, print_question.pstpl	Prikaže besedilo pomoči (vnaprej določen tip za vprašanja) za trenutno vprašanje
{QUESTION_CLASS}	question.pstpl, print_question.pstpl	Edinstven razred za vsako vrsto vprašanja. (Da bo vključena pri vprašanju v oznako z zavitim oklepajem.)
{QUESTION_CODE}	question.pstpl, print_question.pstpl	Prikaže kodo trenutnega vprašanja
{QUESTION_ESSENTIALS}	question.pstpl	ID vprašanja in (če je pogojno vprašanje), 'style="display:none;"'. (Da bo pri vprašanju vključena v oznako z zavitim oklepajem.)
{QUESTION_HELP}	question.pstp, question_start.pstpl	Prikaže besedilo pomoči določeno za uporabnika pri trenutnem vprašanju
{QUESTION_TYPE_HELP}	print_question.pstp	Prikaže besedilo pomoči določeno za uporabnika pri trenutnem vprašanju
{QUESTION_INPUT_ERROR_CLASS}	question.pstp, question_start.pstpl	Ponuja razred, če je bila napaka pri vnosu s strani uporabnika
{QUESTION_ID}	print_question.pstp	Ponuja edinstven ID za vsako vprašanje, da se omogoči oblikovanje za specifična vprašanja
{QUESTION_TEXT}	question.pstp, print_question.pstp, question_start.pstpl	Prikaže besedilo za trenutno vprašanje
{QUESTION_MANDATORY}	question.pstp, print_question.pstp, question_start.pstpl	Prikaže prevedeno 'obvezno' besedilo za trenutno vprašanje
{QUESTION_MAN_CLASS}	question.pstpl, print_question.pstpl	Razred, če je vprašanje obvezno. (Da bo pri vprašanju vključena v oznako z zavitim oklepajem.)
{QUESTION_MAN_MESSAGE}	question.pstp, print_question.pstp, question_start.pstpl	Prikaže prevedeno 'obvezno' besedilo za trenutno vprašanje
{QUESTION_NUMBER}	print_question.pstpl	Število vprašanj.
{QUESTION_VALID_MESSAGE}	question.pstp, print_question.pstp, question_start.pstpl	Prikaže prevedeno veljavno besedilo pomoči sporočila za trenutno vprašanje
{QUESTION_SCENARIO}	print_question.pstp	Natisne besedilo v obliki 'scenarija' za pogojna vprašanja.
{NAVIGATOR}	navigator.pstpl	Prikaže navigacijske gumbe (naslednji, prejšnji, zadnji)
{CLEARALL}	Vse datoteke (vendar namenjeno za navigator.pstpl)	Prikaže povezave za "Končaj in počisti rezultate"
{SUBMITBUTTON}	submit.pstpl	Prikaže končni gumb za oddajo
{COMPLETED}	completed.pstpl	Prikaže sporočilo o 'opravljeni' registraciji, ki se spreminja glede na nastavitve polj attribute_1 in attribute_2.
{URL}	completed.pstpl	Prikaže 'url' ankete in 'url besedilo'
{PRIVACY}	submit.pstpl	Prikaže informacije o zasebnosti, kadar je anketa anonimna
{PRIVACYMESSAGE}	privacy.pstpl	Prikaže se sporočilo o zasebnosti, če nastavite anketo na anonimno. Besedilo se lahko ureja/prevede v datotekah jezikov. Lahko se tudi ročno spremeni z urejanjem datoteke privacy.pstpl v predlogi, ki jo želite uporabiti.
{TEMPLATEURL}	Vse datoteke	URL na trenutno mesto predloge (uporabno za sklicujoče datoteke slik v vaši predlogi)
{SUBMITCOMPLETE}	endpage.pstpl	Izjava (iz datotek jezikov), ki uporabniku pove, da je zaključil z anketo in da mora klikniti na gumb "Pošlji"
{SUBMITREVIEW}	survey.pstpl	Izjava (iz datotek jezikov), ki uporabniku pove, da lahko pregleda/spremeni odgovore, ki so jih naredili, s klikom na "<< prejšnja"
{TOKEN:FIRSTNAME}	Vse datoteke	***Če odgovori ankete NISO ANONIMNI - se zamenjajo z imenom uporabnikov iz tabele žetonov
{TOKEN:LASTNAME}	Vse datoteke	***Če odgovori ankete NISO ANONIMNI - se zamenjajo s priimkom iz tabele žetonov***
{TOKEN:EMAIL}	Vse datoteke	***Če odgovori ankete NISO ANONIMNI - se zamenjajo z elektronskim naslovom iz tabele žetonov***
{TOKEN:ATTRIBUTE_1}	All Files	***Če odgovori ankete NISO ANONIMNI - se zamenjajo z atributom 1 iz tabele žetonov***
{TOKEN:ATTRIBUTE_2}	All Files	***Če odgovori ankete NISO ANONIMNI - se zamenjajo z atributom 2 iz tabele žetonov***
{ANSWERSCLEARED}	Zaželjeno v navigator.pstpl	Izjava za "Ponastavljanje odgovorov" iz jezikovne datoteke
{RESTART}	clearall.pstpl	URL za ponovni zagon ankete
{CLOSEWINDOW}	Vse datoteke (Zaželjeno v navigator.pstpl)	URL za izhod iz trenutnega okna
{REGISTERERROR}	register.pstpl	Shows any error messages in the register page (ie: "You must include an email address")
{REGISTERMESSAGE1}	register.pstpl	The statement "You must be registered to complete this survey" from the language files
{REGISTERMESSAGE2}	register.pstpl	Details about registering from the language files
{REGISTERFORM}	register.pstpl	The actual form for registering, will change depending on whether the attribute_1 and attribute_2 fields are set.
{SAVE}	Works suitable on navigator.pstpl	Displays the 'Save your responses so far' button to offer the user to save and come back later to continue the survey. If the Save option is deactivated in the survey properties the tag will not be shown and ignored.
{LANGUAGECHANGER}	survey.pstpl	Displays a switch in multilingual surveys to change the question.

Vnos/Gumbi

Vsaki vrsti "vnosa" v anketi je bilo dano svoje lastno ime razreda. Tako lahko dodate CSS kodo v vašo datoteko "startpage.pstpl" in imate z njo nekaj možnosti vplivanja na prikaz oblike gumbov in vnosov. Ta imena razredov so sledeča:

• submit (Gumbi za oddajo)
• text (Besedilni vnosi - za kratko besedilo, datum in številke)
• answertext (Besedilo odgovorov)
• radio (Radijski gumbi)
• checkbox (Potrditvena polja)
• select (Izbirna polja/Seznam)
• textarea (Večji tekstovni vnosi - za daljše prosto besedilo)
• clearall (Povezava za "Izhod in počisti anketo")
• rank (Oblika prednostnega vprašanja. Ne nastavi barve izbranega polja ali polj za besedilo (to se nastavi z ustreznim razdelkom zgoraj), vendar omogoča menjavo barve ozadja, barva besedila, velikosti itd. za preostala prednostna vprašanja)
• graph (Tabela v obliki slike za "procent opravljene ankete")
• innergraph (Tabela znotraj tabele za prikaz procenta opravljene ankete - ta vsebuje besedilo 0% in 100%. To uporabite za spreminjanje velikosti tega besedila)
• question (Osnovne nastavitve za vsako vprašanje, ki se prikaže znotraj tabele. V splošnem bi morali uporabiti ta razred, da zagotovite enako velike črke in barvo kot ste jo uporabili drugod kot privzeto)
• mandatory  (Obvezna vprašanja)
• input-error (Uporabnik je vnesel napako - v primeru ko uporabnik naredi napako pri obveznem vprašanju ali vprašanju, ki se potrjuje)
• array1 in array2 (Ti obliki se menjata, ko se prikazuje nek razpon odgovorov za vprašanja tipa polja. To vam omogoča, da nastavite menjajočo barvo ozadja za te tipe vprašanj. Array1 se prav tako uporablja za naslovno vrstico v tabeli pri teh tipih vprašanj)
• errormandatory (Nastavljanje barv in oblik pri prikazu sporočila z napako "To vprašanje je obvezno")
• warningjs (Nastavljanje barve in oblike prikazanega sporočila z napako, če ima anketiranec v svojem brskalniku izklopljen javascript)

Obstaja tudi nekaj elementov, ki se jih lahko uporablja z uporabo ID-ja elementa (#ID v CSS):

• surveycontact (Sporočilo o stiku, ki se prikaže na uvodni strani)
• tokenmessage (Uporablja se za sporočila znotraj ankete t.i. sporočilo o napaki, da je seja potekla)

Primer uporabe teh razredov s slogi je moč najti v predlogi "bubblegum", ki jo dobite skupaj z LimeSurvey-em.

Ker lahko urejate vse vidike HTML-ja, ni nobenega razloga za obdajanje vaše predloge z

in nato definiranja css-ja za ta razred novo_ime.

Oblikovanje vrstice o napredovanju

Pred različico 1.87:

Datoteka chart.jpg je preprosta slikovna datoteka s sliko velikosti ene točke, ki se uporablja za ustvarjanje vrstice napredka v tabeli 'PERCENTCOMPLETE'. Če datoteka ne obstaja, bo LimeSurvey uporabil privzeto barvasto sliko 'maroon' v javni mapi. Če želite ustvariti vrstico, ki se ujema z vašo barvno shemo, potem morate shraniti barvo v to datoteko. Ne pozabite biti mora JPEG datoteka, velikosti 1 točka x 1 točka, v želeni barvi.

Različica 1.87 in novejše:

Prikaz vrstice napredka se lahko spreminja s CSS-jem.

Da zamenjate barvo ozadja vrstice napredka, dodajte nekaj podobnega na konec vaše datoteke template.css:

#progress-wrapper .ui-widget-header {
 background-color: #3300FF;
}

Da zamenjate barvo roba vrstice napredka, dodajte nekaj podobnega na konec vaše datoteke template.css:

#progress-wrapper .ui-widget-content,
#progress-wrapper .ui-widget-header {
 border: 1px solid #FF0000;
}

Napredne funkcije, ki so na voljo za razvijalce

Začenši z različico 0.99 je LimeSurvey integriral nekaj dodatkov, narejenih s strani uporabnikov, ki omogočajo nekaj posebnih sprememb. Te zelo napredne funkcije v splošnem zahtevajo spremembe v osnovni kodi LimeSurvey-a in jih je potrebno opraviti zelo previdno, da ne ustvarite varnostne luknje.

Osnovna podpora za vključevanje v CMS

Opustili: ta funkcija ni več na voljo v različicah 2.0 ali kasnejših

Ta bi lahko vključili LimeSurvey v drugi CMS, uporabite naslednje možnosti v datoteki config.php:

// Nastavite $embedded na resnično (true) in določite funkcije glave in noge, če se naj anketa prikaže vgrajena v CMS-ju

$embedded = false;
$embedded_inc = "";               // vključena pot do glave, če obstaja
$embedded_headerfunc = "";        //  COM_siteHeader for geeklog
$embedded_footerfunc = "";        // e.g. COM_siteFooter for geeklog

Nastavite $embedded = true; da omogočite CMS-vgrajevanje. Z uporabo spremenljivke $embedded_inc, lahko vključite svoje datoteke .php.  Z nastavitvijo $embedded_headerfunc ali $embedded_footerfunc lahko kličete funkcije iz vključenih datotek, ki prikažejo ustrezne glave in noge namesto privzetih LimeSurvey-evih.

Podpora za vaše lastne Javascript funkcije

Nekateri uporabniki bodo morda želeli poganjati Javascript na straneh ankete, vendar klicanje checkconditions() v BODY elementu to onemogoča.  To lahko nadomestite z manjšimi JavaScript funkcijami v glavi (HEAD), ki preiščejo obstoj checkconditions() in template_onload() preden kliče posamezno funkcijo.  Na ta način lahko avtor predlogeustvari svojo lastno funkcijo template_onload() v glavi (HEAD), ki zamenjajo privzete.

Version 1.87 and newer:

• Disable XSS filter - in Global settings -> Security, set "Filter HTML for XSS" to No.
• Enter your script in the source of a question or group description.
• There are more details in the workaround section.

Videos on Templates

This video will demonstrate the basic and advanced template functions that are available to all LimeSurvey users. This includes changing the appearance of certain forms and inserting custom graphics. Additionally, it will thoroughly walk you through on how to edit and preview specific page templates, importing/exporting templates, modify appearance of questions in the CSS, customizing survey description page, and completed page.

LimeSurvey training video - template customization

Tips & Tricks

Some language specific element

If you want to have some language specific sentence in a survey, for example a help at end of each page, you can add in a .pstl file a sentence and hidding it for other language. And hidding it in the template.css, we can use the pseudo selector :lang, but for best compatibility, we use some class.

Example for a help sentence at bottom of the page, in french and english, put this on endpage.pstpl:

<div class="fr" lang="fr">Pour de l'aide en direct appelez le 000000</div>
<div class="en" lang="en">For some help, please call 000000</div>

and in template.css

.lang-fr .en{display:none}
.lang-en .fr{display:none}

You can use it to for other sentence in your question before 1.92 ( in 1.92, there are better solutions).

Change the layout of the survey page

When editing a template this template can be assigned to a single survey while the survey list page, which is shown at www.yourdomain.org/limesurveyinstallfolder, lists all your surveys.

To use your current template for this page you have change the according setting at the Global Settings screen; at older versions this change can be done by editing the $defaulttemplate setting at the config file: Copy this setting from config-defaults.php to config.php which overrides config-defaults.php and edit this setting to $defaulttemplate = 'yourtemplatename';

Import/Export of templates: Mac users

Mac users, please note: Mac OSX default archive utility may have problems with zip folders "generated on the fly".

a work around is to unix'es unzip from the command line:

$ unzip template.zip -d template

Archive: template.zip

 inflating: template/startpage

 inflating: ...

or scripts in their mac-compiled counterparts:

http://homepage.mac.com/roger_jolly/software/

Changing your templates traffic light from red to green

If you haven't already, set the admin directory to read/write/execute (777). The files within it, however, may be set to read/execute only (chmod 755).

GO to file directory ie file manager, find templates directory.

1 change permission on eg"vallendar" (or any template of your choice) directory to read 777

2 voila! the red traffic light on "vallendar" is now green.

3 NOTE: to restrict access for safety, when finished editing template files, change all templates files back to what they were eg 644

Replacing the help icon

When a question help text is shown then an help.gif image is used from the default template folder.

You can replace this image by uploading a new help.gif, help.png or help.jpg in your custom template folder. It then will be automatically used instead of the default help icon.

Replacing an existing logo

Note: Before uploading a new logo always delete the old, existing one!

1. To edit the logo go to the „template.css” file which you can find it here:

2. Click the search button to find occurrences of logo related styles.

3. Search for #logo

File:3.PNG

4. Edit the main style file

You will see something similar to:

If you want to change the image just replace logo.gif with another image link. Example: (logo.png or logo.jpg).

If you want change the image size adjust width and height (in pixels) like this:

width:100px; height:100px;

Adding your own logo

1. Find and open the „startpage.pstpl” template file.

2. After the

<body ... >

tag add this line to „startpage.pstpl”:

<img id="page_logo" src="{TEMPLATEURL}logo.png"><br>

3. To add logo go to „template.css”, you can find it here (see in screen):

3.1 Then go to the end of the main „template.css” style file.

3.2 To align the logo add...

If you want the logo to be placed at left side:

#page_logo{
   float:left;
}

If you want the logo to be placed at right side:

#page_logo{
   float:right;
}

If you want to center the logo

#page_logo{
   display: block;
   margin-left: auto;
   margin-right: auto;
}

Use the same template with different logos

If you want to use the same template for all surveys and just want to change the logo for each survey, you can use the {SID} placeholder in the template .pstpl file and thereby refer to different images:

<img src="{TEMPLATEURL}logoImage-{SID}.png">

Remove the default help to all question (hide_tip)

There are 3 solutions to remove the default help:

1. like a hide_tip attribute but for all question and survey.
2. you can remove the {QUESTIONHELP} and is container from the file question.pstl, but it can be a bad idea for screenreader.
3. for the default template and some other, add this at the end of tempate.css

span.questionhelp{display:none;}

Display custom favicon

A favicon is the little icon you see in the browser's address bar, list of bookmarks or tab. You can display your own icon as follows:

1. Create a favicon - google will find you lots of free favicon generators
2. Name your new favicon "favicon.ico" and place it in your template directory
3. Add the following code to your startpage.pstpl before the </head> tag

<link rel="shortcut icon" href="{TEMPLATEURL}favicon.ico" type="image/x-icon">
<link rel="icon" href="{TEMPLATEURL}favicon.ico" type="image/x-icon">

Different appearance for survey-/question-pages

(Version 1.91 and newer)

If you want LimeSurvey to change the appearance of every second page (i.e. of even and odd survey pages) you can use .page-odd class in your css file to change the appearance of odd pages.

example from default template of LimeSurvey 1.91+

.page-odd table.question-group {
 background-color: #D2F2D3;
}

To not differentiate even and odd pages at the (default) template find all instances of .page-odd in template.css and remove those styles.

Create a vertical separator  border for dual scale array

To create a vertical separator border for a dual scale array you can add the following lines to your template.css-file.

table.question thead td.header_separator,
table.question tbody td.dual_scale_separator
{
   border-right:solid 1px #00A8E1;
}

header_separator is used to adress the separator for the header "td" and "dual_scale_separator" is used to adress the separator column in the dual scale array.

Hide the survey contact message shown on the start page/survey list

To hide the "Please contact ..." message on the start page (with the survey list) you can add the following to the $(document).ready function in the template.js of your used design template:

$('#surveycontact').hide(); //Hides the survey contact message

Remove the survey contact message shown on error messages

If you want to remove the survey contact message from error messages it'll be trickier. You can add the following function call to the $(document).ready function in the template.css of your used design template:

removeContactAdressFromMessage(); //Removes the survey contact message from error messages

and add the following function to your *template.js* file

function removeContactAdressFromMessage()
{
if ($('#tokenmessage').length > 0)
   {
   var oldMessage = $('#tokenmessage').html();
   var indexContact = oldMessage.indexOf('Bitte kontaktieren');
   var newMessage = oldMessage.substr(0, indexContact);
   $('#tokenmessage').html(newMessage);
   }
}

It will probably not work for an englisch survey and have to be extended when using for multilingual surveys. But it's an idea/tip how to solve this.

How to deal with multilingual question attributes (before version 2.0 at which those were added)

If you have a multilingual survey and e. g. want to use a different string for the "other" field, this could only be done for the base language (until this feature was added at LimeSurvey 2.0). To work around this, paste in the field to change the label for "other"

<span class="en">New label</span><span class="fr">Nouveau label</span>

At the template.css of your template (at /limesurvey/upload/templates/<yourtemplatename>/template.css) add:

html:lang(en) .fr{display:none}
html:lang(fr) .en{display:none}