Actions

Theme editor/it: Difference between revisions

From LimeSurvey Manual

(Created page with "La modalità preferibile per creare un nuovo template è di utilizzare i "Templete Editor" all'interno del menù di amministrazione. Alcuni preferiscono lavorare direttamente ...")
No edit summary
 
(215 intermediate revisions by 4 users not shown)
Line 1: Line 1:
<languages />  
<languages />  
=Introduzione=
==Introduzione==


LimeSurvey has a basic template and style system providing a theme-like capability found in many browser-based applications.  They are simply termed '''Templates''' here.  The Templates allow control over the look and feel of pages during a survey.  A survey administrator can select the template to use for each survey to thus personalize that survey's look and feel.  Changes to a Template can be as simple as adding a unique logo on the welcome page, changing background colors, or maybe new text colors for specific types of questions.
LimeSurvey ha un sistema avanzato di temi e stili che fornisce agli sviluppatori un modo efficiente per personalizzare l'aspetto del sondaggio. Da LS3, il termine '''"modelli"''' è stato sostituito con il termine '''"temi"'''. '''I temi''' permettono di controllare lo stile delle pagine di un sondaggio. Un amministratore del sondaggio può selezionare un tema predefinito che verrà utilizzato per ogni sondaggio per personalizzarlo ulteriormente. '''Temi''' viene fornito con opzioni che forniscono a un amministratore senza abilità di codifica un modo semplice per aggiungere un logo sulla pagina di benvenuto, cambiare i colori di sfondo, selezionare un carattere, ecc.


LimeSurvey comes with a set of templates right out of the box. These initial templates are defined by directories within the LimeSurvey installation "templates" directory.  Each template has it's own directory.  Within the main directory of a template are numerous files: '''templates (.pstpl)''', '''cascading style sheets (.css)''', '''images''' ('''.jpg''' or '''.png''') and maybe others.


Like in other theme-based systems, fragments of HTML code are stored in the .pstpl template files.  These fragments are read in and used to construct the page to display to the end user during the operation of a survey. Often '''keywords''' surrounded by curly braces are included in the files that are then replaced with the relevant text.  The following gives an example of a template file content and its result when used in a survey page:
LimeSurvey viene fornito con 3 temi. Questi temi iniziali sono definiti dalle directory che si trovano nella directory "themes/survey/" dell'installazione di LimeSurvey. Ogni tema ha la sua directory. All'interno della directory principale di un tema troverai un file di configurazione in XML e numerose directory contenenti le viste '''temi (.twig)''', '''fogli di stile a cascata (.css)''', '' 'scripts''', '''images''' ('''.jpg''' o '''.png''') e forse altri.  


<syntaxhighlight lang="html4strict" enclose="div"><center><font face='verdana' color='red'>{SURVEYNAME}</font><br />
 
