Passer au contenu

/ Communications et services numériques

Rechercher

La boîte à outils

Voici la liste des éléments pouvant être insérés dans vos pages avec exemples visuels.

Pour insérer un élément, vous n'avez qu'à cliquer sur une des icônes d'insertion  de la page (dans n'importe laquelle des zones de contenu) et à choisir l'élément de contenu désiré dans les listes offertes (onglets).

Éléments disponibles par type

Texte et images

Cliquer ici ↓... pour les instructions d'insertion de ces éléments.

Texte

Un texte formaté à votre guise, avec titre (titre visible ou non). On peut inclure des images à formatage restreint directement dans le texte.
Plusieurs couleurs d'encadrés sont disponibles.

Parfois appelé Élément de texte.

Texte et images

Un texte formaté à votre guise, avec titre (titre visible ou non), auquel on peut associer une ou plusieurs images à formatage avancé.

Parfois appelé Text & images.

Titre

Un titre simple qui n'est accompagné d'aucun texte.

Parfois appelé Titre seulement.

Images

Une ou plusieurs images qui ne sont accompagnées d'aucun texte.

Parfois appelé Images seules.

Galerie d'images

Une galerie où plusieurs images sont disponibles et où le visiteur peut choisir l'image à visualiser.

Des variantes de ces éléments sont :

  • L'élément Liste à puces qui permet d'insérer un simple liste à puces.
  • L'élément Tableau qui permet d'insérer un tableau.
  • L'élément Diviseur qui insère une ligne grise pleine largeur. 

Dans ces trois cas, il est plutôt recommandé de simplement insérer la liste ou le tableau dans un élément Texte normal ou Texte et images.

Blocs et vignettes

Cliquer directement sur un bloc pour les instructions d'insertion de cet élément.

Note : Il est parfois possible d'obtenir des variantes de ces éléments en les insérant dans des encadrés colorés.

Voici une description de l'image

Crédit : ABCX


 

Bloc contact - petite image fixe

Sous-titre

Peut être utilisé pour lister des individus, des livres, des ateliers, etc. Les éléments sont séparés à l'aide d'une lègère ligne grise.

Bloc contact - image proportionnelle

Sous-titre

Peut être utilisé pour lister des individus, des livres, des ateliers, etc. Les éléments sont séparés à l'aide d'une lègère ligne grise.

Carte géographique

Supportés : GoogleMap, OpenStreetMap, BingMap et MapQuest

Accordéons et onglets

Ces éléments sont des contenants permettant un affichage de l'information sur demande du visiteur.

Exemples de sections en accordéons

Accordéon - Section 1

Contenu de la section 1 affiché.
Peut contenir des images, tableaux, liens, etc.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eget tincidunt quam. Donec eleifend, eros vel aliquam finibus, est dui ultricies felis, a luctus ante ligula sit amet felis. In id faucibus magna, bibendum accumsan ex. Donec leo justo, pulvinar at porta in, volutpat ac eros. Mauris auctor lobortis dictum.

Accordéon - Section 2

Contenu de la section 2 affiché.
Peut contenir des images, tableaux, liens, etc.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eget tincidunt quam. Donec eleifend, eros vel aliquam finibus, est dui ultricies felis, a luctus ante ligula sit amet felis. In id faucibus magna, bibendum accumsan ex. Donec leo justo, pulvinar at porta in, volutpat ac eros. Mauris auctor lobortis dictum.

Exemples de sections en accordéon avec entête à colonnes

Accordéon - Section 1

Col 2
Col 3

Élément 1

Cette section a été paramétrée pour afficher ses contenus sur 2 colonnes.

Élément 2

Cette section a été paramétrée pour afficher ses contenus sur 2 colonnes.

Accordéon - Section 2

Col 2
Col 3

Élément 1

Cette section a été paramétrée pour afficher ses contenus de façon séquentielle.

Élément 2

Second contenu.

Exemple de sections en onglets

Onglet - Section 1

