Questions - 1 élu(e)

Widget "300 - 600 px Questions - 1 élu(e)"
Affichage Standard (600 px)
Formulaire de question replié
Affichage des échanges de l'élu(e)
Largeur 300 px
1
2
3
4

Ce Widget permet à un internaute de questionner son élu(e) directement sur votre site internet.

Si la question respecte nos règles de modération, elle sera transmise à l'élu(e) par mail et sera simultanément publiée sur notre site. Sinon, l'internaute recevra un mail lui précisant la raison pour laquelle nous ne publions pas sa question.

Ce widget est destiné à votre homepage (avec liste déroulante des élu(e)s) ou à la page dédiée d'une ville (sans liste déroulante). De nombreuses options vous sont proposées. Vous pouvez par exemple choisir :

- d'afficher le formulaire de question dans son format standard en 600 px (slide n°1)
- de replier ce formulaire de question (slide n°2)
- d'afficher les réponses déjà apportées par l'élu(e) en dessous du formulaire de question (slide n°3)
- d’afficher le formulaire de question avec une largeur de 300 px (slide n°4)

ÉTAPE 1 (nécessaire) - Liez le widget avec votre identifiant

Voici l’url de base de ce widget : http://questionnezvoselus.org/iframe/question/4611 (cliquez pour avoir un aperçu).
Remplacez le numéro « 4611» par votre identifiant à 4 chiffres que vous trouverez en indiquant votre nom ci-dessous :

ÉTAPE 2 (optionnelle) – Personnalisez l’affichage du widget

Il est possible de renseigner plusieurs paramètres optionnels qui personnaliseront l'affichage de votre widget.
Voici une liste de ces différents paramètres et leur description.

 
Polices
Nom du paramètre Description Valeurs possibles Comportement si paramètre non renseigné
police_header Change la police des éléments suivants:
  • Titre "Questionnez vos élus"
  • Libellé "Posez votre question à [Nom du maire]"
  • Bouton "Envoyer"
  • Libellé "En partenariat avec questionnezvoselus.org"
  • Paramètre dialogue (voir tableau Autres)
    • Libellé "Lire les échanges"
    • Libellé "[Nom Prénom de l'internaute] à [Nom du maire]"
    • Libellé "[Nom du maire]"
    • Pagination du dialogue
  • Paramètre list (voir tableau Autres)
    • Libellé "Posez une question à un autre maire" 
  • 0: Roboto
  • 1: Yanone Kaffeesatz
  • 2: Source Sans Pro
  • 3: Franklin Gothic Extra-Condensed
  • 4: Arial
  • 5: Bitter
  • 6: Oswald
  • 7: Tahoma
  • 8: Arial Black
  • 9: Novecento Medium
  • 10: Georgia
  • 11: Share
Utilisation de la police Yanone Kaffeesatz
police_form Change la police des éléments suivants:
  • Formulaire
  • Pied de page
  • Paramètre dialogue (voir tableau Autres)
    • Thème des questions
    • Questions et réponses
    • Date des questions/réponses
  • Paramètre list (voir tableau Autres)
    • Couple [Ville] - [Nom du maire]
  • 0: Roboto
  • 1: Yanone Kaffeesatz
  • 2: Source Sans Pro
  • 3: Franklin Gothic Extra-Condensed
  • 4: Arial
  • 5: Open Sans
  • 6: Tahoma
  • 7: Ubuntu
  • 8: Arimo
Utilisation de la police Roboto
 
 
Couleurs
Nom du paramètre Description Valeurs possibles Comportement si paramètre non renseigné
color_bordures Change la couleur des éléments suivant:
  • Bordure haute
  • Bouton "Envoyer"
  • Bordure basse
  • Paramètre dialogue (voir tableau Autres)
    • Pagination du dialogue
N'importe quelle valeur hexadécimale
Omettre le # du début
Exemple: FF0000 pour la couleur rouge
Utilisation de la couleur 7BC144
color_header Change la couleur des éléments suivants:
  • ​Titre "Questionnez vos élus"
  • Libellé "Posez votre question à [Nom de l'élu]"
  • Libellé "En partenariat avec questionnezvoselus.org"
  • Paramètre dialogue (voir tableau Autres)
    • Nom des élus à qui la question a été posée
  • Paramètre list (voir tableau Autres)
    • Libellé "Posez une question à un autre maire"
N'importe quelle valeur hexadécimale
Omettre le # du début
Exemple: FF0000 pour la couleur rouge
Utilisation de la couleur 264F0E
color_form Change la police des éléments suivants:
  • Formulaire
  • Pied de page
  • Paramètre dialogue (voir tableau Autres)
    • Libellé "[Nom prénom de l'internaute]"
    • Thème de questions
    • Questions/réponses
    • Date des questions/réponses
  • Paramètre list (voir tableau Autres)
    • Couple [Ville] - [Nom du maire]
