Accueil > Documentation et outils > Outils et astuces pour LimeSurvey > Modèle skeletonquest pour tous les navigateurs

Modèle skeletonquest pour tous les navigateurs

Dernière modification : jeudi 17 avril 2014

Le modèle contenu sur cette page est obsoléte, merci de vous référer à SkeletonQuest pour les fichiers à jours

Ce modèle s’inspire des méthodes de conception de site web moderne [1] s’adaptant directement selon la configuration du navigateur. Il est inspiré par getskeleton, de spip-dist et de diverses sources sur internet.

L’objectif principal est de rester visible, accessible, utilisable des navigateurs les plus anciens jusqu’au navigateur les plus récent. De permettre aux répondants sur des petits écrans tel un smartphone ou une tablette de répondre à l’ensemble des questions.

Le modèle remplace aussi le système de la question de tri par jQuery UI .sortable et intègre la librairie jquery.ui.touch-punch.

Tester le modèle :

Tester toutes les questions de la version 1.92 de LimeSurvey avec le modèle skeletonquest en direct.

Si toutes les questions peuvent fonctionner, certaines sont plus ou moins agréables à répondre sur un petit écran. Les grands tableaux ne sont pas adaptés aux petits écrans par exemple.

Utiliser ce modèle

Pour utiliser ce modèle, il faut avoir les droits suffisants sur votre instance de LimeSurvey [2]. Se rendre dans l’éditeur de modèle ( ), cliquer sur le bouton d’import de modèle ( ) puis sélectionner le fichier zip joint que vous aurez précédemment télécharger sur votre ordinateur.

Ce modèle peut ensuite être utilisé pour tous vos questionnaires, il peut aussi être utiliser comme modèle par défaut.

Adapter ce modèle

Des modifications de base du modèle concernant les couleurs principales sont possible. Des règles de base sont incluse au début du fichier template.css . Les parties modifiables facilement sont :

body ; le corps général de la fenêtre
.wrapper,#content : la largeur maximale de la fenêtre, mais aussi pour ajouter une couleur de fond.
#head : l’entête présente sur toute les pages (avec le titre du questionnaire)
.question-wrapper : le bloc question+réponse
.question-text : le bloc de la question
#footer : le bas de page [3]

Pour des modifications plus complètes il faut travailler directement sur l’ensemble du fichier template.css.

Nous sommes à votre disposition pour adapter ce modèle pour vos questionnaires selon vos besoins spécifiques.

P.-S.

Ce modèle est développé sur gitorious, vous pouvez donc cloner et adapter ce modèle. Vous pouvez aussi proposer vos améliorations directement sur gitorious.

Ce modèle est distribué sous licence MIT, cette licence vous permet d’utiliser et d’adapter ce modèle à votre convenance, avec la restriction suivante : vous ne devez pas enlever la mention du copyright et le nom de l’auteur initial du fichier template.css.