Contenu de la section 1.
Peut contenir des images, tableaux, liens, etc.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin in massa ac lectus vulputate porta vitae ac lacus. Ut condimentum, sapien sed cursus lobortis, quam dui interdum leo, nec efficitur massa massa nec dui. Sed pellentesque neque molestie, dictum magna ac, auctor justo. Nunc semper tortor sed lorem volutpat ornare. Vivamus vitae mollis mi, et sollicitudin felis. 

Onglet - Section 2

Contenu de la section 2.
Pellentesque maximus mi eget tempus lobortis. Cras et faucibus diam, non pulvinar eros. Integer ac sem at tellus semper feugiat sed vitae risus. Donec nibh elit, dapibus in tempor non, consequat id sem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur elementum mi in dolor placerat, vel lacinia sapien pretium.

Carrousel

Sert à afficher, en rotation, une série d'éléments de contenus (le plus souvent des images) qui peuvent servir de tremplins vers d'autres pages du site.

Instructions d'installation

Médias sociaux

Fil Twitter "en direct"

Fil Facebook "en direct"

Instructions d'installation

Contenants de positionnement

Ces éléments sont des contenants de positionnement. Ils servent à regrouper des éléments de contenus et à leur donner un positionnement particulier.

Cliquer ici ↓... pour les instructions d'insertion de ces éléments.

Colonnes
Udem 2 colonnes
Udem 3 colonnes
Udem 4 colonnes

Sert à regrouper et à positionner les éléments en colonnes. Vous avez le plein contrôle sur la largeur des colonnes.

Conteneur
Udem Container

Ne sert qu'à regrouper des éléments. N'a aucun effet sur le visuel.

Grille-ligne
Udem Grid

Sert à regrouper les élément tout en limitant leur largeur à la largeur d'une colonne de la grille sous-jacente. Les éléments s'alignent les uns à la suite des autres dans une grille.

Dynamiques (nouvelles, activités, portraits, liste d'individus)

Certains éléments, contrairement aux autres contenus ci-dessus, ne sont pas gérés en insérant les contenus directement dans la page mais sont plutôt gérés via des répertoires de données (sous Stockage). L'installation de ces éléments qu'on appelle "plugiciel" (ou plugin) se fait en deux étapes.

  1. L'insertion dans la page du site d'un plugiciel intelligent qui s'occupera de la publication de l'information; ce plugiciel comporte généralement une grande quantité de variables de personnalisation et de configuration et elle est généralement prise en charge par l'administrateur du site. Une fois le plugiciel inséré dans la page et paramétré correctement, vous n'avez plus à toucher.
  2. La gestion des contenus (p.ex. l'ajout, la modification ou le retrait des éléments) est faite par l'édimestre via une liste se trouvant dans le répertoire libellé Stockage. C'est ici que vous devez vous rendre pour gérer les divers contenus dynamiques affichés. 

Cliquer ici ↓ pour consulter les étapes d'ajout/modification/retrait d'une actualité + exemples des visuels

Paramétrage du plugiciel (réservé à l'administrateur)

Actualités
Nouvelles ou activités (événements) avec les affichages suivants : liste, archives, détail d'une actualité (ou lien vers l'actualité sur le site d'origine).

Gestion des nouvelles/activités

Installation et paramétrage du plugiciel

Portraits
Portrait d'étudiants, de chercheurs, de professeurs avec les affichages suivants : liste, portrait aléatoire, détail d'un portrait sélectionné.

Gestion des portraits

Installation et paramétrage du plugiciel

Individus
Liste d'individus : photo, nom, téléphone, courriel, etc.

Gestion des individus

Installation et paramétrage du plugiciel

Données académiques
Professeurs, chargés de cours, étudiants au doctorat, groupes de recherche, expertises

 

Exceptionnellement, la gestion des fiches académiques se fait via le Répertoire des professeurs ou via le Répertoire des unités de recherche du site de La recherche.

Installation et paramégrage du plugiciel