<font face='verdana' color='blue'><u>{SURVEYDESCRIPTION}</u></center>
A partire da LimeSurvey 2.50, il motore del tema utilizza [http://getbootstrap.com/docs/3.3/ Bootstrap 3] come framework CSS. Poiché Bootstrap 3 è un framework standard, gli sviluppatori troveranno molta documentazione, tutorial e thread di forum su Internet.
 
 
A partire da LimeSurvey 3, il motore del tema utilizza [https://twig.symfony.com Twig], quindi gli sviluppatori del tema possono cambiare la logica del rendering del sondaggio in modo facile e sicuro. Twig sostituisce il vecchio sistema di parole chiave sostitutive utilizzato nelle versioni precedenti. La logica che è stata utilizzata per generare l'HTML delle parole chiave è ora disponibile all'interno delle viste del tema.
 
 
Frammento dal tema vaniglia:
 
<syntaxhighlight lang="twig">
<div class="{{ aSurveyInfo.class.answercontainer }} col-xs-12" {{ aSurveyInfo.attr.answercontainer }}>  
{# NOTA: se desideri personalizzare il rendering della domanda, utilizza un tema di domanda #}
{{ aDomanda.risposta | grezzo }}
</div>  
</syntaxhighlight>
</syntaxhighlight>


One gets a result that looks like:
I temi, essendo codice HTML e Twig, tendono a definire il posizionamento e il tipo di testo da visualizzare e simili caratteristiche strutturali della pagina. Spesso fanno riferimento o includono altri file. La maggior parte di essi fa riferimento a un comune file di fogli di stile a cascata (CSS) che definisce lo stile del carattere, il colore, la dimensione, lo sfondo e parametri simili comuni a tutte le pagine del sondaggio. I fogli di stile fanno riferimento a parametri HTML '''class''' che sono associati ai vari tipi di oggetti nel codice HTML. Ciò consente al foglio di stile di definire come visualizzare ciascuno dei molti tipi di testo o altri oggetti che possono apparire in più punti. Ci sono classi uniche per ogni tipo di domanda in LimeSurvey e quindi danno un controllo dettagliato sull'aspetto di ciascuna. Anche i file di immagine, come loghi o speciali costruttori di barre di avanzamento, possono essere referenziati nel file del tema. Infine, le parole chiave speciali tra parentesi graffe vengono sostituite con il testo definito nel sondaggio per ogni corrispondente di traduzione della lingua (ad esempio, il "Titolo del sondaggio" o il "Testo della domanda" per ciascuna lingua definita).
 
Se crei un nuovo modello personalizzato, ti preghiamo di pensare a contribuire aggiungendolo alla community LimeSurvey rendendolo disponibile anche agli altri. Con il tuo aiuto, possiamo far crescere la nostra collezione di template, indagini ed altri componendi aggiuntivi, per rendere LimeSurvey sempre migliore!
Visita la nostra [https://www.limesurvey.org/index.php?option=com_sobipro&sid=55:Templates&Itemid=729 LimeSurvey template repository], dove puoi condividere i tuoi modelli.
 
==Creazione di un nuovo tema==
 
Per creare un nuovo template (o modificarne uno esistente) è necessario possederne la relativa l'autorizzazione come utente in LimeSurvey, così come l'autorizzazione per la manipolazione dei file contenuti nel sistema operativo dell'hosting in cui è installato LimeSurvey.


<div class="simplebox"><center>'''<span style='color:red'>My New Survey</span>'''</center>
<div class="simplebox"><span style='color:red'>'''Nota di avvertimento:'''</span> Se cambi tema, potresti anche influenzare tutti i sondaggi preesistenti dalla tua installazione di LimeSurvey. I temi sono una funzionalità avanzata che richiede esperienza e conoscenza dell'HTML.</div>
<center><u><span style='color:#0000ff'>This is a survey written by me to find out what sort of chocolate people like.</span></u></center></div>


Templates, being HTML code, tend to define the positioning and type of text to be displayed and similar structural features of the page.  They often reference or include other files.  Most reference a common cascading style sheets (CSS) file that defines the font style, color, size, background and similar parameters common to all pages in the survey. Style sheets reference HTML '''class''' parameters that are associated with the various types of objects in the HTML code.  This allows the style sheet to describe once how to display each of the many types of text or other objects that may appear in multiple places.  There are unique classes for each question type in LimeSurvey and thus giving detailed control over the appearance of each.  Image files, like logos or special progress-bar constructors, may be referenced as well in the Template file.  Finally, special Keywords in curly braces are replaced with text defined in the Survey for each of its corresponding language translations (for example, the Survey Title or Question Text for each language defined).
La modalità preferibile per creare un nuovo template è di utilizzare i "Templete Editor" all'interno del menù di amministrazione. Alcuni preferiscono lavorare direttamente all'interno dei files template, utilizzando così il proprio editor di testo preferito invece dell'interfaccia web. In questo caso, utilizza comunque prima l'editore di modelli per creare tuo template. Questo creerà un nuovo modello di base con tutti i file di cui hai bisogno nella cartella LimeSurvey_web_root/upload/templates/your_new_template. Da qui puoi usare il tuo editor di testo per aggiustare manualmente i file del modello.


If you create a new custom template, please consider contributing it back to the LimeSurvey community, and make it available to others. With your help, we can grow our repository of templates, surveys, and other ad-ons, to make LimeSurvey even better! See the shared [http://www.limesurvey.org/en/download-limesurvey-design-templates/com_josetta_menu_control_panel/viewcategory/9-survey-design-templates Template Repository]
<div class="simplebox">'''Nota sui permessi:''' sui sistemi unix/linux, questi file dei temi saranno di proprietà del gruppo e dell'utente su cui è in esecuzione il server Web (potrebbe essere "www" per alcuni sistemi). Quindi, assicurati di avere le autorizzazioni appropriate per modificare questi file, quando li salvi, assicurati che non cambino proprietà! In questo modo, puoi comunque utilizzare l'interfaccia Web di modifica del tema, se necessario.</div><br />


=Creazione di un nuovo template=
Un certo numero di elementi 'pubblici' possono essere modificati da una serie di modelli. La prossima sezione fornisce una breve spiegazione di questi template.


Per creare un nuovo template (o modificarne uno esistente) è necessario possederne la relativa l'autorizzazione come utente in LimeSurvey.
{{Nota|I file dei temi sono una caratteristica complessa. Oltre all'HTML, dovresti avere familiarità anche con CSS, Twig e JavaScript.}}


<div class="simplebox">'''Note of Warning:''' As template changes can affect all surveys in an installation, changes should be limited to those skilled in understanding general concepts in the code base. Templates are an advanced feature that can take some experimentation to get correct if you are not familiar with HTML code methods.</div>
=L'editori di modelli di LimeSurvey=


La modalità preferibile per creare un nuovo template è di utilizzare i "Templete Editor" all'interno del menù di amministrazione. Alcuni preferiscono lavorare direttamente all'interno dei files template, utilizzando così il proprio editor di testo preferito invece dell'interfaccia web.
'''Editor dei temi''': '''Configurazione''' > '''Temi'''> '''Editor dei temi'''
L'Editor dei temi è disponibile solo per gli utenti [[Manage users#Set permessi globali per un utente|con il permesso Modelli]] e ai superamministratori.  


<div class="simplebox">'''Permissions Note:''' on unix/linux systems, these template files will be owned by the group and user who the web server is running as (may be "www" for some systems). So make sure you have access to edit these files, and when you save them make sure they don't change ownership, so you can still use the web Template Editing interface if needed</div><br />


<div class="simplebox">'''Installation Note:''' If you create your ZIP-file on OS X it will generate also an folder _MACOSX it will create some problems on template installation. For prevent these problems use the application zipcleaner on OS X to clean the _MACOSX folder from the zip-file. You can download it here: https://www.macupdate.com/app/mac/25497/zipcleaner</div><br/>
{{Alert|title=Attenzione|text=Un tema che non è costruito correttamente può rendere inutilizzabile un sondaggio (che utilizza il rispettivo modello). }}


<div class="simplebox">'''Installation Note:''' If you have downloaded your template from Github open it before install and move the files out of the containing folder and create a new zip-file. The wrapped folder creates problems on template installation.</div>


Template files may seem complex to understand at first. You have to likely understand HTML code, possibly Styles and Style Sheets, and have access to the underlying LimeSurvey installation files if the template files and directories are not editable. Copy an existing template to a new directory to play around with the content. This may help make the concept clearer.
L'editor di temi di LimeSurvey ti consente di modificare i contenuti dei tuoi temi online. Per avviare l'editor dei temi: fai clic su '''Temi''' nel menu '''Configurazione''', quindi fai clic sul pulsante '''Editor dei temi''' accanto al tema che desideri modificare o estendere.  


A number of the 'public' elements of LimeSurvey can be adjusted by a series of templates. This section provides a very brief explanation of these templates.


=The LimeSurvey Template Editor=
[[File:templates.png]]


To ease the understanding and quick update of a Template, LimeSurvey provides a '''Template Editor''' in the main '''administrative''' toolbar of the application.  This Template Editor is only available to users given the privilege in the User Security settings.  A template effects all surveys and can render a survey inoperable if not constructed properly.  So Template editing is thought best restricted to a very limited, knowledgeable set of users.  Having permission to enter the Template Editor is not enough though.


La schermata principale è simile a quella di amministrazione di un'indagine. Essa permette di selezionare il modello da modificare/visualizzare. Dopo averlo selezionato, puoi scegliere una tra le differenti pagine delle indagini pubbliche. Comparirà una lista dei file del template che costituiscono quella particolare pagina.


The LimeSurvey Template Editor allows you to edit the contents of your templates online. Start the Template Editor by clicking on the "Template Editor" icon [[File:templates.png]] in the LimeSurvey Administration toolbar (Templates). The main screen is similar to the LimeSurvey Survey Administration screen. It allows you to select the template to edit/view. Once this has been selected you can then select from one of the different public survey pages. You are then presented with a list of the template files that make up that particular page.


[[File:Template-editor-2013-7-10_11_38_16.png|center]]
[[File:Template-editor-2013-7-10_11_38_16.png|center]]


==The Template Menu==


*'''Edit Icon:''' The "edit" icon indicates whether or not the template is editable. A blurred out icon indicates that the template is read only; a clickable icon indicates you may make modifications. To change the icon from blurred to clear, you have to modify the template's permissions.
Sono disponibili le seguenti opzioni:
*'''Import Template:''' Allows you to import a template.
 
*'''Export Template:''' Allows you to export the current template to a .zip-File.
*'''Copy Template:''' Allows you to make a new template by copying the current one.
*'''Rename this template:''' Allows you to change the name of the template.  Generally used after copying an existing template or importing a template by manipulating the underlying directories.


The "Screen" drop-down list on the right allows you to choose which particular survey page you are currently looking at.
*'''Crea''': Ti permette di creare un nuovo modello. Per non ripartire da zero, viene copiato il template 'default'.
*'''Importa''': Permette di importare un template da un file ZIP.
*'''Esporta''' : Consente di esportare il modello corrente in un file ZIP.
*'''Copia''': Consente di creare un nuovo modello copiando quello corrente.
*'''Rinomina''': Consente di modificare il nome del modello. Viene generalmente utilizzato dopo aver copiato o importato un modello.
*'''Template''': un elenco a discesa che mostra tutti i modelli disponibili che si trovano nell'installazione di LimeSurvey.


==Import/Export/Copy a Template==
*'''Schermata''': un elenco a tendina che ti permette di scegliere quale particolare pagina del sondaggio di quel modello desideri visualizzare.
*'''Torna al pannello di amministrazione'''.


When you '''export '''a template, this will create a zip-file archive with all the files your template consists of (.pstpl files, images, css files, ...). You can simply '''import '''the exported zip-file at other LimeSurvey systems by using the import feature or you can manually copy the archive to another installation and extract it into the corresponding template directory there. If you copy the template in the same installation, you will need to rename the folder to create another named copy of that template.
===Importa/Esporta/Copia un modello===


If the file and directory permissions are open for the LimeSurvey application to write, then you can use the programs '''copy '''and rename features to make a local copy of a template.
Quando '''esporti '''un modello, verrà creato un archivio ZIP con tutti i tuoi file modello (file .pstpl, immagini, file css, ...). Puoi '''importare''' il file zip esportato in un'altra installazione di LimeSurvey utilizzando la funzione di importazione oppure puoi copiare manualmente l'archivio in un'altra installazione di LimeSurvey ed estrarlo nel corrispondente [[Theme editor#Template files location|template directory lì]].  


==Page Structure / Template Use==
Tuttavia, è meglio utilizzare le funzioni di importazione/esportazione/copia dei modelli di LimeSurvey nell'editor dei modelli.
*'''The Welcome Page:''' startpage.pstpl, welcome.pstpl, privacy.pstpl,  navigator.pstpl, endpage.pstpl
*'''The Questions Pages:''' startpage.pstpl, survey.pstpl, startgroup.pstpl, groupdescription.pstpl, question.pstpl, endgroup.pstpl
*'''The Final Page:''' startpage.pstpl, assessment.pstpl, completed.pstpl, endpage.pstpl


==Template Files==
===Struttura della pagina / Utilizzo del modello===
*'''La pagina di benvenuto:''' startpage.pstpl, welcome.pstpl, privacy.pstpl, navigator.pstpl, endpage.pstpl
*'' 'Le pagine delle domande:''' startpage.pstpl, survey.pstpl, startgroup.pstpl, groupdescription.pstpl, question.pstpl, endgroup.pstpl, endpage.pstpl
*'''The Final Page:''' startpage .pstpl, valutazione.pstpl, completato.pstpl, fine pagina.pstpl


The following template files are used to produce your public survey and must exist in any new template folder you create:
===File modello===
*'''startpage.pstpl:''' Produces the start of each html page. It starts at the "<head>" tag, and should not contain the "<html>" tag. This 'very beginning' of a standard html page is written by the scripts. Please ensure that your startpage.pstpl files contains a <body> tag, even though many browsers do not require strict adherence to the W3 HTML standards, the LimeSurvey script needs to find a <body> tag, to run certain javascript elements. It is not expected that many 'keywords' will be used in the startpage.pstpl file, however you may wish to put the {SURVEYNAME} into the title. The startpage.pstpl file can contain code that ends in the corresponding endpage.pstpl file, so you can start a table in this file and close the table in the endpage.pstpl file. The startpage.pstpl and endpage.pstpl files wrap around every possible page used by LimeSurvey.
*'''survey.pstpl:''' This template is the second used on most pages, and provides a space to put the survey name and description. This template does not have a corresponding 'closing' template, and subsequently you should close all tags opened in this template file (ie: don't leave a table open here because there is nowhere else to close it)
*'''welcome.pstpl:''' This template is only used in the welcome screen (which is also on the main page for 'all in one' surveys). You can use this to print out the welcome text, and other information that should be provided in the introduction. Like the 'survey.pstpl' file, there is no corresponding 'closing' template, so all tags opened in this template file should be closed as well.
*'''startgroup.pstpl:''' This template can provide a 'summary' wrap around for questions within a group. It has a matching 'endgroup.pstpl' template that can be used to close any opened tags in this file, so you can open a table within this.
*'''groupdescription.pstpl:''' This template file is used to display a description of a group. It is separate to the startgroup.pstpl file because in a "question by question" survey it will be displayed on its own unique page in between groups, whereas in a "group by group" or "all in one" survey it provides a header to the subsequent questions. groupdescription.pstpl does not have a corresponding 'closing' template file, so all tags should be closed.
*'''question.pstpl:''' This file contains the question, answer and help text sections of your survey, and in the "group by group" and "all in one" surveys this template is cycled repeatedly with each question. There is no corresponding closing file for this and all tags should be closed.
*'''question_start.pstpl:''' This file contains the individual elements found at the start of a question. It is included within 'question.pstpl' via the {QUESTION} keyword. It is intended to allow template designers more control over the layout of a question. This template sits outside the normal templating system and '''was superseeded (as of LS1.87)'''. All keywords from this template are now available directly in question.pstpl. NOTE: templates using question_start.pstpl will still work at least for a couple more versions of LS 1.x
*'''completed.pstpl:''' This page is displayed as the final page when the survey responses have been saved and the survey is over. It can be used to display a "forwarding link" as set in the survey setup.
*'''endgroup.pstpl:''' This file closes the group, and can be used to close off any tags opened in the startgroup.pstpl file
*'''navigator.pstpl:''' This file contains the buttons that navigate through the survey, "next", "prev", "last", "submit", "save so far"  and the "clear all" link. It is used in all pages except the completed page.
*'''printanswers.pstpl:''' This file has the HTML wrapper for the print version of the survey.
*'''print_group.pstpl:''' This file is the same as startgroup.pstpl endgroup.pstpl but for the print version of the survey.
*'''print_question.pstpl:''' This file is the same as question.pstpl but for the print version of the survey.
*'''print_survey.pstpl:''' This file is the same as survey.pstpl but for the print version of the survey.


== CSS and Javascript==
I seguenti file modello sono usati per produrre il tuo sondaggio pubblico e devono esistere in ogni nuova cartella modello che crei:
*'''startpage.pstpl:''' Produce l'inizio di ogni pagina html. Si inizia al "<head> " tag e non deve contenere il "<html> " tag. Questo 'vero inizio' di una pagina html standard è scritto dagli script. Assicurati che i tuoi file startpage.pstpl contengano un<body> etichetta. Anche se molti browser non richiedono una stretta aderenza agli standard HTML W3, lo script LimeSurvey deve trovare un tag per eseguire determinati elementi javascript. Non è comune vedere molte "parole chiave" utilizzate nel file startpage.pstpl. Tuttavia, potresti voler inserire {SURVEYNAME} nel titolo. Il file startpage.pstpl può contenere codice che termina nel file endpage.pstpl corrispondente. Ad esempio, puoi iniziare una tabella in questo file e chiuderla nel file endpage.pstpl. I file startpage.pstpl e endpage.pstpl avvolgono ogni possibile pagina utilizzata da LimeSurvey.
*'''survey.pstpl:''' Questo modello è il secondo utilizzato nella maggior parte delle pagine e fornisce uno spazio per inserire il nome del sondaggio e descrizione. Questo modello non ha un corrispondente modello di 'chiusura', e successivamente dovresti chiudere tutti i tag aperti in questo file modello (es.: non lasciare una tabella aperta qui perché non c'è nessun altro posto dove chiuderla).
*' ''welcome.pstpl:''' Questo modello viene utilizzato solo nella schermata di benvenuto (che si trova anche nella pagina principale per i sondaggi "tutto in uno"). Puoi usarlo per stampare il testo di benvenuto e altre informazioni che dovrebbero essere fornite nell'introduzione. Come il file 'survey.pstpl', non esiste un modello di 'chiusura' corrispondente, quindi anche tutti i tag aperti in questo file modello dovrebbero essere chiusi.
*'''startgroup.pstpl:''' Questo modello può fornire un "riassunto" per le domande all'interno di un gruppo. Ha un modello 'endgroup.pstpl' corrispondente che può essere utilizzato per chiudere tutti i tag aperti in questo file, quindi puoi aprire una tabella all'interno di questo.
*'''groupdescription.pstpl:''' Questo file modello è utilizzato per visualizzare una descrizione di un gruppo. Tieni presente che nelle impostazioni del sondaggio (accedi alle ''Impostazioni di presentazione e navigazione'' facendo clic sulla scheda '''Presentazione''') puoi impostare se la descrizione del gruppo deve essere mostrata o meno. In caso contrario, questo file non è affatto incluso.
*'''question.pstpl:''' Questo file contiene le sezioni di domanda, risposta e testo di aiuto della tua indagine. Nei sondaggi "gruppo per gruppo" e "tutto in uno", questo modello viene ripetuto ripetutamente con ogni domanda. Non esiste un file di chiusura corrispondente per questo e tutti i tag dovrebbero essere chiusi.
*'''question_start.pstpl:''' Questo file contiene i singoli elementi trovati all'inizio di una domanda. È incluso in 'question.pstpl' tramite la parola chiave {QUESTION}. Ha lo scopo di consentire ai progettisti di modelli un maggiore controllo sul layout di una domanda. Questo template si trova al di fuori del normale sistema di template e '''è stato sostituito (a partire da LimeSurvey 1.87)'''. Tutte le parole chiave di questo modello sono ora disponibili direttamente in question.pstpl.
*'''completed.pstpl:''' Questa pagina viene visualizzata come pagina finale quando le risposte al sondaggio sono state salvate e il sondaggio è terminato. Può essere utilizzato per visualizzare un "link di inoltro" come impostato nella configurazione del sondaggio.
*'''endgroup.pstpl:''' Questo file chiude il gruppo e può essere utilizzato per chiudere eventuali tag aperti nel file startgroup.pstpl
*'''navigator.pstpl:''' Questo file contiene i pulsanti che consentono di navigare nel sondaggio, "successivo", "precedente", "ultimo", "invia", "salva finora" e il link "cancella tutto". Viene utilizzato in tutte le pagine tranne la pagina completata.
*'''printanswers.pstpl:''' Questo file ha il wrapper HTML necessario per la versione stampata del sondaggio.
*'''print_group.pstpl :''' Questo file è lo stesso di startgroup.pstpl e endgroup.pstpl, ma per la versione stampata del sondaggio.
*'''print_question.pstpl:''' Questo file è lo stesso di question.pstpl , ma per la versione stampata del sondaggio.
*'''print_survey.pstpl:''' Questo file è uguale a survey.pstpl, ma per la versione stampata del sondaggio.


Two files are allways used for template : template.css for css and template.js for javascript.
=== CSS e Javascript===
*'''{TEMPLATECSS}:''' Add lines for default css, template.css and template-rtl.css for rtl language.
*'''{TEMPLATEJS}:''' Add lines for default javascript files, template.js and all js files needed for LimeSurvey.


=== Replacing default css or javascript===
Due sono i file che sono sempre utilizzati nei modelli: template.css per CSS e template.js per JavaScript.
*'''{TEMPLATECSS}''': aggiunge linee per il fil css di default, template.css, e per il linguaggio rtl, template-rtl.css.
*'''{TEMPLATEJS}''': aggiunge i file di default di javascript, template.js e tutti gli altri file js di cui LimeSurvey ha bisogno.


Some question use specific files for javascript or css. If you need to replace a function, you add to use cascading system. For javascript function, last function read is the function used.
===Utilizzare Bootstrap===
LimeSurvey integra Bootstrap 3, quindi poi creare tutti i tuoi modelli con le ben documentate classi Bootstrap.
Per maggiori informazioni si faccia riferimento alla [http://getbootstrap.com documentazione Bootstrap].


==Other Template Files==
Un altro plugin incluso è [https://github.com/flatlogic/awesome-bootstrap-checkbox Awesome-Bootstrap-Checkbox].
Con questo puoi utilizzare le color-classes di Bootstrap (info, warning, danger, etc.) anche con il suffisso "-checkbox" o "-radio", definendo come preferisci checkbox e radio.


The '''privacy.pstpl''', '''invitationemail.pstpl''', '''reminderemail.pstpl''' and '''confirmationemail.pstpl''' are no longer used by LimeSurvey and defaults are instead set in the applicable language files. The email messages can now be edited on a survey by survey basis.
==== Sostituzione CSS o Javascript predefinito====


==Standard Pages==
Alcune domande utilizzano file specifici per Javascript o CSS. Se è necessario sostituire una funzione, utilizzare un sistema a cascata. Per la funzione javascript, l'ultima funzione letta è la funzione utilizzata.


There are ten standard pages that a survey participant may see in the course of taking or accessing the LimeSurvey application. Each is constructed from a number of common '''Template''' files from the '''Template''' specified in the survey's settings. The table below indicates which template files are used in constructing each of these pages.
===Altri file modello===
 
'''privacy.pstpl''', '''invitationemail.pstpl''', '''reminderemail.pstpl''' e '''confirmationemail.pstpl''' non sono più utilizzati da LimeSurvey e le impostazioni predefinite sono invece impostate nei file di lingua applicabili. I messaggi e-mail possono ora essere modificati sondaggio per sondaggio.
 
===Pagine standard===
 
Ci sono dieci pagine standard che un partecipante al sondaggio può vedere durante l'utilizzo o l'accesso all'applicazione LimeSurvey. Ciascuno è costruito da un numero di file '''Template''' comuni dal '''Template''' specificato nelle impostazioni del sondaggio. La tabella seguente indica quali file modello vengono utilizzati nella costruzione di ciascuna di queste pagine.


{| class="wikitable"
{| class="wikitable"
! '''Survey Pages:'''<br />'''Template Files'''!!Survey<br />List!!Welcome!!Question!!Completed!!Clear All!!Register!!Load!!Save!!Print<br />Answers!!Print<br />Survey
! '''Pagine sondaggio/'''<br /> '''File modello'''!!Sondaggio<br /> Elenco!!Benvenuto!!Domanda!!Completato!!Cancella tutto!!Registrati!!Carica!!Salva!!Stampa<br /> Risposte!!Stampa<br /> Survey
|-
|-
|SurveyList||align="center" | [[File:check.gif]]|| || || || || || || || ||
|SurveyList||align="center" | [[File:check.gif]]|| || || || || || || || ||
|-
|-
|Welcome|| ||align="center" | [[File:check.gif]]|| || || || || || || ||
|Benvenuti|| ||align="centro" | [[File:check.gif]]|| || || || || || || ||
|-
|-
|Privacy|| ||align="center" | [[File:check.gif]]|| || || || || || || ||
|Privacy|| ||align="centro" | [[File:check.gif]]|| || || || || || || ||
|-
|-
|Navigator|| ||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]|| || || || || || ||
|Navigatore|| ||align="centro" | [[File:check.gif]]||align="center" | [[File:check.gif]]|| || || || || || ||
|-
|-
|Survey|| || ||align="center" | [[File:check.gif]]|| || ||align="center" | [[File:check.gif]]|| || || ||
|Sondaggio|| || ||align="centro" | [[File:check.gif]]|| || ||align="centro" | [[File:check.gif]]|| || || ||
|-
|-
|StartGroup|| || ||align="center" | [[File:check.gif]]|| || || || || || ||
|InizioGruppo|| || ||align="centro" | [[File:check.gif]]|| || || || || || ||
|-
|-
|GroupDescription|| || ||align="center" | [[File:check.gif]]|| || || || || || ||
|Descrizionegruppo|| || ||align="centro" | [[File:check.gif]]|| || || || || || ||
|-
|-
|Question<span style='color:red'>'''*'''</span>|| || ||align="center" | [[File:check.gif]]|| || || || || || ||
|Domanda <span style='color:red'>'''*'''</span> || || ||align="centro" | [[File:check.gif]]|| || || || || || ||
|-
|-
|EndGroup|| || ||align="center" | [[File:check.gif]]|| || || || || || ||
|FineGruppo|| || ||align="centro" | [[File:check.gif]]|| || || || || || ||
|-
|-
|Assessment|| || || ||align="center" | [[File:check.gif]]|| || || || || ||
|Valutazione|| || || ||align="centro" | [[File:check.gif]]|| || || || || ||
|-
|-
|Completed|| || || ||align="center" | [[File:check.gif]]|| || || || || ||
|Completato|| || || ||align="centro" | [[File:check.gif]]|| || || || || ||
|-
|-
|ClearAll|| || || || ||align="center" | [[File:check.gif]]|| || || || ||
|CancellaTutto|| || || || ||align="centro" | [[File:check.gif]]|| || || || ||
|-
|-
|Register|| || || || || ||align="center" | [[File:check.gif]]|| || || ||
|Registrati|| || || || || ||align="centro" | [[File:check.gif]]|| || || ||
|-
|-
|Load|| || || || || || ||align="center" | [[File:check.gif]]|| || ||
|Carica|| || || || || || ||align="centro" | [[File:check.gif]]|| || ||
|-
|-
|Save|| || || || || || || ||align="center" | [[File:check.gif]]|| ||
|Salva|| || || || || || || ||align="centro" | [[File:check.gif]]|| ||
|-
|-
|PrintAnswers|| || || || || || || || ||align="center" | [[File:check.gif]]||
|StampaRisposte|| || || || || || || || ||align="centro" | [[File:check.gif]]||
|-
|-
|Print Survey || || || || || || || || || ||align="center" | [[File:check.gif]]
|Stampa sondaggio || || || || || || || || || ||align="centro" | [[File:check.gif]]
|-
|-
|Print Group || || || || || || || || || ||align="center" | [[File:check.gif]]
|Stampa gruppo || || || || || || || || || ||align="centro" | [[File:check.gif]]
|-
|-
|Print Question || || || || || || || || || ||align="center" | [[File:check.gif]]
|Stampa Domanda || || || || || || || || || ||align="centro" | [[File:check.gif]]
|-
|-
|StartPage<br />EndPage<br />Template.css||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||  
|Pagina iniziale<br /> FinePagina<br /> Template.css||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||align="center" | [[File:check.gif]]||  
|}
|}


<span style='color:red'>'''*'''</span>NOTE: In versions 1.90 and up this replaces question.pstpl AND question_start.pstpl. If you are using an old custom template, you need to add the following line to the beginning of question.pstpl:<syntaxhighlight lang="php" enclose="div"><div {QUESTION_ESSENTIALS} class="{QUESTION_CLASS}{QUESTION_MAN_CLASS}{QUESTION_INPUT_ERROR_CLASS}"></syntaxhighlight>And then add the corresponding closing tag to the end of question.pstpl:<syntaxhighlight lang="php" enclose="div"></div></syntaxhighlight>
<span style='color:red'>'''*'''</span> NOTA: Nella versione 1.90+, questo sostituisce question.pstpl E question_start.pstpl. Se stai utilizzando un vecchio modello personalizzato, devi aggiungere la seguente riga all'inizio di question.pstpl: <syntaxhighlight lang="php"><div {QUESTION_ESSENTIALS} class="{QUESTION_CLASS}{QUESTION_MAN_CLASS}{QUESTION_INPUT_ERROR_CLASS}"></syntaxhighlight> E poi aggiungi il tag di chiusura corrispondente alla fine di question.pstpl:<syntaxhighlight lang="php"></div></syntaxhighlight>


<span style='color:red'>'''*'''</span>NOTE: In version 1.91 and earlier, LimeSurvey js files are not included by the template. In version 2, '''you have to use {TEMPLATEJS} in your one of your template file''' to add the link to the js file. You can add it in startpage.pstpl or in endpage.pstpl. You can remove the {TEMPLATEURL}/template.js line and you have to replace with {TEMPLATEJS} to update a personal template.
<span style='color:red'>'''*'''</span> NOTA: nella versione 1.91 e precedenti, i file LimeSurvey js non sono inclusi nel modello. Nella versione 2, '''devi usare {TEMPLATEJS} in uno dei tuoi file template''' per aggiungere il link al file js. Puoi aggiungerlo in startpage.pstpl o in endpage.pstpl. Puoi rimuovere la riga {TEMPLATEURL}/template.js e sostituirla con {TEMPLATEJS} per aggiornare un modello personale.


==The File Control Section==
===La sezione di controllo dei file===


In the "file control" window on the left, you can click on one of the template files that is used to compile the page. The HTML code for that file will then appear in the "Now editing" window in the center. If the template is editable (determined by directory permissions) you can then make any changes and save them.
Nella finestra "controllo file" a sinistra, puoi fare clic su uno dei file modello utilizzati per compilare la pagina. Puoi vedere la ''Parte schermo'', JavaScript e i file CSS. Il codice HTML per quel file apparirà quindi nella finestra "Modifica in corso" al centro. Se il modello è modificabile (determinato dalle autorizzazioni della directory), è possibile apportare eventuali modifiche e salvarle.


The "Other Files" window shows a list of all other files in the template directory. You can use the right side to '''upload and select image files (your pics, logos,...) or other files needed to create your template'''. Note: Instead of a link directly to each picture in your template you can use the field string {TEMPLATEURL}.  So instead of:
<center>[[File:File Control Section.png|center]]</center>


<syntaxhighlight lang="html4strict" enclose="div">img src='/limesurvey/templates/yourtemplate/mypicture.jpg'</syntaxhighlight>
You can use:
<syntaxhighlight lang="html4strict" enclose="div">img src='{TEMPLATEURL}mypicture.jpg'</syntaxhighlight>


A "sample" of the template page you are editing will be visible at the bottom of the screen. There is no way to to delete a template from the template editor. This must be done by accessing the underlying directory and deleting the file there.
La finestra "Altri file" mostra un elenco di tutti gli altri file dalla directory dei modelli. Puoi utilizzare il lato destro per '''caricare e selezionare file immagine (le tue foto, loghi,...) o altri file necessari per creare il tuo modello'''.  


<div class="simplebox">'''Note:''' The shipped templates cannot be edited using the Template Editor and should never be changed. If you want to modify them, create a copy first and modify the copy.</div>


==Location of template files==
Invece di utilizzare un link per ogni immagine, utilizza la stringa di campo {TEMPLATEURL}. Quindi, invece di:


LimeSurvey stores each of the 'standard' templates in their own distinct sub-directory within the /templates directory that is kept in the public directory with the other LimeSurvey public files. Customized user templates are stored in the /upload/templates directory.
<syntaxhighlight lang="html4strict">img src='/limesurvey/templates/yourtemplate/files/mypicture.jpg'</syntaxhighlight>
Puoi usare {{NewIn|2.50}}:
<syntaxhighlight lang="html4strict"> img src='{TEMPLATEURL}files/miaimmagine.jpg'</syntaxhighlight>


To create a new template, use the according icon in the template editor.
Nelle versioni di LimeSurvey precedenti alla 2.50 usa:
<syntaxhighlight lang="html4strict"> img src='{TEMPLATEURL}miaimmagine.jpg'</syntaxhighlight>


There should ALWAYS be a "default" directory in the templates directory. This template is used by default and as a fall-back if a template folder doesn't exist, or can't be found. The "default" directory comes with the package.
Un "campione" della pagina modello che stai modificando sarà visibile nella parte inferiore dello schermo. Non è possibile eliminare un modello dall'editor di modelli. Questo deve essere fatto accedendo alla directory sottostante ed eliminando manualmente i file da lì. Hai anche la possibilità di selezionare diverse risoluzioni dello schermo per valutare meglio la sensazione e l'aspetto del modello.


You can use any image files that you upload into the template management area with syntax like this:
<div class="simplebox">'''Nota:''' i modelli spediti non possono essere modificati utilizzando l'editor di modelli. Se vuoi modificarli, crea prima una copia e modifica la copia.</div>


<syntaxhighlight lang="php" enclose="div">{TEMPLATEURL}filename.xyz</syntaxhighlight>
===Posizione file modello===


=Styling questions with CSS=
LimeSurvey memorizza ciascuno dei modelli 'standard' nella propria sottodirectory distinta all'interno della directory ''/templates'' che è conservata nella directory pubblica con gli altri file pubblici di LimeSurvey. I modelli utente personalizzati sono memorizzati nella directory ''/upload/templates''.


Styling of questions in CSS has become much easier. Each question type now has a unique class. Mandatory question's also have an additional mandatory class. For example, for a non-mandatory question:
Dovrebbe esserci '''SEMPRE''' una directory "predefinita" nella directory dei modelli. Questo modello viene utilizzato per impostazione predefinita e come fallback se una cartella del modello non esiste o non può essere trovata. Viene installato per impostazione predefinita.


<syntaxhighlight lang="html4strict" enclose="div"><div id="question5" class="gender">
Puoi utilizzare qualsiasi file di immagine che carichi nell'area di gestione dei modelli con l'aiuto di questa sintassi:
 
<syntaxhighlight lang="php">{TEMPLATEURL}nomefile.xyz</syntaxhighlight>
 
==Domande di stile con i CSS==
 
Lo stile delle domande in CSS è diventato molto più semplice. Ogni tipo di domanda ha ora una classe univoca. Le domande obbligatorie hanno una classe aggiuntiva obbligatoria. Ad esempio, per una domanda non obbligatoria:
 
<syntaxhighlight lang="html4strict"><div id="question5" class="gender">
...
...
</div></syntaxhighlight>
</div></syntaxhighlight>


and if the question is mandatory
e se la domanda è obbligatoria:


<syntaxhighlight lang="html4strict" enclose="div"><div id="question5" class="gender mandatory">
<syntaxhighlight lang="html4strict"><div id="question5" class="gender mandatory">
...
...
</div></syntaxhighlight>
</div></syntaxhighlight>


and if the question is mandatory but the user didn't answer it or if there is validation on a question
e se la domanda è obbligatoria, ma l'utente non ha risposto o se c'è una convalida su una domanda:


<syntaxhighlight lang="html4strict" enclose="div"><div id="question5" class="gender mandatory input-error">
<syntaxhighlight lang="html4strict"><div id="question5" class="gender mandatory input-error">
...
...
</div></syntaxhighlight>
</div></syntaxhighlight>


and if the question has validation applied but the user hasn't answered correctly
e se alla domanda è stata applicata la convalida, ma l'utente non ha risposto correttamente:


<syntaxhighlight lang="html4strict" enclose="div"><div id="question6" class="text-short input-error">
<syntaxhighlight lang="html4strict"><div id="question6" class="text-short input-error">
...
...
</div></syntaxhighlight>
</div></syntaxhighlight>


==Global classes for question part==
==Classi globali per la parte della domanda==


These classes are used for each question type. Some question types use only one or two class, but others can use much more.
Queste classi vengono utilizzate per ogni tipo di domanda. Alcuni tipi di domande utilizzano solo una o due classi, mentre altri possono utilizzarne molte di più.


{| class="wikitable alternance"
{| class="wikitable alternanza"
|+ Global classes
|+ Classi globali
|-
|-
! scope="col" | Class name
! scope="col" | Nome classe
! scope="col" | Part
! scope="col" | Parte
! scope="col" | Question type
! scope="col" | Tipo di domanda
! scope="col" | Examples
! scope="col" | Esempi
! scope="col" | Note
! scope="col" | Nota
|-
|-
! scope="row" | .question
! scope="riga" | .domanda {{ObsoleteIn|3.0}}
| All question block
| Blocco di tutte le domande
| All question type
| Tutti i tipi di domande
|&lt;p class="question">, &lt;ul class="question">, &lt;table class="question">
|<p class="question">, <ul class="question">, <table class="question">
|  
|  
|-
|-
! scope="row" | .subquestions-list
! scope="riga" | .ls-risposte {{NewIn|3.0}}
| List of subquestion
| Blocco di tutte le domande
| Multi choice question, array question type
| Tutti i tipi di domande
| &lt;ul class="subquestions-list">, &lt;table class="subquestions-list">
|<div class="ls-answers ">, <ul class="ls-answers ">, <table class="ls-answers">
| .questions-list is used too
|  
|-
|-
! scope="row" | .answers-list
! scope="riga" | .sotto-elenco-domande
| List of answers
| Elenco delle domande secondarie
| Single choice question, array question type, Multi input text question
| Domanda a scelta multipla, tipo di domanda matrice
| &lt;ul class="answers-list">, &lt;table class="answers-list">
| <ul class="subquestions-list">, <table class="subquestions-list">
| Viene utilizzato anche .questions-list
|-
! scope="riga" | .lista-risposte
| Elenco delle risposte
| Domanda a scelta singola, tipo di domanda matrice, domanda con testo a più input
| <ul class="answers-list">, <table class="answers-list">
|  
|  
|-
|-
! scope="row" | .answer-item
! scope="riga" | .risposta
| The answer part: one answer
| La parte della risposta: una risposta
| Single choice question, array question type, Multi input text question
| Domanda a scelta singola, tipo di domanda matrice, domanda con testo a più input
| &lt;li class="answer-item">, &lt;td class="answer-item">
| <li class="answer-item">, <td class="answer-item">
|
|
|-
|-
! scope="row" | .noanswer-item
! scope="riga" | .nessuna risposta
| The answer part for no answer
| La risposta parte per nessuna risposta
| Single choice question, array question type
| Domanda a scelta singola, tipo di domanda matrice
| &lt;li class="noanswer-item">, &lt;td class="noanswer-item">
| <li class="noanswer-item">, <td class="noanswer-item">
| No answer is an answer too, then have double class noanswer-item and answer-item
| Anche nessuna risposta è una risposta, quindi usa la doppia classe noanswer-item e answer-item
|-
|-
! scope="row" | .question-item
! scope="riga" | .question-item
| The question part: one question
| La parte della domanda: una domanda
| Multi text question, array question type
| Domanda multitesto, tipo di domanda matrice
| &lt;li class="question-item">, &lt;tr class="question-item">
| <li class="question-item">, <tr class="question-item">
| Some answer are question too, then we have a lot of class="question-item answer-item"
| Alcune risposte sono anche domande. Quindi abbiamo un sacco di class="question-item answer-item"
|-
|-
! scope="row" | .checkbox-list
! scope="riga" | .elenco-pulsanti
| A list of checkbox
| Un elenco di pulsanti
| Multi choice question, array number (checkbox) question type
| Sì no e Domanda di genere
| &lt;ul class="checkbox-list">, &lt;tr class="checkbox-list">
| <ul class="button-list">
| Some question type have multi list class: like checkbox with comment : class="checkbox-list text-list"
|  
|-
|-
! scope="row" | .checkbox-item
! scope="riga" | .elemento-pulsante
| The answer part with a checkbox
| La parte di risposta con un pulsante
| Multi choice question, array number (checkbox) question type
| Sì no e Domanda di genere
| &lt;li class="checkbox-item">, &lt;td class="checkbox-item">
| <li class="button-item">
|
|
|-
|-
! scope="row" | .radio-list
! scope="riga" | .checkbox-list
| A list of radio item
| Un elenco di checkbox
| Single choice question, array question type
| Domanda a scelta multipla, numero di matrice (casella di controllo) tipo di domanda
| &lt;ul class="radio-list">, &lt;tr class="radio-list">
| <ul class="checkbox-list">, <tr class="checkbox-list">
| Alcuni tipi di domande usano una classe multi-lista, come checkbox con commento: class="checkbox-list text-list"
|-
! scope="riga" | .checkbox-array {{NewIn|3.0}}
| Un array di checkbox
| Array (numeri) con opzione checkbox
| <table class="checkbox-list">
|
|-
! scope="riga" | .elemento-casella di controllo
| La parte di risposta con una casella di controllo
| Domanda a scelta multipla, numero di matrice (casella di controllo) tipo di domanda
| <li class="checkbox-item">, <td class="checkbox-item">
|
|
|-
|-
! scope="row" | .radio-item
! scope="riga" | .elenco-radio
| The answer part with a radio
| Un elenco di elementi radio
| Single choice question, array question type
| Domanda a scelta singola, tipo di domanda matrice (ogni riga)
| &lt;li class="radio-item">, <td class="radio-item">
| <ul class="radio-list">, <tr class="radio-list">
|
|
|-
|-
! scope="row" | .text-list
! scope="riga" | .radio-array {{NewIn|3.0}}
| A list of text input
| Una serie di elementi radio
| Multi text question type, array of text
| Tipo di domanda matrice
| &lt;ul class="text-list">, &lt;tr class="text-list">
| <table class="radio-array">
|
|
|-
|-
! scope="row" | .text-item
! scope="riga" | .radio-item
| The answer part of a text input
| La risposta parte con una radio
| Multi text question type, array of text
| Domanda a scelta singola, tipo di domanda matrice
| &lt;li class="text-item">, <td class="text-item">
| <li class="radio-item">,<td class="radio-item">  
|
|
|-
|-
! scope="row" | .numeric-list
! scope="riga" | .lista-di-testo
| A list of text input with numeric only answer
| Un elenco di input di testo
| Multi numeric question type, array of number
| Tipo di domanda multitesto, matrice di testo
| &lt;ul class="text-list numeric-list">, &lt;tr class="text-list numeric-list">
| <ul class="text-list">, <tr class="text-list">
|
|
|-
|-
! scope="row" | .numeric-item
! scope="riga" | .elemento di testo
| The answer part of a numeric input
| La parte di risposta di un input di testo
| Multi numeric question type, array of number
| Tipo di domanda multitesto, matrice di testo
| &lt;li class="numeric-item">, &lt;td class="numeric-item">
| <li class="text-item">,<td class="text-item">  
|
|
|-
|-
! scope="row" | .select-list
! scope="riga" | .elenco-numerico
| A list of select
| Un elenco di input di testo con risposta solo numerica
| Array numbers, Dual scale array (select)
| Tipo di domanda multinumerica, matrice di numero
| &lt;table class="select-list">
| <ul class="text-list numeric-list">, <tr class="text-list numeric-list">
|
|
|-
|-
! scope="row" | .select-item
! scope="riga" | .elenco-numeri
| The answer part of a select
| Un elenco di input di testo con risposta solo numerica (ogni riga)
| Array numbers, Dual scale array (select), single choice with select
| Tipo di domanda multinumerica, matrice di numero
| &lt;p class="select-item">, &lt;td class="select-item">
| <ul class="text-list numeric-list">, <tr class="text-list numeric-list">
|
|
|-
|-
! scope="row" | .hide
! scope="riga" | .number-array {{NewIn|3.0}}
| Used for accessibility: hidden with css but read by screenreader
| La parte di risposta di un input numerico
| Short text question
| Array di numero
| &lt;label class="hide">
| <table class="number-array">
| Can be used for other purpose
|
|-
|-
! scope="row" | .dontread
! scope="riga" | .select-list {{ObsoleteIn|2.50}}
| Used for accessibility: not be read by screenreader
| Un elenco di select
| Array question type
| Numeri di array, array a doppia scala (seleziona)
| &lt;th class="dontread">
| <table class="select-list">
|
|
|-
|-
! scope="row" | .checkbox
! scope="riga" | .dropdown-list {{NewIn|2.50}}
| input[type=checkbox]
| Un elenco di select
| Question with checkbox
| Numeri di matrice, matrice a doppia scala (seleziona) (ogni riga)
| &lt;input type="checkbox" class="checkbox">
| <table class="dropdown-list">
| With modern browser: not needed but some old browser need this
|
|-
|-
! scope="row" | .radio
! scope="riga" | .dropdown-array {{NewIn|3.0}}
| input[type=radio]
| Un array di dropdown
| Question with radio
| Numeri di array, array a doppia scala (seleziona)
| &lt;input type="radio" class="radio">
| <table class="dropdown-array">
| With modern browser: not needed but some old browser need this
|
|-
|-
! scope="row" | .text
! scope="riga" | .select-item {{ObsoleteIn|2.50}}
| input[type=text]
| La risposta parte di un select
| Question with input text, or textarea
| Numeri di array, array a doppia scala (seleziona), scelta singola con select
| &lt;textarea class="text">
| <p class="select-item">, <td class="select-item">
|
|
|-
|-
! scope="row" | .answertext
! scope="riga" | .dropdown-item {{NewIn|2.50}}
| Array question type
| La risposta parte di un select
| Answer part of array question type
| Numeri di array, array a doppia scala (seleziona), scelta singola con select
| &lt;th class="answertext">
| <p class="dropdown-item">, <td class="dropdown-item">
|
|
|-
|-
! scope="row" | .col-answers
! scope="riga" | .hide {{ObsoleteIn|3.0}}
| Array question type
| Usato per l'accessibilità: nascosto con css ma letto dallo screen reader, dalla 2.50: puoi usare sr-only da bootstrap
| Column of answers
| Domanda a testo breve
| &lt;col class="col-answers">
| <label class="hide">
| Può essere utilizzato per altri scopi
|-
! scope="riga" | .ls-js-nascosto {{NewIn|3.0}}
| Utilizzato per nascondere la parte se javascript è attivato
| Pulsante per esempio
| <div class="ls-js-hidden">
| LimeSurvey core l'ha usato, ma puoi usarlo anche tu nel tuo template
|-
! scope="riga" | .ls-js-hidden-sr {{NewIn|3.0}}
| Utilizzato per l'accessibilità: nascondilo se js è attivato, ma mostra sempre se l'utente utilizza uno screen reader
| Pulsante per esempio
| <a class="ls-js-hidden-sr">
| Pulsante
|-
! scope="riga" | .ls-no-js-nascosto {{NewIn|3.0}}
| Utilizzato per nascondere la parte se javascript non è attivato
| Collegamento
| <a class="ls-no-js-hidden">
| Il core di LimeSurvey lo ha utilizzato per il collegamento inattivo se javascript non è attivato
|-
! scope="riga" | .ls-label-xs-visibilità {{NewIn|3.0}}
| Etichetta da nascondere su maxischermo, ma mostrabile su piccolo schermo (senza più tabella) e allo screen reader
| etichetta
| <label class="ls-no-js-hidden">
| Utilizzato per l'etichetta all'interno della cella della tabella del tipo di domanda matrice
|-
! scope="riga" | .ls-input-group-extra {{NewIn|3.0}}
| Stesso utilizzo di boostrap input-group-addon, ma senza il bordo e lo sfondo.
| suffisso destro
| <div class="ls-input-group-extra">
| Utilizzato per i suffissi destro e sinistro (globale)
|-
! scope="riga" | .casella di controllo {{ObsoleteIn|3.0}}
| input[tipo=casella di controllo]
| Domanda con checkbox
| <input type="casella di controllo" class="casella di controllo">
| Con i browser moderni: non necessario, ma alcuni vecchi browser lo richiedono
|-
! scope="riga" | .radio {{ObsoleteIn|3.0}}
| input[tipo=radio]
| Domanda con radio
| <input type="radio" class="radio">
| Con i browser moderni: non necessario, ma alcuni vecchi browser lo richiedono
|-
! scope="riga" | .testo
| input[tipo=testo]
| Domanda con testo di input o textarea
| <textarea class="text">
|
|
|-
|-
! scope="row" | .odd .even
! scope="riga" | .risposta
| Array question type
| Tipo di domanda matrice
| Alternation for column
| Rispondi a una parte del tipo di domanda dell'array
| &lt;col class="odd">
| <th class="answertext">
|
|
|-
|-
! scope="row" | .odd .even
! scope="riga" | .col-risposte
| Array question type
| Tipo di domanda matrice
| Alternation for column
| Colonna di risposte
| &lt;col class="odd">
| <col class="col-answers">
|
|
|-
|-
! scope="row" | .array1 .array2
! scope="riga" | .odd .even {{ObsoleteIn|2.50}}
| Array question type
| Tipo di domanda matrice
| Alternation for line
| Alternanza per colonna
| &lt;tr class="array1">
| <col class="odd">
|
|-
! scope="riga" | .array1 .array2 {{ObsoleteIn|3.0}}
| Tipo di domanda matrice
| Alternanza per riga
| <tr class="array1">
|
|-
! scope="riga" | .ls-dispari .ls-pari {{NewIn|3.0}}
| Tipo di domanda matrice
| Alternanza per sottodomanda e asse Y
| <tr class="ls-odd">
|
|
|}
|}


=== Some example of question part with classes===
==== Alcuni esempi di parti di domande con classi====


'''text-short question type:'''<source lang="html4strict">
'''Tipo di domanda breve:'''<source lang="html4strict">
<p class="question answer-item text-item ">
<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">
<label class="hide label" for="answerSGQA">Answer</label><input type="text" value="" id="answerSGQA" name="SGQA" size="50" class="text  empty">
</p>
</p>
</source>
</source>
'''Multiple short text'''<source lang="html4strict">
'''Testo breve multiplo'''<source lang="html4strict">
<ul class="subquestions-list questions-list text-list">
<ul class="subquestions-list questions-list text-list">
   <li class="question-item answer-item text-item" id="javatbdSGQA">
   <li class="question-item answer-item text-item" id="javatbdSGQA">
Line 390: Line 500:
</ul>
</ul>
</source>
</source>
'''Array question type'''<source lang="html4strict">
'''Tipo di domanda matrice'''<source lang="html4strict">
<table class="question subquestion-list questions-list ">
<table class="question subquestion-list questions-list ">
<caption class="hide read">Some explanation for accessibility.</caption>
<caption class="hide read">Some explanation for accessibility.</caption>
Line 421: Line 531:
</table>
</table>
</source>
</source>
==The full list of question classes==
===L'elenco completo delle classi di domande===


{|
{|
|'''Question Type'''||'''Question Class'''||'''Question ID'''
|'''Tipo domanda'''||'''Classe domanda'''||'''ID domanda'''
|-
|-
|5 point choice||.choice-5-pt-radio||5
|Scelta 5 punti||.choice-5-pt-radio||5
|-
|-
|Array (10 point choice)||.array-10-pt||B
|Array (scelta 10 punti)||.array-10-pt||B
|-
|-
|Array (5 point choice)||.array-5-pt||A
|Array (scelta 5 punti)||.array-5-pt||A! N!|-
|Array (Etichette flessibili) dual scale||.array-flexible-duel-scale ||1
|-
|-
|Array (Flexible Labels) dual scale||.array-flexible-duel-scale ||1
|Array (Increase, Same, Decrease)||.array-increase-same-decrease||E
|-
|-
|Array (Increase, Same, Decrease)||.array-increase-same-decrease||E
|Array (Multi flessibile) (Numeri)||.array-multi-flexi ||:
|-
|-
|Array (Multi Flexible) (Numbers)||.array-multi-flexi ||:
|Array (Multi flessibile) (Numeri)||.array-multi-flexi ||:
|-
|-
|Array (Multi Flexible) (Text)||.array-multi-flexi-text||;
|Array (Multi Flexible) (Testo)||.array-multi-flexi-text||;
|-
|-
|Array (Yes/No/Uncertain)||.array-yes-uncertain-no||C
|Array (Yes/No/Uncertain)||.array-yes-uncertain-no||C
|-
|-
|Array (flexible labels)||.array-flexible-row ||F
|Array (etichette flessibili)||.array-flexible-row ||F
|-
|Array (flexible labels) by column||.array-flexible-column||H
|-
|-
|Boilerplate question||.boilerplate||X
|Array (etichette flessibili) per colonna||.array-flexible-column||H
|-
|Domanda standard||.boilerplate||X
|-
|-
|Date||.date||D
|Data||.data||D
|-
|-
|Gender||.gender||G
|Equazione||.equazione||*
|-
|-
|Huge free text||.text-huge||U
|Sesso||.genere||G
|-
|-
|Language switch||.language||I
|Testo libero enorme||.testo enorme||U
|-
|-
|List (dropdown)||.list-dropdown||!
|Cambio lingua||.lingua|| I
|-
|-
|List (radio)||.list-radio||L
|Lista (dropdown)||.list-dropdown||!
|-
|-
|List with comment||.list-with-comment||O
|Lista (radio)||.list-radio||L
|-
|-
|Long free text||.text-long||T
|Lista con commento||.list-con-commento||O
|-
|-
|Multiple numerical input||.numeric-multi||K
|Testo libero lungo||.text-long||T
|-
|-
|Multiple options||.multiple-opt||M
|Input numerico multiplo||.numeric-multi||K
| -
|Opzioni multiple||.multiple-opt||M
|-
|-
|Multiple options with comments||.multiple-opt-comments||P
|Più opzioni con commenti||.multiple-opt-comments||P
|-
|-
|Multiple short text||.multiple-short-txt||Q
|Multiple short-txt||.multiple-short-txt||D
|-
|-
|Numerical input||.numeric||N
|Inserimento numerico||.numerico||N
|-
|-
|Ranking||.ranking||R
|Classifica||.classifica||R
|-
|-
|Short free text||.text-short||S
| Testo libero breve||.testo-breve||S
|-
|-
|Yes/No||.yes-no||Y
|/No||.-no||S
|-
|-
|
|
|}
|}


==The full list of validation classes==
===L'elenco completo delle classi di convalida===


<div class="simplebox">Note:  Prior to 1.92, only .mandatory and .input-error classes were available.</div>
<div class="simplebox">Nota: prima della 1.92 erano disponibili solo le classi .mandatory e .input-error.</div>


These apply to the help and/or validation tip messages so that each type can be individually styled.
Questi si applicano ai messaggi di aiuto e/o di suggerimento di convalida in modo che ogni tipo possa essere definito individualmente.


The .hide-tip option and .input-error options, by default, interact so that you can have validation tips start hidden, but appear when there validation errors, and disappear again when those errors are rectified.
L'opzione .hide-tip e le opzioni .input-error interagiscono per impostazione predefinita in modo da poter nascondere i suggerimenti di convalida. Tuttavia, appaiono quando ci sono errori di convalida e scompaiono di nuovo quando tali errori vengono corretti.


All of these are designed to eliminate the need for pop-up alert messages.  Instead, tips can appear/disappear as needed, and are color-coded to indicate whether the answers pass the validation criteria.
Tutti questi sono progettati per eliminare la necessità di messaggi di avviso pop-up. Invece, i suggerimenti possono apparire/scomparire secondo necessità e sono codificati a colori per indicare se le risposte soddisfano i criteri di convalida.


Furthermore, when you first visit a page that has unmet validation criteria, you can color-code the tips in a pleasing color to show which validation criteria have not been med; then re-display the page using a harsher color if the person submits the page with lingering validation errors.
Inoltre, quando visiti per la prima volta una pagina con criteri di convalida non soddisfatti, puoi codificare i suggerimenti con un colore gradevole per mostrare quali criteri di convalida non sono stati ancora soddisfatti; quindi visualizza nuovamente la pagina utilizzando un colore più aspro se la persona invia la pagina con errori di convalida persistenti.


{|
{|
|'''Purpose'''||'''CSS Class'''||'''Description'''
|'''Scopo'''||'''Classe CSS'''||'''Descrizione'''
|-
|Obbligatorio||.mandatory||la domanda è obbligatoria
|-
|-
|Mandatory||.mandatory||the question is mandatory
|Errore di input dell'utente||.input-error||la domanda conteneva almeno un errore di convalida
|-
|-
|User input error||.input-error||the question had at least one validation error
|Hide Tip||.hide-tip||aggiunto se utilizzi hide_tip option
|-
|-
|Hide Tip||.hide-tip||added if you use the hide_tip option
|defrault type||.em_default||per default tip set ( valore numerico ecc …)
|-
|-
|Num answers||.em_num_answers||for for min_answers and max_answers
|Num risposte||.em_num_answers||for per min_risposte e max_risposte
|-
|-
|Value range||.em_value_range||for min/max_num_value_n and multiflexible_min/max
|Intervallo di valori||.em_value_range||per min/max_num_value_n e multiflexible_min/max
|-
|-
|Sum range||.em_sum_range||for min/max/equals_num_value
|Sum range||.em _sum_range||per min/max/equals_num_value
|-
|-
|Regex validation||.em_regex_validation||for regular-expression validation of the question
|Convalida regex||.em_regex_validation||per la convalida dell'espressione regolare della domanda
|-
|-
|Question-level validation function||.em_q_fn_validation||for the em_validation_q option
|Funzione di convalida a livello di domanda||.em_q_fn_validation||per l'opzione em_validation_q
|-
|-
|Subquestion-level validation function||.em_sq_fn_validation||for the em_validation_sq option
|Funzione di convalida a livello di sottodomanda||.em_sq_fn_valid ation||per l'opzione em_validation_sq
|-
|-
|Other comment mandatory||.em_other_comment_mandatory||for other_comment_mandatory option - shows when "other" is selected but associated comment is missing.
|Altro commento obbligatorio||.em_other_comment_mandatory||per l'opzione other_comment_mandatory - mostra quando "altro" è selezionato ma manca il commento associato.
|-
|-
|
|
|}
|}


==Importing styles into your custom template==
===Importazione di stili nel tuo modello personalizzato===


The custom question styles are near the bottom of each template's CSS file and start with:<syntaxhighlight lang="php" enclose="div">/* --------------------------- START: Question styles  ------------------------------ */</syntaxhighlight>
Gli stili di domanda personalizzati si trovano nella parte inferiore del file CSS di ciascun modello e iniziano con:<syntaxhighlight lang="php"> /* --------------------------- INIZIO: Stili delle domande ------------------------------ */</syntaxhighlight>


If you're styling your own custom template, you should be able to copy everything after the above from templates/default/template.css (for tables based layouts) or /templates/limespired/template.css (for CSS based layouts) into your own style sheet without any impact on your other styles.
Se stai modellando il tuo modello personalizzato, dovresti essere in grado di copiare tutto ciò che segue da ''templates/default/template.css'' (per i layout basati su tabella) o ''/templates/limespired/template.css'' (per i layout basati su CSS) nel tuo foglio di stile senza alcun impatto sugli altri tuoi stili.


==Internet Explorer conditional style sheets==
===Fogli di stile condizionali di Internet Explorer===


Because of the marked discrepancies in rendering between IE6, IE7 and most other browsers, there are special IE conditional style sheets included for each template.
A causa delle marcate discrepanze nel rendering tra IE6 e IE7 e gli altri browser, sono inclusi speciali fogli di stile condizionale di IE per ciascun modello.


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


You should include the above code within your '''startpage.pstpl''' and copies of both the IE style sheets from either /templates/default/ or /templates/limespired for Tables base layout and CSS based layout respectively.
Dovresti includere il codice di cui sopra nel tuo '''startpage.pstpl''' e copie di entrambi i fogli di stile IE da ''/templates/default/'' o ''/templates/limespired'' rispettivamente per il layout di base delle tabelle e il layout basato su CSS.


<div class="simplebox">'''Note:''' If you copy the styles into your own style sheet you will almost certainly need to tweak them.</div>
<div class="simplebox">'''Nota:''' Se copi gli stili nel tuo foglio di stile, quasi sicuramente dovrai modificarli.</div>


===Alternative solution for Internet explorer===
====Soluzione alternativa per Internet Explorer====


You can put conditional class for body in startpage.pstpl, and use this class in your template.css. This method is used in citronade template. Adding a js / no-js class to to have javascript / no javascript system.
Puoi inserire una classe condizionale per body in startpage.pstpl e utilizzare questa classe nel tuo template.css. Questo metodo è utilizzato nel template citronade{{ObsoleteIn|2.06}}. Aggiunta di una classe js/no-js per avere un sistema javascript/no javascript.


<source lang="html4strict"><!--[if lt IE 7 ]> <body class="lang-{SURVEYLANGUAGE} {SURVEYFORMAT} ie ie6 ielt7 ielt8 ielt9 no-js"> <![endif]-->
<source lang="html4strict"><!--[if lt IE 7 ]> <body class="lang-{SURVEYLANGUAGE} {SURVEYFORMAT} ie ie6 ielt7 ielt8 ielt9 no-js"> <![endif]-->
Line 555: Line 670:
<!--[if IE 8 ]> <body class="lang-{SURVEYLANGUAGE} {SURVEYFORMAT} ie ie8 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 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]-->
<!--[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></source>
<script type='text/javascript'>/*<![CDATA[*/(function(H){ H.className=H.className.replace(/\bno-js\b/,'js') })(document.getElementsByTagName('body')[0]);/*]]>*/</script></source>
 
E in template.css usa:


And in template.css use
<source lang="css">.ie6{/*specifico per Internet Explorer 6*/}
.ielt8{/*specifico per Internet Explorer 6 e 7*/}
.ie{/*specifico per tutti gli Internet Explorer */}</source>


<source lang="css">.ie6{/*specific for internet explorer 6*/}
=== Lingue da destra a sinistra (RTL) e giustificazione===
.ielt8{/*specific for internet explorer 6 and 7*/}
.ie{/*specific for all internet explorer */}</source>


== Right-to-Left (RTL) Languages and justify==
L'editor di testo all'interno di LimeSurvey è in grado di formattare il testo RTL. Tuttavia, l'editor stesso mostra la lingua RTL in un formato da sinistra a destra quando giustificato. Questo è solo un problema di visualizzazione dell'editor. L'RTL e la domanda o il testo giustificato verranno visualizzati correttamente da destra a sinistra, anche se giustificati, nel sondaggio o nell'anteprima.


The text editor within LimeSurvey is able to format RTL Text. However, the editor itself shows the RTL language in a left to right format when justified.  This is just an editor display issue. The RTL and justified question or text will display correctly from right to left, even when justified, in your survey or on preview.
===Parole chiave===


==Keywords==
{{Deprecato|3.0}}


Keywords within a template file get replaced by the current survey information. They are surrounded by curly brackets, for example: {SURVEYNAME}
Le parole chiave all'interno di un file modello vengono sostituite dalle informazioni del sondaggio corrente. Sono racchiusi tra parentesi graffe, ad esempio: {SURVEYNAME}.


The following strings will be replaced by LimeSurvey when parsing the template file and presenting it to survey users. These field strings will work on almost every template except for the 'Completed Page'. (Most of these strings can be found in the common.php file. If it's not there, look in the index.php file.)
Le seguenti stringhe verranno sostituite da LimeSurvey durante l'analisi del file modello e la presentazione agli utenti del sondaggio. Queste stringhe di campo funzioneranno su quasi tutti i modelli ad eccezione della "Pagina completata". (La maggior parte di queste stringhe può essere trovata nel file common.php. Se non c'è, guarda nel file index.php.)


{|class=wikitable
{|class=wikitable
!'''Keyword'''!!'''Template files'''!!'''Description'''
!'''Parola chiave'''!!'''File modello'''!!'''Descrizione'''
|-
|-
|{SURVEYNAME}||All Files||The survey title
|{SURVEYNAME}||Tutti i file||Il titolo del sondaggio
|-
|-
|{SURVEYDESCRIPTION}||All Files||The survey description
|{SURVEYDESCRIPTION}||Tutti i file||La descrizione del sondaggio
|-
|-
|{WELCOME}||All files (mainly for welcome.pstpl)||The survey 'welcome' text
|{WELCOME}||Tutti i file (principalmente per welcome.pstpl)|| Il testo di benvenuto del sondaggio
|-
|-
|{PERCENTCOMPLETE}||survey.pstpl||A small graph showing the percentage of the survey completed
|{PERCENTCOMPLETE}||survey.pstpl||Un piccolo grafico che mostra la percentuale del sondaggio completato
|-
|-
|{GROUPNAME}||startgroup.pstpl, groupdescription.pstpl, endgroup.pstpl||Displays the current group name
|{GROUPNAME}||startgroup.pstpl, groupdescription.pstpl, endgroup.pstpl||Visualizza il nome del gruppo corrente
|-
|-
|{GROUPDESCRIPTION}||startgroup.pstpl, groupdescription.pstpl, endgroup.pstpl||Displays the current group description
|{GROUPDESCRIPTION}||startgroup.pstpl, groupdescription .pstpl, endgroup.pstpl||Visualizza la descrizione del gruppo corrente
|-
|-
|{NUMBEROFQUESTIONS}||welcome.pstpl||Displays the total number of questions in the survey (just the number)
|{NUMBEROFQUESTIONS}||welcome.pstpl||Visualizza il numero totale di domande nel sondaggio (solo il numero)
|-
|-
|{THEREAREXQUESTIONS}||welcome.pstpl||Displays the sentence "There are X questions in this survey" - from the relevant language file. The X is replaced with the number of questions. Note that this will also work appropriately for singular or plural. If there is only 1 question, it will print "There is 1 question in this survey".
|{THEREAREXQUESTIONS}||welcome.pstpl||Visualizza la frase "Ci sono X domande in questo sondaggio" - dal file della lingua pertinente. La X è sostituita dal numero di domande. Nota che questo funzionerà anche in modo appropriato per singolare o plurale. Se c'è solo 1 domanda, stamperà "C'è 1 domanda in questo sondaggio".
|-
|-
|{CHECKJAVASCRIPT}||All files (mainly for welcome.pstpl)||Warning message when end-user browser have javascript disabled
|{CHECKJAVASCRIPT}||Tutti i file (principalmente per welcome.pstpl)||Messaggio di avviso quando il browser dell'utente finale ha javascript disabilitato
|-
|-
|{QUESTION}||Question.pstpl||('''Has been superseeded but the {QUESTION_...} keywords as of LS1.87''') Displays the current question text (The format of {QUESTION} can customised by editing 'question_start.pstpl') Use the following: {QUESTION_TEXT}, {QUESTION_MANDATORY}, {QUESTION_HELP}, {QUESTION_MAN_MESSAGE}, {QUESTION_VALID_MESSAGE} and {QUESTION_INPUT_ERROR_CLASS} and appropriate wrapping HTML instead of {QUESTION}
|{QUESTION}||Domanda.pstpl||('''È stato sostituito da LS1.87''') Visualizza il testo della domanda corrente (Il il formato di {QUESTION} può essere personalizzato modificando 'question_start.pstpl') Utilizza quanto segue: {QUESTION_TEXT}, {QUESTION_MANDATORY}, {QUESTION_HELP}, {QUESTION_MAN_MESSAGE}, {QUESTION_VALID_MESSAGE}, {QUESTION_INPUT_ERROR_CLASS} e l'HTML appropriato invece di {QUESTION}
|-
|-
|{ANSWER}||question.pstpl, print_question.pstpl||presents the answer form for the current question
|{ANSWER}||domanda.pstpl, print _question.pstpl||presenta il modulo di risposta per la domanda corrente
|-
|-
|{SGQ}||question.pstpl, question text||Can be used in the question text itself, to reference the input field of the question dynamically by displaying the Survey-Group-Question id for the current question. (as of svn build 9755)
|{SGQ}||question.pstpl, testo della domanda||Può essere utilizzato nel testo della domanda stessa per fare riferimento al campo di immissione della domanda in modo dinamico visualizzando l'id della domanda del gruppo di indagine per la domanda corrente. (a partire da svn build 9755)
|-
|-
|{QUESTIONHELP}||question.pstpl, print_question.pstpl||Displays help text (predefined tip for question type) for the current question
|{QUESTIONHELP}||question.pstpl, print_question.pstpl||Visualizza il testo della guida (suggerimento predefinito per il tipo di domanda) per la domanda corrente
|-
|-
|{QUESTION_CLASS}||question.pstpl, print_question.pstpl||unique class for each question type. (To be included in the question's wrapping tag.)
|{QUESTION_CLASS}||question.pstpl, print_question.pstpl||classe univoca per ogni tipo di domanda. (Da includere nel tag di wrapping della domanda.)
|-
|-
|{QUESTION_CODE}||question.pstpl, print_question.pstpl||Displays the current question code
|{QUESTION_CODE}||question.pstpl, print_question.pstpl||Visualizza il codice della domanda corrente
|-
|-
|{QUESTION_ESSENTIALS}||question.pstpl||the question ID and (if a question is conditional), 'style="display:none;"'. (To be included in the question's wrapping tag.)
|{QUESTION_ESSENTIALS}||question.pstpl||l'ID della domanda e (se una domanda è condizionale), 'style="display:none;"'. (Da includere nel tag di wrapping della domanda.)
|-
|-
|{QUESTION_HELP}||question.pstp, question_start.pstpl||Displays the user defined help text for the current question
|{QUESTION_HELP}||question.pstp, question_start.pstpl||Visualizza il testo di aiuto definito dall'utente per la domanda corrente
|-
|-
|{QUESTION_TYPE_HELP}||print_question.pstp||Displays the user defined help text for the current question
|{QUESTION_TYPE_HELP}||print_question.pstp||Visualizza il testo di aiuto definito dall'utente per la domanda corrente
|-
|-
|{QUESTION_INPUT_ERROR_CLASS}||question.pstp, question_start.pstpl||Provides a class if there was user input error
|{QUESTION_INPUT_ERROR _CLASS}||question.pstp, question_start.pstpl||Fornisce una classe in caso di errore di input dell'utente
|-
|-
|{QUESTION_ID}||print_question.pstp||Provides a unique ID for each question to allow styling for specific questions
|{QUESTION_ID}||print_question.pstp||Fornisce un ID univoco per ogni domanda per consentire lo stile di domande specifiche
|-
|-
|{QUESTION_TEXT}||question.pstp, print_question.pstp, question_start.pstpl||Displays the text for the current question
|{QUESTION_TEXT}||question.pstp, print_question.pstp, question_start.pstpl||Visualizza il testo per la domanda corrente
|-
|-
|{QUESTION_MANDATORY}||question.pstp, print_question.pstp, question_start.pstpl||Displays the translated 'Mandatory' text for the current question
|{QUESTION_MANDATORY}||question.pstp, print_question.pstp, question_start.pstpl||Visualizza il testo tradotto 'Obbligatorio' per la domanda corrente
|-
|-
|{QUESTION_MAN_CLASS}||question.pstpl, print_question.pstpl||class if a question is mandatory. (To be included in the question's wrapping tag.)
|{QUESTION_MAN_CLASS}||question.pstpl, print_question.pstpl||class se una domanda è obbligatoria. (Da includere nel tag di wrapping della domanda.)
|-
|-
|{QUESTION_MAN_MESSAGE}||question.pstp, print_question.pstp, question_start.pstpl||Displays the translated 'Mandatory' help message text for the current question
|{QUESTION_MAN_MESSAGE}||question.pstp, print_question.pstp, question_start.pstpl||Visualizza il testo del messaggio di aiuto 'Obbligatorio' tradotto per la domanda corrente
|-
|-
|{QUESTION_NUMBER}||print_question.pstpl||Incremental count of questions.
|{QUESTION_NUMBER}||print_question.pstpl||Conteggio incrementale delle domande.
|-
|-
|{QUESTION_VALID_MESSAGE}||question.pstp, print_question.pstp, question_start.pstpl||Displays the translated valid help message text for the current question
| {QUESTION_VALID_MESSAGE}||question.pstp, print_question.pstp, question_start.pstpl||Visualizza il testo del messaggio di aiuto valido tradotto per la domanda corrente
|-
|-
|{QUESTION_SCENARIO}||print_question.pstp||Prints out the 'scenario' text for conditional questions.
|{QUESTION_SCENARIO}||print_question.pstp||Stampa il testo dello 'scenario' per le domande condizionali.
|-
|-
|{NAVIGATOR}||navigator.pstpl||Displays navigation buttons (next, prev, last)
|{NAVIGATOR}||navigator.pstpl||Dis riproduce i pulsanti di navigazione (next, prev, last)
|-
|-
|{CLEARALL}||All files (but intended for navigator.pstpl)||Displays the "Exit and Clear Results" link
|{CLEARALL}||Tutti i file (ma destinati a navigator.pstpl)||Visualizza il link "Esci e cancella risultati"
|-
|-
|{COMPLETED}||completed.pstpl||Displays the 'completed' message for registering, will change depending on whether the attribute_1 and attribute_2 fields are set.
|{COMPLETATO}||completed.pstpl||Visualizza il messaggio 'completato' per la registrazione, cambierà a seconda che i campi attribute_1 e attribute_2 siano impostati.
|-
|-
|{URL}||completed.pstpl||Displays the survey 'url' and 'url text'
|{URL }||completed.pstpl||Visualizza l'"url" e il "testo dell'url" del sondaggio
|-
|-
|{PRIVACYMESSAGE}||privacy.pstpl||The privacy message is shown if you set your survey to be anonymous. [[Translating LimeSurvey|The text can be edited/translated]] in the language files. This can also be changed manually by editing the privacy.pstpl template you wish to use.
|{PRIVACYMESSAGE}||privacy.pstpl||Il messaggio sulla privacy viene visualizzato se imposti il sondaggio come anonimo. [[Translating LimeSurvey|Il testo può essere modificato/tradotto]] nei file di lingua. Questo può anche essere modificato manualmente modificando il modello privacy.pstpl che desideri utilizzare.
|-
|-
|{TEMPLATEURL}||All Files||The URL to the current template location (useful for referencing image files in your template)
|{TEMPLATEURL}||Tutti i file||L'URL della posizione corrente del modello (utile per fare riferimento ai file di immagine nel tuo modello)
|-
|-
|{SUBMITCOMPLETE}||endpage.pstpl||The statement (from the language files) that tells the user they have completed the survey, and to press the "Submit" button
|{SURVEYRESOURCESURL}||Tutti i file||L'URL dei file attualmente caricati per questa posizione del sondaggio (utile per fare riferimento ai file di immagine nella tua domanda, gruppo, ....)
|-
|{SUBMITCOMPLETE}||endpage.pstpl||La dichiarazione (dai file di lingua) che indica all'utente che ha completato il sondaggio e di premere il pulsante "Invia"
|-
|-
|{SUBMITREVIEW}||survey.pstpl||The statement (from the language files) that tells the user they can review/change the answers they have made by clicking "<< prev"
|{SUBMITREVIEW}||survey.pstpl||La dichiarazione (dai file di lingua) che dice all'utente che può rivedere/modificare le risposte fornite facendo clic su "<< prev"
|-
|-
|{SAVEDID}||All Files||Displays 'Response ID' of user
|{SAVEDID}| |Tutti i file||Visualizza l'ID risposta dell'utente
|-
|-
|{TOKEN:FIRSTNAME}||All Files||***If survey answers are NOT ANONYMOUS - gets replaced with the users first name from the tokens table
|-
|-
|{TOKEN:LASTNAME}||All Files||***If survey answers are NOT ANONYMOUS - gets replaced with the users last name from the tokens table***
|{QUEXMLPDF}||Tutti i file||Visualizza il pulsante per esportare il PDF queXML del questionario, comprese le risposte inserite fino al punto che è stato completato nel sondaggio.
|-
|-
|{TOKEN:EMAIL}||All Files||***If survey answers are NOT ANONYMOUS - gets replaced with the users email from the tokens table***
|{TOKEN:FIRSTNAME}||Tutti i file||***Se le risposte al sondaggio NON sono ANONIME - viene sostituito con il nome dell'utente dai token table
|-
|-
|{TOKEN:ATTRIBUTE_1}||All Files||***If survey answers are NOT ANONYMOUS - gets replaced with the users attribute_1 from the tokens table***
|{TOKEN:LASTNAME}||Tutti i file||***Se le risposte al sondaggio NON sono ANONIME - viene sostituito con il cognome dell'utente dalla tabella dei token***
|-
|-
|{TOKEN:ATTRIBUTE_2}||All Files||***If survey answers are NOT ANONYMOUS - gets replaced with the users attribute_2 from the tokens table***
|{TOKEN:EMAIL}||Tutti i file||***Se le risposte al sondaggio NON sono ANONIME - viene sostituito con l'e-mail dell'utente dalla tabella dei token***
|-
|-
|{ANSWERSCLEARED}||Preferably in navigator.pstpl||The "Answers Cleared" statement from the language files
|{TOKEN:ATTRIBUTE_1}||Tutti i file s||***Se le risposte al sondaggio NON sono ANONIME - vengono sostituite con l'attributo utente_1 dalla tabella dei token***
|-
|-
|{RESTART}||clearall.pstpl||URL to restart the survey
|{TOKEN:ATTRIBUTE_2}||Tutti i file||***Se le risposte al sondaggio NON sono ANONIME - vengono sostituite con l'attributo utente_2 dalla tabella dei token***
|-
|-
|{CLOSEWINDOW}||All Files (Preferably in navigator.pstpl)||URL to close current window
|{ANSWERSCLEARED}||Preferibilmente in navigator.pstpl||L'istruzione "Answers Cleared" dai file di lingua
|-
|-
|{REGISTERERROR}||register.pstpl||Shows any error messages in the register page (ie: "You must include an email address")
|{RESTART}||clearall.pstpl||URL per riavviare il sondaggio
|-
|-
|{REGISTERMESSAGE1}||register.pstpl||The statement "You must be registered to complete this survey" from the language files
|{REGISTERERROR}||register.pstpl||Mostra eventuali messaggi di errore nella pagina di registrazione (es.: "Devi inserire un indirizzo email")
|-
|-
|{REGISTERMESSAGE2}||register.pstpl||Details about registering from the language files
|{REGISTERMESSAGE1}||register.pstpl||L'istruzione "Devi essere registrato per completare questo sondaggio" dai file di lingua
|-
|-
|{REGISTERFORM}||register.pstpl||The actual form for registering, will change depending on whether the attribute_1 and attribute_2 fields are set.
|{REGISTERMESSAGE2}||register.pstpl||Dettagli sulla registrazione dai file di lingua
|-
|-
|{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.
|{REGISTERFORM}||register.pstpl||Il modulo effettivo per la registrazione, cambierà a seconda che i campi attribute_1 e attribute_2 siano impostati.
|-
|-
|{LANGUAGECHANGER}||survey.pstpl||Displays a switch in multilingual surveys to change the question.
|{SAVE}||Funziona adatto su navigator.pstpl||Visualizza il 'Salva la tua risposta 's finora' per offrire all'utente di salvare e tornare più tardi per continuare il sondaggio. Se l'opzione Salva è disattivata nelle proprietà del sondaggio, il tag non verrà mostrato e ignorato.
|-
|{LANGUAGECHANGER}||survey.pstpl||Visualizza un passaggio nei sondaggi multilingue per modificare la domanda.
|}
|}


==Input/Buttons==
===Input/Pulsanti===


Each "input" type in a survey has been given its own class name, so that you can add CSS to your "startpage.pstpl" file, and have some control over the appearance of form buttons and inputs. These class names are as follows:
A ogni tipo di "input" in un sondaggio è stato assegnato il proprio nome di classe, in modo che tu possa aggiungere CSS al tuo file "startpage.pstpl" e avere un certo controllo sull'aspetto dei pulsanti e degli input del modulo. Questi nomi di classe sono i seguenti:
*'''submit''' (Submit Buttons)
*'''submit''' (Pulsanti di invio)
*'''text''' (Text Inputs - for short free text, date and numerical type)
*'''text''' (Input di testo - per testo breve libero, data e tipo numerico)!N !*'''answertext''' (Testo delle risposte)
*'''answertext''' (Text of answers)
*'''radio''' (Pulsanti radio)
*'''radio''' (Radio Buttons)
*'''checkbox''' (Caselle di controllo)
*'''checkbox''' (Check Boxes)
*'' 'select''' (Seleziona / Caselle di riepilogo)
*'''select''' (Select / List Boxes)
*'''textarea''' (Ingressi di testo grandi - per testo libero lungo)
*'''textarea''' (Large text inputs - for long free text)
*'''clearall''' (L'"Exit and Clear Survey " link)
*'''clearall''' (The "Exit and Clear Survey" link)
*'''rank''' (La domanda in stile rango. Non imposta il colore della casella di selezione o delle caselle di testo, ma consente di modificare il colore di sfondo, il colore del testo, la dimensione ecc. ., per il resto della domanda di classifica)
*'''rank''' (The rank style question. Doesn't set the colour of the select box or the text boxes (these are set by relevant section above) but does allow changing of background colour, text colour and size etc for the rest of the ranking question)
*'''graph''' (La tabella del grafico "percentuale completata")
*'''graph''' (The "percentage completed" graph table)
*'''innergraph''' (La tabella all'interno della tabella del grafico - questa contiene il testo 0% e 100%. Usalo per cambiare la dimensione di questo testo)
*'''innergraph''' (The table inside the graph table - this contains the 0% and 100% text. Use this for changing the size of this text)
*'''domanda''' (Impostazioni generali per qualsiasi domanda visualizzata all'interno di una tabella. Generalmente, dovresti usare questo per assicurati che la dimensione e il colore del carattere siano gli stessi che hai usato altrove come impostazione predefinita)
*'''question''' (General settings for any question that is displayed within a table. Generally you should use this to make sure that their font size and colour is the same as you have used elsewhere as a default)
*'''mandatory''' (Domande obbligatorie)
*'''mandatory'''  (Mandatory questions)
*'''input-error''' (Utente errore di immissione - se un utente ha commesso un errore con una domanda obbligatoria o una domanda con convalida)
*'''input-error''' (User input error - for if a user has made a mistake with a mandatory question or question with validation)
*'''array1''' e '''array2''' (Questi due stili vengono ciclati quando si presenta l'intervallo di risposte per una domanda di tipo array. Ciò consente di impostare un colore di sfondo alternativo per questi tipi di domande. '''Array1''' è utilizzato anche per le intestazioni di colonna in questi tipi di domande)
*'''array1''' and '''array2''' (These two styles are cycled when presenting the range of answers for an array type question. This allows you to set an alternating background colour for these question types. '''Array1''' is also used for the column headings in these question types)
*'''errormandatory''' (Imposta il colore e lo stile del messaggio di errore "Questa domanda è obbligatoria")
*'''errormandatory''' (Sets the colour and style of the "This question is mandatory" error message)
*'''warningjs''' (Imposta il colore e lo stile del messaggio di avviso visualizzato se il browser del partecipante ha javascript disabilitato)
*'''warningjs''' (Sets the colour and style of the warning message displayed if the participant's browser has javascript disabled)


There are also some elements that can be accessed using the ID of the element ('''#ID''' in CSS):
Ci sono anche alcuni elementi a cui è possibile accedere utilizzando l'ID dell'elemento ('''#ID''' in CSS):
*'''surveycontact''' (The contact message shown on the start page)
*'''surveycontact''' (Il messaggio di contatto mostrato nella pagina iniziale)
*'''tokenmessage''' (used for messages inside the survey, e.g. the session expired error message)
*'''tokenmessage''' (utilizzato per i messaggi all'interno del sondaggio, ad esempio il messaggio di errore di sessione scaduta)


An example of using these classes with style sheets can be found in the "bubblegum" template that comes with the LimeSurvey application.
Poiché puoi modificare tutti gli aspetti HTML, non c'è motivo di circondare i tuoi modelli con un
<syntaxhighlight lang="php"><div class='new_name'></div></syntaxhighlight>
e quindi definire un css per quella classe new_name.


Because you can edit all the HTML aspects, there's no reason to surround your templates with a <div class='new_name'> and then define a css for that new_name class.
==Stilizzare la barra di avanzamento==


==Styling the progress bar==
L'aspetto della barra di avanzamento può essere modificato con i CSS.


'''Before version 1.87:'''
Per cambiare il colore di sfondo della barra, aggiungi qualcosa come il seguente alla fine del tuo file custom.css (esempio per tema fruttato):


The chart.jpg file is a simple one pixel image file which is used to create the progress bar image in the 'PERCENTCOMPLETE' table. If the file does not exist, LimeSurvey will use the default 'maroon' coloured image in the public directory. If you want to create a bar to match your own colour scheme, then you should save the color in this file. Remember it should be a '''JPEG''' file, 1 pixel x 1 pixel, in the colour desired.
<syntaxhighlight lang="php">.fruttato .progress-bar {
 
colore di sfondo: #3300FF;
'''Version 1.87 and newer:'''
 
The progress bar appearance can be modified with CSS.
 
To change the background colour of the bar, add something like the following to the end of your template.css file.
 
<syntaxhighlight lang="php" enclose="div">#progress-wrapper .ui-widget-header {
 background-color: #3300FF;
}</syntaxhighlight>
}</syntaxhighlight>


To change the border colour of the bar, add something like the following to the end of your template.css file.
Per cambiare il colore del bordo della barra, aggiungi qualcosa di simile al seguente alla fine del tuo file custom.css (esempio per tema fruttato):


<syntaxhighlight lang="php" enclose="div">#progress-wrapper .ui-widget-content,
<syntaxhighlight lang="php">.fruttato .progress-bar {
#progress-wrapper .ui-widget-header {
bordo: 1px solido #FF0000;
 border: 1px solid #FF0000;
}</syntaxhighlight>
}</syntaxhighlight>


==Advanced Features Available to Developers==
==Funzionalità avanzate disponibili per gli sviluppatori==


Starting with version 0.99, LimeSurvey has integrated some user-made patches that allow for some special changes.  These very advanced features generally require changes to the underlying code base of LimeSurvey and should be done carefully so as not to introduce security holes.
LimeSurvey ha integrato alcune patch create dagli utenti che consentono alcune modifiche speciali. Queste funzionalità molto avanzate (generalmente) richiedono modifiche al codice sottostante di LimeSurvey e dovrebbero essere eseguite con attenzione per non introdurre buchi di sicurezza.


===Basic CMS Integration support===
====Supporto per le tue funzioni Javascript====


<div class="simplebox">Deprecated: This function is not available anymore in version 2.0 or later</div>
Alcuni utenti potrebbero aver bisogno di eseguire Javascript nelle pagine del sondaggio, ma la chiamata a '''checkconditions()''' nell'elemento BODY ha reso impossibile farlo. Questa chiamata è stata sostituita con una piccola funzione JavaScript nell'HEAD che rileva l'esistenza di '''checkconditions()''' e '''template_onload()''' prima di chiamarli. In questo modo, un autore di template può creare la propria funzione '''template_onload()''' nell'HEAD che sostituisce quella predefinita.


To be able to integrate LimeSurvey into another CMS, use the following options in '''config.php''':
*Disabilita il filtro XSS - in Impostazioni globali -> Sicurezza, imposta "Filtro HTML per XSS" su No.
*Inserisci il tuo script nella fonte di una domanda o nella descrizione di un gruppo.


// Set $embedded to true and specify the header and footer functions if the survey is to be displayed embedded in a CMS
{{Nota|Per ulteriori dettagli, consulta la sezione [[Soluzioni alternative: manipolazione di un sondaggio in fase di esecuzione utilizzando Javascript#Come utilizzare lo script (ad es. JavaScript ecc.) in LimeSurvey|soluzioni alternative]].}}


<nowiki>
$embedded = false;
$embedded_inc = "";               // path to the header to include if any
$embedded_headerfunc = "";        // e.g. COM_siteHeader for geeklog
$embedded_footerfunc = "";        // e.g. COM_siteFooter for geeklog
</nowiki>


Set '''$embedded = true;''' to enable CMS-embedding. By using the '''$embedded_inc''' variable one can include their own '''.php''' files.  By setting '''$embedded_headerfunc''' or '''$embedded_footerfunc''', one can call functions from within included files that output the relevant headers or footers instead of LimeSurveys default ones.
==Suggerimenti e trucchi==


===Support for your own Javascript functions===
===Elemento specifico della lingua===


Some users may need to run Javascript on the survey pages, but calling '''checkconditions()''' in the BODY element made it impossible to do so.  This call has been replaced with a small JavaScript function in the HEAD that sniffs for the existence of '''checkconditions()''' and '''template_onload()''' before calling each.  This way a template author can create their own '''template_onload()''' function in the HEAD that replaces the default one.
Se desideri inserire una frase specifica in una lingua in un sondaggio, ad esempio un aiuto alla fine di ogni pagina, puoi aggiungere un file .pstl a una frase e nasconderla per l'altra lingua. Se lo nascondiamo nel template.css, possiamo usare lo pseudo selettore :lang, ma usiamo qualche classe per una migliore compatibilità.


'''Version 1.87 and newer:'''
Di seguito, ci sono due frasi di aiuto, in francese e in inglese. Metti questo su endpage.pstpl:
*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 [[Workarounds: Manipulating a survey at runtime using Javascript#How to use Script (eg. JavaScript etc.) in LimeSurvey?|workaround section]].


=Videos on Templates=
<syntaxhighlight lang="php"><div class="fr" lang="fr">Pour de l'aide en direct appelez le 000000</div>
<div class="en" lang="en"> Per aiuto, chiama lo 000000</div></syntaxhighlight>


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.
e in template.css:


[http://youtu.be/Uk3FQyDTIY0 LimeSurvey training video - template customization]
<syntaxhighlight lang="php">.lang-fr .en{display:none}
.lang-it .fr{display:none}</syntaxhighlight>


=Tips & Tricks=
===Cambia il layout della pagina del sondaggio===


==Some language specific element==
Dopo aver modificato e salvato un modello, si applica a una pagina dell'elenco dei sondaggi solo se è selezionato dalle impostazioni del sondaggio. Per renderlo il modello predefinito, vai nella '''scheda Generale''' che si trova nelle '''Impostazioni globali''' della tua installazione di LimeSurvey e scegli il modello desiderato. Da questo momento in poi, tutti i modelli che utilizzano l'opzione "predefinito" come modello, oltre a quelli che verranno creati di recente, utilizzeranno il modello predefinito appena selezionato.


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.
Per utilizzare il modello corrente per questa pagina, è necessario modificare l'impostazione appropriata da '''Impostazioni globali'''. Nelle versioni precedenti, questa modifica può essere eseguita modificando l'impostazione $defaulttemplate dal file di configurazione: copia questa impostazione da config-defaults.php a config.php che sovrascrive config-defaults.php e modifica questa impostazione in <code lang="html">$defaulttemplate = 'yourtemplatename';</code> .


Example for a help sentence at bottom of the page, in french and english, put this on endpage.pstpl:
===Importa/Esporta modelli: utenti Mac===


<syntaxhighlight lang="php" enclose="div"><div class="fr" lang="fr">Pour de l'aide en direct appelez le 000000</div>
<u>Utenti Mac</u> , si noti che l'utilità di archiviazione predefinita di Mac OSX potrebbe avere problemi con le cartelle zip "generate al volo".
<div class="en" lang="en">For some help, please call 000000</div></syntaxhighlight>


and in template.css
Una soluzione è decomprimere unix dalla riga di comando:


<syntaxhighlight lang="php" enclose="div">.lang-fr .en{display:none}
$ unzip modello.zip -d modello
.lang-en .fr{display:none}</syntaxhighlight>


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


==Change the layout of the survey page==
gonfiaggio: template/startpage


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.
gonfiaggio:...


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';
Un'altra soluzione consiste nell'utilizzare gli script nelle loro controparti compilate per mac.


==Import/Export of templates: Mac users==
===Usa lo stesso modello con loghi diversi===


Mac users, please note: Mac OSX default archive utility may have problems with zip folders "generated on the fly".
Se desideri utilizzare lo stesso modello per tutti i sondaggi e desideri solo modificare il logo per ogni sondaggio, puoi utilizzare il segnaposto {SID} nel file .pstpl del modello e quindi fare riferimento a immagini diverse:


a work around is to unix'es unzip from the command line:
<syntaxhighlight lang="php"><img src="{TEMPLATEURL}files/logoImage-{SID}.png"></syntaxhighlight>


$ unzip template.zip -d template
=== Visualizza la favicon personalizzata===


Archive: template.zip
Una favicon è la piccola icona che vedi nella barra degli indirizzi del browser, nell'elenco dei segnalibri o nella scheda. Puoi visualizzare la tua icona come segue:
#Crea una favicon - Puoi utilizzare Google per trovare molti generatori di favicon gratuiti.
#Nomina la tua nuova favicon "favicon.ico" e posizionala nella directory dei tuoi template /files.
#Aggiungi il seguente codice al tuo '''startpage.pstpl''' prima del</head> etichetta.


 inflating: template/startpage
<syntaxhighlight lang="html4strict"><link rel="shortcut icon" href="{TEMPLATEURL}files/favicon.ico" type="image/x-icon">
<link rel="icon" href="{TEMPLATEURL}files/favicon.ico" type="image/x-icon"></syntaxhighlight>


 inflating: ...
=== Aspetto diverso per le pagine di sondaggi/domande===


or scripts in their mac-compiled counterparts:
Se vuoi che LimeSurvey cambi l'aspetto di ogni seconda pagina (cioè, pagine di sondaggi pari e dispari), puoi usare la classe '''.page-odd''' nel tuo file CSS per cambiare l'aspetto delle pagine dispari.


http://homepage.mac.com/roger_jolly/software/
Un esempio dal modello predefinito di LimeSurvey 1.91+:


==Changing your templates traffic light from red to green==
<syntaxhighlight lang="php">
 
.page-odd table.question-group {
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).
colore di sfondo: #D2F2D3;
 
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 &bdquo;<u>template.css</u>&rdquo; file which you can find it here:
 
[[File:t1.PNG|200px]]
 
2. Click the search button to find occurrences of logo related styles.
 
[[File:2.png|200px]]
 
3. Search for <u>#logo</u>
 
[[File:3.PNG|200px]]
 
4. Edit the main style file
 
You will see something similar to:
 
[[File:t4.PNG|500px]]
 
 
If you want to change the image just replace logo.gif with another image link. Example: (<u>logo.png</u> or <u>logo.jpg</u>).
 
 
If you want change the image size adjust width and height (in pixels) like this:
 
<syntaxhighlight lang="php" enclose="div">width:100px; height:100px;</syntaxhighlight>
 
==Adding your own logo==
 
1. Find and open the &bdquo;<u>startpage.pstpl</u>&rdquo; template file.
 
[[File:5.PNG|200px]]
 
 
2. After the <source lang="html4strict" ><body ... ></source> tag add this line to &bdquo;<u>startpage.pstpl</u>&rdquo;:
<source lang="html4strict"><img id="page_logo" src="{TEMPLATEURL}logo.png"><br></source>
 
 
3. To add logo go to &bdquo;<u>template.css</u>&rdquo;, you can find it here (see in screen):
 
[[File:6.PNG|500px]]
 
 
3.1 Then go to the end of the main &bdquo;<u>template.css</u>&rdquo; style file.
 
 
3.2 To align the logo add...
 
 
'''If you want the logo to be placed at left side:'''
 
<syntaxhighlight lang="php" enclose="div">#page_logo{
   float:left;
}</syntaxhighlight>
}</syntaxhighlight>


Se '''non''' vuoi differenziare le pagine pari e dispari, trova tutte le istanze di ''.page-odd'' in template.css e rimuovi quegli stili.


'''If you want the logo to be placed at right side:'''
===Crea un bordo separatore verticale per l'array a doppia scala===


<syntaxhighlight lang="php" enclose="div">#page_logo{
Per creare un bordo separatore verticale per un array a doppia scala, puoi aggiungere le seguenti righe al tuo file '''template.css'''.
   float:right;
}</syntaxhighlight>


<syntaxhighlight lang="php">
table.question thead td.header_separator,
table.question tbody td.dual_scale_separator
{
border-right:solid 1px #00A8E1;
}
</syntaxhighlight>


'''If you want to center the logo'''
''header_separator'' è usato per indirizzare il separatore per l'intestazione "td". Il "dual_scale_separator" viene utilizzato per indirizzare la colonna separatore nell'array a doppia scala.


<syntaxhighlight lang="php" enclose="div">#page_logo{
===Aggiungere il proprio logo all'elenco dei sondaggi===
   display: block;
   margin-left: auto;
   margin-right: auto;
}</syntaxhighlight>


==Use the same template with different logos==
# Per prima cosa apri l'editor del tema per il tema che desideri utilizzare. [[File:OpenThemeEditor.jpg]]
# Ti consigliamo di utilizzare fruttato, è il nostro miglior tema al momento.
# Quindi estendi il tema e assegnagli un nome che riconosci. [[File:ExtendTheme.jpg]]
# Nella seguente vista puoi caricare il logo che desideri utilizzare. [[File:UploadFileTheme.jpg]]
# Seleziona la schermata dell'editor `Survey List´ nel menu a discesa Schermata nell'angolo in alto a destra. [[File:OpenScreenSurveyList.jpg]]
# Quindi seleziona `layout_survey_list.twig´ nel menu a sinistra. [[File:EditLayoutSurveyListTwig.jpg]]
# Nell'editor scorri fino alla riga 126 e modifica la parte contrassegnata con il nome file dell'immagine che hai caricato in precedenza nel tema. [[File:ChangeSurveyListHeaderImageEditor.jpg]]
# Salva il tuo file. [[File:ThemeEditorSaveChanges.jpg]]
# Cambia il tema predefinito con il tuo tema esteso. [[File:ChangeDefaultTheme.jpg]]


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:
=== Allinea il logo al centro della pagina del sondaggio===
Questo esempio è per il modello "extends_fruity". Per altri modelli, il CSS richiesto potrebbe essere diverso.
# Accedi all'area di amministrazione di LimeSurvey
# Accedi all'editor del tema: Configurazione > Temi
# Trova "LimeSurvey Fruity Theme" nell'elenco e fai clic sul pulsante "Editor del tema"
# Fai clic su "custom.css" nell'elenco dei file a sinistra nella parte inferiore della pagina
# Copia il seguente CSS in quel file e premi "Salva modifiche"


<syntaxhighlight lang="php" enclose="div"><img src="{TEMPLATEURL}logoImage-{SID}.png"></syntaxhighlight>
<syntaxhighlight lang="css">
.navbar-fixed-top > div.navbar-header {
larghezza: 100% !importante;
}


==Remove the default help to all question (hide_tip)==
.navbar-fixed-top > div.navbar-header > div {
larghezza: 100% !importante;
}


There are 3 solutions to remove the default help:
.navbar-fixed-top > div.navbar-header > div > img {
# like a [[Advanced question settings#hide_tip|hide_tip attribute]] but for all question and survey.
margine: 0 auto 0 auto !importante;
# you can remove the {QUESTIONHELP} and is container from the file question.pstl, but it can be a bad idea for screenreader.
}
# for the default template and some other, add this at the end of tempate.css
</syntaxhighlight>


<syntaxhighlight lang="php" enclose="div">span.questionhelp{display:none;}</syntaxhighlight>


== 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:
==Visualizzazioni domande personalizzate {{NewIn|3.0}}==
#Create a favicon - google will find you lots of free favicon generators
#Name your new favicon "favicon.ico" and place it in your template directory
#Add the following code to your '''startpage.pstpl''' before the </head> tag


<syntaxhighlight lang="html4strict" enclose="div"><link rel="shortcut icon" href="{TEMPLATEURL}favicon.ico" type="image/x-icon">
<div class="simplebox">'''Nota:''' Questa è una funzionalità temporanea che verrà sostituita in futuro dall'oggetto domanda (sarà molto semplice spostare le viste personalizzate sull'oggetto domanda). È disabilitato per impostazione predefinita.</div>
<link rel="icon" href="{TEMPLATEURL}favicon.ico" type="image/x-icon"></syntaxhighlight>


== Different appearance for survey-/question-pages==
A partire dalla versione 2.5, puoi creare visualizzazioni personalizzate specifiche del modello per le domande e alcuni dei loro elementi incorporati. Ciò è utile se desideri modificare il layout HTML di un particolare tipo di domanda per uno o più sondaggi.


(''Version 1.91 and newer'')
*In application/config/config.php, trova 'config'=>array e aggiungi questa riga all'array: 'allow_templates_to_overwrite_views'=>1
*In /{your_template}/config.xml, imposta "overwrite_question_views" su true
*Copia application/views/survey/* in template/{your_view_directory}/survey/
*Nota che devi solo copiare i file che intendi modificare ma la struttura del file deve rimanere la stessa di application/views/survey/


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.
==Inserisci file CSS o JavaScript personalizzati per il modello==


example from default template of LimeSurvey 1.91+
A partire dalla versione 2.50, è possibile utilizzare il file config.xml per caricare automaticamente i file plug-in.


<syntaxhighlight lang="php" enclose="div">
*Carica i tuoi file nella cartella template /css o /scripts
.page-odd table.question-group {
*In /{your_template}/config.xml, aggiungi i percorsi dei file al file<css> O<js> blocchi, qualcosa del genere:<syntaxhighlight lang="xml"><css>  
 background-color: #D2F2D3;
<filename> css/jquery-ui-custom.css</filename>
}</syntaxhighlight>
<filename> css/bootstrap-slider.css</filename>


To '''not''' differentiate even and odd pages at the (default) template find all instances of ''.page-odd'' in template.css and remove those styles.
<filename>css/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css</filename>
<filename> css/flat_and_modern.css</filename>


==Create a vertical separator  border for dual scale array==
<filename>css/modello.css</filename>


To create a vertical separator border for a dual scale array you can add the following lines to your '''template.css'''-file.
<filename>css/myCustomPlugin.css</filename>
</css>
<js>
<filename> script/template.js</filename>
<filename> script/bootstrap-slider.js</filename>


<syntaxhighlight lang="php" enclose="div">
<filename>script/myCustomPlugin.js</filename>
table.question thead td.header_separator,
</js>
table.question tbody td.dual_scale_separator
{
   border-right:solid 1px #00A8E1;
}
</syntaxhighlight>
</syntaxhighlight>


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.
==Definizioni di classe (per sviluppatori)==


==Hide the survey contact message shown on the start page/survey list==
===lista-risposte===
{|class=wikitable
!'''Domanda'''!!'''Tipo di domanda'''!!'''elementi'''
|-
|arrays/5point || A || tr
|-
|array/10punti|| B|| tr
|-
|array/array || F|| tr
|-
|array/colonna || H|| tr e col
|-
|array/dualscale || 1 || tr
|-
|array/increasesamedecrease || E || tr
|-
|arrays/yesnouncertain || C|| tr
|-
|genere || G || div e ul
|-
|list_with_comment || Oh || div
|-
|classifica || R|| ul e div
|-
|yesno || Y || ul e div
|-
|ranking_advanced || R|| ul e div
|-
|listradio || L|| div
|-
|5punti di scelta || 5 || ul
|-
|scelta multipla || m || div
|-
|}


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:


<syntaxhighlight lang="php" enclose="div">
===radio-list===
{|class=wikitable
!'''Domanda'''!!'''Tipo di domanda'''!!'''elementi'''
|-
| si no || Y || ul
|-
|genere || G || ul
|-
|arrays/yesnouncertain || C|| tr
|-
|array/increasesamedecrease || E || tr
|-
|array/dualscale || 1 || tr
|-
|array/5punti || A || table e tr
|-
|arrays/10point || B|| tr
|-
|array/array || F|| tr
|-
|array/colonna || H|| col
|-
|listradio || L|| div
|-
|lista_con_commento || Oh || div seguito da ul
|-
|}


$('#surveycontact').hide(); //Hides the survey contact message
===radio-item===
{|class=wikitable
!'''Domanda'''!!'''Tipo di domanda'''!!'''elementi'''
|-
|arrays/yesnouncertain || C|| td
|-
|5punti di scelta || 5 || li
|-
|array/10punto || B|| td
|-
|array/5punti || A || td
|-
|array/array || F|| td
|-
|array/colonna || H|| td
|-
|array/dualscale || 1 || td
|-
|array/increasesamedecrease || E || td
|-
|genere || G || li
|-
|listradio || L|| li
|-
|sìno || Y || li
|-
|listradio || L|| li e div
|-
|image_select-listradio || L|| li e div
|-
|list_with_comment || 0 || li
|-
|}


</syntaxhighlight>
===list-group===
{|class=wikitable
!'''Domanda'''!!'''Tipo di domanda'''!!'''elementi'''
|-
|sino || Y || ul
|-
|5punti di scelta || 5 || ul
|-
|genere || G || ul
|-
|classifica || R|| ul
|-
|ranking_advanced || R|| ul e div
|-
|question_index_group_buttons || || div
|-
|question_index_questions_buttons || || div
|-
|}


==Remove the survey contact message shown on error messages==
===list-group-horizontal===
{|class=wikitable
!'''Domanda'''!!'''Tipo di domanda'''!!'''elementi'''
|-
|sìno || Y || ul
|-
|5punti di scelta || 5 || ul
|-
|genere || G || u
|-
|}


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:
===list-unstyled===
{|class=wikitable
!'''Domanda'''!!'''Tipo di domanda'''!!'''elementi'''
|-
|list_with_comment || 0 || ul
|-
|listradio|| L|| ul
|-
|scelta multipla|| m || ul
|-
|scelta_multipla_con_commenti|| P|| ul
|-
|multiplenumerico|| K || ul
|-
|multipleshorttext|| D || ul
|-
|classifica|| R|| ul
|-
|ranking_advanced|| R|| ul
|-
|bootstrap_buttons_multi|| m || ul
|-
|image_select-multiplechoice|| m || ul
|-
|inputondemand/multipleshorttext || D || ul
|-
|register_error|| || ul
|-
|register_message|| || ul
|-
|layout_survey_list || || ul
|-
|carica|| || ul
|-
|salva|| || ul
|-
|captcha|| || u
|-
|}


<syntaxhighlight lang="php" enclose="div">
===select-list===
removeContactAdressFromMessage(); //Removes the survey contact message from error messages
{|class=wikitable
</syntaxhighlight>
!'''Domanda'''!!'''Tipo di domanda'''!!'''elementi'''
|-
|classifica|| R|| ul
|-
|ranking_advanced|| R|| u
|-
|}


and add the following function to your *template.js* file
===checkbox-item===
{|class=wikitable
!'''Domanda'''!!'''Tipo di domanda'''!!'''elementi'''
|-
|multiflexi (Numeri array)|| : || td
|-
|scelta multipla|| m || li
|-
|scelta_multipla_con_commenti|| P|| div
|-
|image_select-listradio|| L|| li
|-
|image_select-multiplechoice|| m || li e div
|-
|navigatore|| || span
|-
|}


<syntaxhighlight lang="php" enclose="div">
===checkbox-text-item===
function removeContactAdressFromMessage()
{|class=wikitable
{
!'''Domanda'''!!'''Tipo di domanda'''!!'''elementi'''  
if ($('#tokenmessage').length > 0)
|-
   {
|scelta_multipla_con_commenti|| P|| li
   var oldMessage = $('#tokenmessage').html();
|-
   var indexContact = oldMessage.indexOf('Bitte kontaktieren');
|scelta multipla|| m || li
   var newMessage = oldMessage.substr(0, indexContact);
|-
   $('#tokenmessage').html(newMessage);
|image_select-multiplechoice|| m || li
   }
|-
}
</syntaxhighlight>


It will probably not work for a survey in English language and has to be extended when used 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"
 
<syntaxhighlight lang="php" enclose="div"><span class="en">New label</span><span class="fr">Nouveau label</span></syntaxhighlight>
 
At the template.css of your template (at /limesurvey/upload/templates/<yourtemplatename>/template.css) add:


<syntaxhighlight lang="php" enclose="div">html:lang(en) .fr{display:none}
[[Category:Theme]]
html:lang(fr) .en{display:none}</syntaxhighlight>
[[Category:Twig]]

Latest revision as of 07:16, 31 July 2023

Introduzione

LimeSurvey ha un sistema avanzato di temi e stili che fornisce agli sviluppatori un modo efficiente per personalizzare l'aspetto del sondaggio. Da LS3, il termine "modelli" è stato sostituito con il termine "temi". I temi permettono di controllare lo stile delle pagine di un sondaggio. Un amministratore del sondaggio può selezionare un tema predefinito che verrà utilizzato per ogni sondaggio per personalizzarlo ulteriormente. Temi viene fornito con opzioni che forniscono a un amministratore senza abilità di codifica un modo semplice per aggiungere un logo sulla pagina di benvenuto, cambiare i colori di sfondo, selezionare un carattere, ecc.


LimeSurvey viene fornito con 3 temi. Questi temi iniziali sono definiti dalle directory che si trovano nella directory "themes/survey/" dell'installazione di LimeSurvey. Ogni tema ha la sua directory. All'interno della directory principale di un tema troverai un file di configurazione in XML e numerose directory contenenti le viste temi (.twig), fogli di stile a cascata (.css), 'scripts, images ('.jpg o .png) e forse altri.


A partire da LimeSurvey 2.50, il motore del tema utilizza Bootstrap 3 come framework CSS. Poiché Bootstrap 3 è un framework standard, gli sviluppatori troveranno molta documentazione, tutorial e thread di forum su Internet.


A partire da LimeSurvey 3, il motore del tema utilizza Twig, quindi gli sviluppatori del tema possono cambiare la logica del rendering del sondaggio in modo facile e sicuro. Twig sostituisce il vecchio sistema di parole chiave sostitutive utilizzato nelle versioni precedenti. La logica che è stata utilizzata per generare l'HTML delle parole chiave è ora disponibile all'interno delle viste del tema.


Frammento dal tema vaniglia:

 <div class="{{ aSurveyInfo.class.answercontainer }} col-xs-12" {{ aSurveyInfo.attr.answercontainer }}> 
 {# NOTA: se desideri personalizzare il rendering della domanda, utilizza un tema di domanda #}
 {{ aDomanda.risposta | grezzo }}
</div>

I temi, essendo codice HTML e Twig, tendono a definire il posizionamento e il tipo di testo da visualizzare e simili caratteristiche strutturali della pagina. Spesso fanno riferimento o includono altri file. La maggior parte di essi fa riferimento a un comune file di fogli di stile a cascata (CSS) che definisce lo stile del carattere, il colore, la dimensione, lo sfondo e parametri simili comuni a tutte le pagine del sondaggio. I fogli di stile fanno riferimento a parametri HTML class che sono associati ai vari tipi di oggetti nel codice HTML. Ciò consente al foglio di stile di definire come visualizzare ciascuno dei molti tipi di testo o altri oggetti che possono apparire in più punti. Ci sono classi uniche per ogni tipo di domanda in LimeSurvey e quindi danno un controllo dettagliato sull'aspetto di ciascuna. Anche i file di immagine, come loghi o speciali costruttori di barre di avanzamento, possono essere referenziati nel file del tema. Infine, le parole chiave speciali tra parentesi graffe vengono sostituite con il testo definito nel sondaggio per ogni corrispondente di traduzione della lingua (ad esempio, il "Titolo del sondaggio" o il "Testo della domanda" per ciascuna lingua definita).

Se crei un nuovo modello personalizzato, ti preghiamo di pensare a contribuire aggiungendolo alla community LimeSurvey rendendolo disponibile anche agli altri. Con il tuo aiuto, possiamo far crescere la nostra collezione di template, indagini ed altri componendi aggiuntivi, per rendere LimeSurvey sempre migliore! Visita la nostra LimeSurvey template repository, dove puoi condividere i tuoi modelli.

Creazione di un nuovo tema

Per creare un nuovo template (o modificarne uno esistente) è necessario possederne la relativa l'autorizzazione come utente in LimeSurvey, così come l'autorizzazione per la manipolazione dei file contenuti nel sistema operativo dell'hosting in cui è installato LimeSurvey.

Nota di avvertimento: Se cambi tema, potresti anche influenzare tutti i sondaggi preesistenti dalla tua installazione di LimeSurvey. I temi sono una funzionalità avanzata che richiede esperienza e conoscenza dell'HTML.

La modalità preferibile per creare un nuovo template è di utilizzare i "Templete Editor" all'interno del menù di amministrazione. Alcuni preferiscono lavorare direttamente all'interno dei files template, utilizzando così il proprio editor di testo preferito invece dell'interfaccia web. In questo caso, utilizza comunque prima l'editore di modelli per creare tuo template. Questo creerà un nuovo modello di base con tutti i file di cui hai bisogno nella cartella LimeSurvey_web_root/upload/templates/your_new_template. Da qui puoi usare il tuo editor di testo per aggiustare manualmente i file del modello.

Nota sui permessi: sui sistemi unix/linux, questi file dei temi saranno di proprietà del gruppo e dell'utente su cui è in esecuzione il server Web (potrebbe essere "www" per alcuni sistemi). Quindi, assicurati di avere le autorizzazioni appropriate per modificare questi file, quando li salvi, assicurati che non cambino proprietà! In questo modo, puoi comunque utilizzare l'interfaccia Web di modifica del tema, se necessario.


Un certo numero di elementi 'pubblici' possono essere modificati da una serie di modelli. La prossima sezione fornisce una breve spiegazione di questi template.

Template:Nota

L'editori di modelli di LimeSurvey

Editor dei temi: Configurazione > Temi> Editor dei temi L'Editor dei temi è disponibile solo per gli utenti con il permesso Modelli e ai superamministratori.


  Attenzione : Un tema che non è costruito correttamente può rendere inutilizzabile un sondaggio (che utilizza il rispettivo modello).



L'editor di temi di LimeSurvey ti consente di modificare i contenuti dei tuoi temi online. Per avviare l'editor dei temi: fai clic su Temi nel menu Configurazione, quindi fai clic sul pulsante Editor dei temi accanto al tema che desideri modificare o estendere.



La schermata principale è simile a quella di amministrazione di un'indagine. Essa permette di selezionare il modello da modificare/visualizzare. Dopo averlo selezionato, puoi scegliere una tra le differenti pagine delle indagini pubbliche. Comparirà una lista dei file del template che costituiscono quella particolare pagina.



Sono disponibili le seguenti opzioni:


  • Crea: Ti permette di creare un nuovo modello. Per non ripartire da zero, viene copiato il template 'default'.
  • Importa: Permette di importare un template da un file ZIP.
  • Esporta : Consente di esportare il modello corrente in un file ZIP.
  • Copia: Consente di creare un nuovo modello copiando quello corrente.
  • Rinomina: Consente di modificare il nome del modello. Viene generalmente utilizzato dopo aver copiato o importato un modello.
  • Template: un elenco a discesa che mostra tutti i modelli disponibili che si trovano nell'installazione di LimeSurvey.
  • Schermata: un elenco a tendina che ti permette di scegliere quale particolare pagina del sondaggio di quel modello desideri visualizzare.
  • Torna al pannello di amministrazione.

Importa/Esporta/Copia un modello

Quando esporti un modello, verrà creato un archivio ZIP con tutti i tuoi file modello (file .pstpl, immagini, file css, ...). Puoi importare il file zip esportato in un'altra installazione di LimeSurvey utilizzando la funzione di importazione oppure puoi copiare manualmente l'archivio in un'altra installazione di LimeSurvey ed estrarlo nel corrispondente template directory lì.

Tuttavia, è meglio utilizzare le funzioni di importazione/esportazione/copia dei modelli di LimeSurvey nell'editor dei modelli.

Struttura della pagina / Utilizzo del modello

  • La pagina di benvenuto: startpage.pstpl, welcome.pstpl, privacy.pstpl, navigator.pstpl, endpage.pstpl
  • 'Le pagine delle domande:' startpage.pstpl, survey.pstpl, startgroup.pstpl, groupdescription.pstpl, question.pstpl, endgroup.pstpl, endpage.pstpl
  • The Final Page: startpage .pstpl, valutazione.pstpl, completato.pstpl, fine pagina.pstpl

File modello

I seguenti file modello sono usati per produrre il tuo sondaggio pubblico e devono esistere in ogni nuova cartella modello che crei:

  • startpage.pstpl: Produce l'inizio di ogni pagina html. Si inizia al "<head> " tag e non deve contenere il "<html> " tag. Questo 'vero inizio' di una pagina html standard è scritto dagli script. Assicurati che i tuoi file startpage.pstpl contengano un<body> etichetta. Anche se molti browser non richiedono una stretta aderenza agli standard HTML W3, lo script LimeSurvey deve trovare un tag per eseguire determinati elementi javascript. Non è comune vedere molte "parole chiave" utilizzate nel file startpage.pstpl. Tuttavia, potresti voler inserire {SURVEYNAME} nel titolo. Il file startpage.pstpl può contenere codice che termina nel file endpage.pstpl corrispondente. Ad esempio, puoi iniziare una tabella in questo file e chiuderla nel file endpage.pstpl. I file startpage.pstpl e endpage.pstpl avvolgono ogni possibile pagina utilizzata da LimeSurvey.
  • survey.pstpl: Questo modello è il secondo utilizzato nella maggior parte delle pagine e fornisce uno spazio per inserire il nome del sondaggio e descrizione. Questo modello non ha un corrispondente modello di 'chiusura', e successivamente dovresti chiudere tutti i tag aperti in questo file modello (es.: non lasciare una tabella aperta qui perché non c'è nessun altro posto dove chiuderla).
  • ' welcome.pstpl:' Questo modello viene utilizzato solo nella schermata di benvenuto (che si trova anche nella pagina principale per i sondaggi "tutto in uno"). Puoi usarlo per stampare il testo di benvenuto e altre informazioni che dovrebbero essere fornite nell'introduzione. Come il file 'survey.pstpl', non esiste un modello di 'chiusura' corrispondente, quindi anche tutti i tag aperti in questo file modello dovrebbero essere chiusi.
  • startgroup.pstpl: Questo modello può fornire un "riassunto" per le domande all'interno di un gruppo. Ha un modello 'endgroup.pstpl' corrispondente che può essere utilizzato per chiudere tutti i tag aperti in questo file, quindi puoi aprire una tabella all'interno di questo.
  • groupdescription.pstpl: Questo file modello è utilizzato per visualizzare una descrizione di un gruppo. Tieni presente che nelle impostazioni del sondaggio (accedi alle Impostazioni di presentazione e navigazione facendo clic sulla scheda Presentazione) puoi impostare se la descrizione del gruppo deve essere mostrata o meno. In caso contrario, questo file non è affatto incluso.
  • question.pstpl: Questo file contiene le sezioni di domanda, risposta e testo di aiuto della tua indagine. Nei sondaggi "gruppo per gruppo" e "tutto in uno", questo modello viene ripetuto ripetutamente con ogni domanda. Non esiste un file di chiusura corrispondente per questo e tutti i tag dovrebbero essere chiusi.
  • question_start.pstpl: Questo file contiene i singoli elementi trovati all'inizio di una domanda. È incluso in 'question.pstpl' tramite la parola chiave {QUESTION}. Ha lo scopo di consentire ai progettisti di modelli un maggiore controllo sul layout di una domanda. Questo template si trova al di fuori del normale sistema di template e è stato sostituito (a partire da LimeSurvey 1.87). Tutte le parole chiave di questo modello sono ora disponibili direttamente in question.pstpl.
  • completed.pstpl: Questa pagina viene visualizzata come pagina finale quando le risposte al sondaggio sono state salvate e il sondaggio è terminato. Può essere utilizzato per visualizzare un "link di inoltro" come impostato nella configurazione del sondaggio.
  • endgroup.pstpl: Questo file chiude il gruppo e può essere utilizzato per chiudere eventuali tag aperti nel file startgroup.pstpl
  • navigator.pstpl: Questo file contiene i pulsanti che consentono di navigare nel sondaggio, "successivo", "precedente", "ultimo", "invia", "salva finora" e il link "cancella tutto". Viene utilizzato in tutte le pagine tranne la pagina completata.
  • printanswers.pstpl: Questo file ha il wrapper HTML necessario per la versione stampata del sondaggio.
  • print_group.pstpl : Questo file è lo stesso di startgroup.pstpl e endgroup.pstpl, ma per la versione stampata del sondaggio.
  • print_question.pstpl: Questo file è lo stesso di question.pstpl , ma per la versione stampata del sondaggio.
  • print_survey.pstpl: Questo file è uguale a survey.pstpl, ma per la versione stampata del sondaggio.

CSS e Javascript

Due sono i file che sono sempre utilizzati nei modelli: template.css per CSS e template.js per JavaScript.

  • {TEMPLATECSS}: aggiunge linee per il fil css di default, template.css, e per il linguaggio rtl, template-rtl.css.
  • {TEMPLATEJS}: aggiunge i file di default di javascript, template.js e tutti gli altri file js di cui LimeSurvey ha bisogno.

Utilizzare Bootstrap

LimeSurvey integra Bootstrap 3, quindi poi creare tutti i tuoi modelli con le ben documentate classi Bootstrap. Per maggiori informazioni si faccia riferimento alla documentazione Bootstrap.

Un altro plugin incluso è Awesome-Bootstrap-Checkbox. Con questo puoi utilizzare le color-classes di Bootstrap (info, warning, danger, etc.) anche con il suffisso "-checkbox" o "-radio", definendo come preferisci checkbox e radio.

Sostituzione CSS o Javascript predefinito

Alcune domande utilizzano file specifici per Javascript o CSS. Se è necessario sostituire una funzione, utilizzare un sistema a cascata. Per la funzione javascript, l'ultima funzione letta è la funzione utilizzata.

Altri file modello

privacy.pstpl, invitationemail.pstpl, reminderemail.pstpl e confirmationemail.pstpl non sono più utilizzati da LimeSurvey e le impostazioni predefinite sono invece impostate nei file di lingua applicabili. I messaggi e-mail possono ora essere modificati sondaggio per sondaggio.

Pagine standard

Ci sono dieci pagine standard che un partecipante al sondaggio può vedere durante l'utilizzo o l'accesso all'applicazione LimeSurvey. Ciascuno è costruito da un numero di file Template comuni dal Template specificato nelle impostazioni del sondaggio. La tabella seguente indica quali file modello vengono utilizzati nella costruzione di ciascuna di queste pagine.

Pagine sondaggio/
File modello
Sondaggio
Elenco
Benvenuto Domanda Completato Cancella tutto Registrati Carica Salva Stampa
Risposte
Stampa
Survey
SurveyList
Benvenuti
Privacy
Navigatore
Sondaggio
InizioGruppo
Descrizionegruppo
Domanda *
FineGruppo
Valutazione
Completato
CancellaTutto
Registrati
Carica
Salva
StampaRisposte
Stampa sondaggio
Stampa gruppo
Stampa Domanda
Pagina iniziale
FinePagina
Template.css

* NOTA: Nella versione 1.90+, questo sostituisce question.pstpl E question_start.pstpl. Se stai utilizzando un vecchio modello personalizzato, devi aggiungere la seguente riga all'inizio di question.pstpl:

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

E poi aggiungi il tag di chiusura corrispondente alla fine di question.pstpl:

</div>

* NOTA: nella versione 1.91 e precedenti, i file LimeSurvey js non sono inclusi nel modello. Nella versione 2, devi usare {TEMPLATEJS} in uno dei tuoi file template per aggiungere il link al file js. Puoi aggiungerlo in startpage.pstpl o in endpage.pstpl. Puoi rimuovere la riga {TEMPLATEURL}/template.js e sostituirla con {TEMPLATEJS} per aggiornare un modello personale.

La sezione di controllo dei file

Nella finestra "controllo file" a sinistra, puoi fare clic su uno dei file modello utilizzati per compilare la pagina. Puoi vedere la Parte schermo, JavaScript e i file CSS. Il codice HTML per quel file apparirà quindi nella finestra "Modifica in corso" al centro. Se il modello è modificabile (determinato dalle autorizzazioni della directory), è possibile apportare eventuali modifiche e salvarle.


La finestra "Altri file" mostra un elenco di tutti gli altri file dalla directory dei modelli. Puoi utilizzare il lato destro per caricare e selezionare file immagine (le tue foto, loghi,...) o altri file necessari per creare il tuo modello.


Invece di utilizzare un link per ogni immagine, utilizza la stringa di campo {TEMPLATEURL}. Quindi, invece di:

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

Puoi usare (New in 2.50 ):

 img src='{TEMPLATEURL}files/miaimmagine.jpg'

Nelle versioni di LimeSurvey precedenti alla 2.50 usa:

 img src='{TEMPLATEURL}miaimmagine.jpg'

Un "campione" della pagina modello che stai modificando sarà visibile nella parte inferiore dello schermo. Non è possibile eliminare un modello dall'editor di modelli. Questo deve essere fatto accedendo alla directory sottostante ed eliminando manualmente i file da lì. Hai anche la possibilità di selezionare diverse risoluzioni dello schermo per valutare meglio la sensazione e l'aspetto del modello.

Nota: i modelli spediti non possono essere modificati utilizzando l'editor di modelli. Se vuoi modificarli, crea prima una copia e modifica la copia.

Posizione file modello

LimeSurvey memorizza ciascuno dei modelli 'standard' nella propria sottodirectory distinta all'interno della directory /templates che è conservata nella directory pubblica con gli altri file pubblici di LimeSurvey. I modelli utente personalizzati sono memorizzati nella directory /upload/templates.

Dovrebbe esserci SEMPRE una directory "predefinita" nella directory dei modelli. Questo modello viene utilizzato per impostazione predefinita e come fallback se una cartella del modello non esiste o non può essere trovata. Viene installato per impostazione predefinita.

Puoi utilizzare qualsiasi file di immagine che carichi nell'area di gestione dei modelli con l'aiuto di questa sintassi:

{TEMPLATEURL}nomefile.xyz

Domande di stile con i CSS

Lo stile delle domande in CSS è diventato molto più semplice. Ogni tipo di domanda ha ora una classe univoca. Le domande obbligatorie hanno una classe aggiuntiva obbligatoria. Ad esempio, per una domanda non obbligatoria:

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

e se la domanda è obbligatoria:

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

e se la domanda è obbligatoria, ma l'utente non ha risposto o se c'è una convalida su una domanda:

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

e se alla domanda è stata applicata la convalida, ma l'utente non ha risposto correttamente:

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

Classi globali per la parte della domanda

Queste classi vengono utilizzate per ogni tipo di domanda. Alcuni tipi di domande utilizzano solo una o due classi, mentre altri possono utilizzarne molte di più.

Classi globali
Nome classe Parte Tipo di domanda Esempi Nota
.domanda (Obsolete since 3.0) Blocco di tutte le domande Tutti i tipi di domande

,

    ,
    .ls-risposte (New in 3.0 ) Blocco di tutte le domande Tutti i tipi di domande
    ,
      ,
      .sotto-elenco-domande Elenco delle domande secondarie Domanda a scelta multipla, tipo di domanda matrice
        ,
        Viene utilizzato anche .questions-list
        .lista-risposte Elenco delle risposte Domanda a scelta singola, tipo di domanda matrice, domanda con testo a più input
          ,
          .risposta La parte della risposta: una risposta Domanda a scelta singola, tipo di domanda matrice, domanda con testo a più input
        • ,
        • .nessuna risposta La risposta parte per nessuna risposta Domanda a scelta singola, tipo di domanda matrice
        • ,
        • Anche nessuna risposta è una risposta, quindi usa la doppia classe noanswer-item e answer-item
          .question-item La parte della domanda: una domanda Domanda multitesto, tipo di domanda matrice
        • ,
        • Alcune risposte sono anche domande. Quindi abbiamo un sacco di class="question-item answer-item"
          .elenco-pulsanti Un elenco di pulsanti Sì no e Domanda di genere
          .elemento-pulsante La parte di risposta con un pulsante Sì no e Domanda di genere
        • .checkbox-list Un elenco di checkbox Domanda a scelta multipla, numero di matrice (casella di controllo) tipo di domanda
            ,
          Alcuni tipi di domande usano una classe multi-lista, come checkbox con commento: class="checkbox-list text-list"
          .checkbox-array (New in 3.0 ) Un array di checkbox Array (numeri) con opzione checkbox
          .elemento-casella di controllo La parte di risposta con una casella di controllo Domanda a scelta multipla, numero di matrice (casella di controllo) tipo di domanda
        • ,
        • .elenco-radio Un elenco di elementi radio Domanda a scelta singola, tipo di domanda matrice (ogni riga)
            ,
          .radio-array (New in 3.0 ) Una serie di elementi radio Tipo di domanda matrice
          .radio-item La risposta parte con una radio Domanda a scelta singola, tipo di domanda matrice
        • ,
        • .lista-di-testo Un elenco di input di testo Tipo di domanda multitesto, matrice di testo
            ,
          .elemento di testo La parte di risposta di un input di testo Tipo di domanda multitesto, matrice di testo
        • ,
        • .elenco-numerico Un elenco di input di testo con risposta solo numerica Tipo di domanda multinumerica, matrice di numero
            ,
          .elenco-numeri Un elenco di input di testo con risposta solo numerica (ogni riga) Tipo di domanda multinumerica, matrice di numero
            ,
          .number-array (New in 3.0 ) La parte di risposta di un input numerico Array di numero
          .select-list (Obsolete since 2.50) Un elenco di select Numeri di array, array a doppia scala (seleziona)
          .dropdown-list (New in 2.50 ) Un elenco di select Numeri di matrice, matrice a doppia scala (seleziona) (ogni riga)