N'importe quelle valeur hexadécimale
Omettre le # du début
Exemple: FF0000 pour la couleur rouge
Utilisation de la couleur 264F0E
color_dialogue Change la couleur du fond de la partie "Lire les échanges" (voir ci-dessous) N'importe quelle valeur hexadécimale
Omettre le # du début
Exemple: FF0000 pour la couleur rouge
Utilisation de la couleur EEEEEE
 
 
Autres
Nom du paramètre Description Valeurs possibles Comportement si paramètre non renseigné
photo Permet d'afficher ou non la photo de l'élu
  • 0: photo masquée
  • 1: photo affichée
La photo est affichée
partnership Permet d'afficher ou non la mention du partenariat avec questionnezvoselus.org
  • 0: partenariat affiché
  • 1: partenariat masqué
Le partenariat est affiché
fold Permet de replier le formulaire afin que le Widget prenne moins de place
Nécessite de déployer du code Javascript sur votre page afin que ce paramètre fonctionne (voir étape 3)
  • false: Hauteur fixe
  • true: Hauteur dynamique
Le Widget a une hauteur fixe
list Donne la possibilité à l'internaute de poser une question à un autre maire.
Vous pouvez filtrer les choix possibles grace au paramètre "dep".
  • false: masque la liste déroulante
  • true: affiche la liste déroulante
La liste déroulante ne s'affiche pas
dep Permet de filtrer la liste des maires que l'internaute peut choisir.
Ce paramètre nécessite d'avoir list=true dans votre url.
Numéro de département.
Il est possible d'en indiquer plusieurs en séparant chaque numéro par une virgule.
Exemple: dep=75,78,01
La liste n'est pas filtrée
dialogue Affichage des questions/réponses du maire.
Nécessite de déployer du code Javascript sur votre page afin que ce paramètre fonctionne (voir étape 3)
  • false: Le dialogue ne s'affiche pas
  • true: affichage des questions/réponses
Les questions/réponses ne sont pas affichées
largeur Permet de modifier la largeur du widget.
Lorsque ce paramètre est renseigné il n'est pas possible d'afficher la partie dialogue.
N'importe quelle valeur comprise entre 300 et 600 Le widget a une largeur de 600 px
champ_opt Permet, lorsque le paramètre largeur est renseigné, de masquer le champ optionnel permettant de compléter sa question.
  • false: Le champ complémentaire s'affiche
  • true: Le champ complémentaire ne s'affiche pas
Le champ complémentaire s'affiche


Ajoutez "?" dans l'Url après votre identifiant, puis renseignez les différents paramètres souhaités en respectant ce format: [Nom du paramètre]=[Valeur].
Si vous en renseignez plus d'un, ajoutez "&" entre chaque paramètre.
Exemple: http://questionnezvoselus.org/iframe/question/4611?police_form=3&police_header=3&color_header=000000&color_form=000000&color_bordures=FF0000&fold=false&list=true&dialogue=true
Reportez-vous à cette / ces image(s) pour visualiser l'incidence de tous ces paramètres: 

ÉTAPE 3 (nécessaire) – Implémentez votre url dans une balise iFrame

  • Si vous avez choisi d’afficher le widget avec une taille fixe (fold=false et/ou dialogue=false)
Une fois votre url personnalisée, insérez la balise iFrame suivante dans le code de votre page internet, en remplaçant URL PERSONNALISÉE par votre url: 
<iframe src="URL PERSONNALISÉE" width='600' height='580' frameBorder='0' scrolling='no'></iframe>

En fonction des paramètres renseignés dans votre URL personnalisée, il se peut que vous deviez ajuster la hauteur (height='580') si le widget ne s'affiche pas correctement (affichage coupé, ou au contraire un espace blanc trop important en bas du widget).
 
  • Si vous avez choisi d’afficher le widget avec une taille dynamique (fold=true et/ou dialogue=true)
Une fois votre url personnalisée, insérez la balise iFrame suivante dans le code de votre page internet, en remplaçant URL PERSONNALISÉE par votre url:
<iframe id="iframe-qve" src="URL PERSONNALISÉE" width='600' height='250' frameBorder='0' scrolling='no'></iframe>

Ajoutez ensuite le code suivant dans un fichier javascript :
function receiveSize(e){
    document.getElementById("iframe-qve").style.height = e.data;
}
window.addEventListener("message", receiveSize, false);


Pour ajouter la police de votre site, ou pour toute autre question, n’hésitez pas à nous contacter : [email protected]