# Sites web - Jahia Voir également : - [sites web - WordPress](https://wiki.unil.ch/ci/books/sites-web-wordpress "Sites web - WordPress") - [sites web - ressources pour webmasters](https://wiki.unil.ch/ci/books/sites-web-ressources "Sites web - Ressources") - [autres services de l'étagère "communication et web"](https://wiki.unil.ch/ci/shelves/communication-et-web "Communication et web") # A quelle documentation Jahia dois-je me référer ? Après la migration au nouveau design des sites de la Direction et des services centraux de l'UNIL à fin 2024, les sites des facultés, instituts et centres vont également migrer au nouveau design entre 2025 et 2026. Pendant cette phase transitoire, la documentation est disponible en ligne pour tous les types de sites (pré migration et post migration). Elle est répartie en 2 chapitres :
Si les pages du sites à éditer ressemblent à ceci, il faut vous référer à la documentation [Jahia UNIL pré refonte web](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique "Jahia UNIL pré refonte web - Documentation publique") Si les pages du sites à éditer ressemblent à ceci, il faut vous référer à la documentation [Jahia UNIL post refonte web](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) (cette documentation est encore en construction)
[![Sans titre2.001.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-02/scaled-1680-/sans-titre2-001.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-02/sans-titre2-001.png) [![Sans titre2.002.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-02/scaled-1680-/sans-titre2-002.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-02/sans-titre2-002.png)
# Quelle formation Jahia dois-je suivre ? Depuis le printemps 2025, la formation Jahia est structurée temporairement d'une nouvelle manière, afin de s'adapter au projet de **refonte web des sites de facultés et de départements** actuellement en cours. Ces migrations vers le nouveau design vont se dérouler par étapes, et ce processus qui s'étalera sur deux ans (2025 + 2026). Pendant cette période transitoire, nous proposons aux personnes chargées d'éditer un site Jahia ou une rubrique de site **3 formations différentes** en fonction de leur situation : - **pour les personnes qui débutent avec Jahia**, 2 cours de base à choix selon qu'elles doivent utiliser le nouveau design ou l'ancien design, en fonction de la date de migration de leur site : - cours pour éditer les sites utilisant déjà le nouveau design ou allant l'utiliser dans les prochaines semaines (=cours post refonte web) - cours pour éditer les sites utilisant encore l'ancien design pendant quelques mois (=cours pré refonte web) - **pour les personnes qui ont déjà suivi le cours de base et connaissent donc Jahia**, mais qui n'ont pas encore suivi une formation au nouveau design, nous proposons une mise à niveau (formation en ligne) pour apprendre à utiliser le nouveau design. Cetaines personnes ont déjà suivi le cours de base Jahia il y a longtemps mais n'ont pas eu l'occasion d'éditer souvent dans Jahia depuis lors, et ont peut-être l'impression d'avoir oublié comment faire. Elles sont les bienvenues si elles veulent suivre le cours de base une nouvelle fois. Les inscriptions aux cours Jahia et à la mise à niveau se font sur [https://courses.unil.ch/ci](https://courses.unil.ch/ci) .

Voici comment choisir une formation Jahia en fonction de votre profil :

# Jahia UNIL pré refonte web - Documentation publique Pour les sites Jahia qui utilisent encore l'ancien design pré refonte web 2024 (sites des facultés, instituts et centres qui n'ont pas encore démarré leur migration) # Introduction à Jahia #### Qu'est-ce que Jahia ? Jahia est un CMS, ou content management system: C'est une application web permettant de créer et mettre à jour des sites web. Il existe de nombreux CMS permettant de répondre à différents besoins. A l'UNIL, nous employons Jahia pour réaliser nos sites web institutionnels (prestations, services, facultés, instituts etc.), et WordPress en complément pour d'autres types de sites. La documentation figurant dans ce wiki concerne uniquement la version de Jahia employée à l'UNIL et les templates et composants développés à l'UNIL. Elle n'est pas pertinente pour des personnes qui chercheraient un mode d'emploi Jahia global à employer hors du contexte UNIL. #### Que pourrez-vous éditer dans votre site Jahia ? Les sites web institutionnels de l'UNIL doivent clairement pouvoir être reconnaissables comme faisant partie d'un ensemble. Ils utilisent les mêmes modèles de page (ou templates). Par conséquent, ils vont partager plusieurs éléments communs, au niveau structurel, visuel et fonctionnel: en-tête, pied de page, navigation, styles etc. Les aspects concernant la structure et la mise en page sont décrits dans la [ligne graphique web UNIL](https://wiki.unil.ch/ci/books/sites-web-jahia/page/ligne-graphique-web-unil-pour-les-sites-jahia-JrH). Voici ce que vous pourrez éditer dans votre site Jahia: - structure du site, contenu des pages à l'aide des composants disponibles (par ex. tableaux, galeries, formulaires...) - gestion des liens hypertextes et mise en forme du contenu - gestion des images, des documents PDF, Word... - insertion de certains contenus externes (par ex. actualités et événements saisis dans MyUNIL, publications Serval, vidéos YouTube, carte Google Maps...) - création et gestion de formulaires (pour contact, inscription...) - statut des pages: brouillon ou publiées, visibles ou masquées En complément, notre équipe web peut activer certaines options ou modifications sur demande (par ex. protéger l'accès à une rubrique par mot de passe, modifier l'en-tête ou le pied de page). #### Principe de l'imbrication: pages > composants > éléments Un site web Jahia est composé d'un ensemble de pages, qui sont elles-mêmes composées de composants de contenu (aussi appelées boîtes de contenu), et ces composants sont une addition d'éléments de contenu. [![imbrication.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/imbrication.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/imbrication.png) #### Les composants de contenu Il existe plusieurs types de composants, qui peuvent voisiner sur une page, comme dans cet exemple: [![jahia-plusieurs-boites.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-10/scaled-1680-/jahia-plusieurs-boites.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-10/jahia-plusieurs-boites.png) #### Modèles de pages Dans les templates insitutionnels UNIL actuels, 2 modèles de pages sont disponibles, chacun autorisant certains types de composants: - le modèle "page d'accueil", disponible uniquement pour la homepage - le modèle "page de contenu", pour toutes les pages de contenu du site. #### Edition et publication = 2 étapes distinctes Les ajouts ou modifications de contenu dans les sites Jahia ne sont pas publiés immédiatement, la publication est un processus distinct qu'il faut lancer manuellement. Ceci permet de compléter et relire une nouvelle page ou un nouveau contenu avant de le rendre visible pour tout le monde. Ce processus concerne également les suppressions de contenu: lorsqu'on supprime une page ou un contenu, il faut ensuite "publier la suppression" pour qu'elle soit effective. #### Possibilité de masquer une page ou un contenu temporairement Jahia permet de masquer temporairement une page ou un contenu si on souhaite le rendre temporairement non visible mais qu'on veut le garder pour un usage ultérieur. Pour cela il ne faut pas dépublier ce contenu, mais agir sur sa propriété de visibilité. #### Formulaires Un composant "formulaire" permet d'ajouter sur une page un formulaire d'inscription ou de contact. Les données récoltées au moyen de ce formulaire sont consultables dans l'interface d'édition de Jahia, et sont également envoyées par email à l'adresse mail spécifiée dans les paramètres du formulaire. #### Pages ou rubriques protégées par mot de passe En option, il est possible de restreindre la consultation d'une page ou d'une rubrique (=une page et ses sous-pages) à un groupe de personnes qui devront s'idenfier par mot de passe. Ce mécanisme n'est applicable que pour des groupes de personnes disposant d'un compte UNIL, et permet ainsi de créer si nécessaire une partie "intranet" dans un site Jahia. Son activation n'est pas possible directement dans l'interface, il faut en faire la demande au helpdesk. #### Affichage de contenus externes (UNIL ou hors UNIL) En plus du contenu édité directement dans les sites Jahia, il est possible d'y faire afficher certains contenus provenant d'autres sites et applications: - de l'UNIL (par ex. actualités et événements saisis dans MyUNIL, publications Serval) - ou hors UNIL (par ex. vidéos YouTube, carte Google Maps, flux Twitter) #### Référencement Jahia permet également de travailler à un référencement efficace du site, tant au niveau de sa structure (arborescence, niveaux de titres dans les pages) que de la saisie de méta descriptions et de textes alternatifs. Nous envoyons régulièrement aux principaux moteurs de recherche des plans de nos sites Jahia au format sitemap.xml. Voir aussi: - [Ligne graphique web UNIL pour les sites Jahia](https://wiki.unil.ch/ci/books/sites-web-jahia/page/ligne-graphique-web-unil-pour-les-sites-jahia-JrH "Ligne graphique web UNIL pour les sites Jahia") - [Bases de l'édition dans Jahia](https://wiki.unil.ch/ci/books/sites-web-jahia/page/bases-de-ledition-dans-jahia "Bases de l'édition dans Jahia") \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Ligne graphique web UNIL pour les sites Jahia La ligne graphique pour les sites web Jahia UNIL précise la structure des sites, les modèles de pages, les dimensions des images, les en-têtes et pieds de page, etc. ### Structure des sites Lors de l'ouveture d'un sites Jahia sur les serveurs du Ci, seules sont présentes les pages suivantes: - page d'accueil - page actualités et événements - pages "outils" Les pages de contenu sont créées par les webmasters du site. [![structure1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/structure1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/structure1.png) Fonctionnement du menu principal et navigation de premier niveau sur une page d'accueil: [![structure2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/structure2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/structure2.png) Fonctionnement de la navigation de premier et deuxième niveau sur une page de contenu: [![structure3.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/structure3.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/structure3.png) En édition, voici l'utilisation des conteneurs "pages institutionnelles" et "pages accès guidés" : - toutes les pages de contenu doivent se trouver dans ces conteneurs "pages institutionnelles" ou "pages accès guidés" - dans ces conteneurs, le nombre d'éléments de menu est limité au 1er niveau (5 élements pour "pages institutionnelles" et 7 pour "ages accès guidés") - par contre il est possible de créer des sous-pages de 2ème, 3ème niveau et plus, sans limite de nombre (dans l'exemple ci-dessous, page 2, page 3 et page 4 ont des sous-pages) [![structure4.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/structure4.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/structure4.png) ### Modèles de pages 2 modèles de pages sont disponibles pour la création des sites: - page d'accueil, uniquement pour la page d'accueil du site - page de contenu, pour toutes les pages de contenu du site [![jahia-modele-home.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/jahia-modele-home.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/jahia-modele-home.png) [![jahia-modele-contenu.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/jahia-modele-contenu.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/jahia-modele-contenu.png) La présentation de la page d'accueil peut varier en fonction des options utilisées, comme illustré dans l'exemple ci-dessous. [![home options.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/home-options.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/home-options.png) Pour plus de précisions, voir [page d'accueil d'un site Jahia](https://wiki.unil.ch/ci/books/sites-web-jahia/page/page-daccueil-dun-site-jahia "Page d'accueil d'un site Jahia") et [pages de contenu d'un site Jahia](https://wiki.unil.ch/ci/books/sites-web-jahia/page/pages-de-contenu-dun-site-jahia "Pages de contenu d'un site Jahia"). ### Dimensions des images L'insertion d'images dans les composants de contenu Jahia nécessite souvent un redimensionnement ou un recadrage préalable selon la taille de l'image. - Dans le cas d'un composant "contenu standard" ou "à découvrir", ces opérations doivent s'effectuer manuellement, soit avant leur chargement dans Jahia, soit dans Jahia via les outils de jContent. - Dans le cas des autres composants de contenu qui intègrent des images (image centrale en page d'accueil, card design, contenu responsive, galerie, liste filtrée), ces opérations peuvent s'effectuer à choix soit manuellement avant leur chargement dans Jahia, soit automatiquement dans Jahia. [![taille images 1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/taille-images-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/taille-images-1.png) [![taille images 2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/taille-images-2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/taille-images-2.png) ### Pages "outils" Ce terme désigne les pages accessibles par les liens dans le pied de page. - Elles font partie de la ligne graphique UNIL: ne pas les supprimer, ni modifier leur titre ou leur modèle de page - Leur contenu de base peut être complété par des informations propres à votre site - La création d’une autre page de contact dans la navigation principale est autorisée. Dans ce cas, nous préconisons de mettre un lien vers cette autre page sur la page "contact" accessible via le pied de page. [![pages outils.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/pages-outils.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/pages-outils.png) ### En-têtes et pieds de page Dans les sites Jahia UNIL, les webmasters ne peuvent pas modifier directement le contenu des en-têtes et pied de page, ils/elles doivent pour cela adresser leur demande de modification au helpdesk du Ci. Seule exception: la zone des liens rapides => voir plus bas. #### L'en-tête Texte de l'en-têtre: pour l'émetteur du site (=unité responsable du site), 2 lignes sont à disposition dans l'en-tête. Elles sont utilisées comme dans ces exemples: [![lignes header.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/lignes-header.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/lignes-header.png) Couleur du menu principal: 9 couleurs sont disponibles, utilisées selon ce princinpe - 1 couleur (bleu UNIL) pour les sites de la Direction et des services centraux UNIL - 1 couleur neutre (gris) pour les sites - interfacultaires - interinstitutionnels (par ex. UNIL + UniGE) - hôtes et divers - 7 couleurs pour les sites des 7 facultés et de leurs départements et centres [![couleurs1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/couleurs1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/couleurs1.png) [![couleurs2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/couleurs2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/couleurs2.png) La zone des liens rapides (=shortcuts): Cette zone de menu complémentaire est directement éditable par les webmasters à partir de la page d'accueil du site. Elle permet l'ajout de liens internes ou externes pertinents. Son intitulé est modifiable (=dropdown title). Voir [page d'accueil d'un site Jahia](https://wiki.unil.ch/ci/books/sites-web-jahia/page/page-daccueil-dun-site-jahia "Page d'accueil d'un site Jahia"). [![shortcuts.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/shortcuts.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/shortcuts.png) #### Le pied de page Les logos en pied de page sont utilisés dans 3 cas de figure distincts: [![logo footer 1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/logo-footer-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/logo-footer-1.png) [![logo footer 2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/logo-footer-2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/logo-footer-2.png) [![logo footer 3.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/logo-footer-3.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/logo-footer-3.png) Voir aussi: - La liste des [composants de contenu Jahia](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-de-contenu-jahia "Composants de contenu Jahia") - [Site exemple Jahia](https://www.unil.ch/exemplejahia/home.html) : liste des composants disponibles - [Site modèle Jahia](https://www.unil.ch/modelejahia/home.html) : exemple de site fictif qui utilise ces composants \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Bases de l'édition dans Jahia

Si vous n'éditez pas votre site depuis le réseau de l'UNIL, il est nécessaire d'activer le VPN UNIL, voir le point 1 sur la page [questions fréquentes...](https://wiki.unil.ch/ci/books/sites-web-jahia/page/questions-frequentes-sur-ledition-jahia "Questions fréquentes sur l'édition Jahia")

### L'interface d'édition Se connecter [![login.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/login.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/login.png) Se déconnecter [![logout.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/logout.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/logout.png) Edition des pages: **Page Composer** [![pc.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/pc.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/pc.png) Gestion des images et documents: **jContent** [![jcontent.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/jcontent.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/jcontent.png) ### Les interactions de base 3 actions fréquentes dans la manipulation des pages et des composants: - glisser/déposer, pour déplacer une page dans la structure du site ou un composant dans une page - clic droit, pour accéder au menu contextuel - bouton "+ tout contenu" au bas de chaque page, pour ajouter un nouveau composant sur la page ### Edition et publication = étapes distinctes L'édition d'une page ou d'un composant (ajout, modification, suppression) n'est pas directement visible en ligne par les personnes qui visitent le site. Il faut ensuite publier ces modifications. Avant de publier, on peut si on le souhaite utiliser le **mode "aperçu"** pour vérifier que les changements effectués correspondent à notre attente. Ce mode affiche dans un nouvel onglet une prévisualisation de la page avant sa publication. [![apercu.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/apercu.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/apercu.png) Ensuite on peut passer à la publication: [![publication.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/publication.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/publication.png) #### Choisir le bon bouton lors de la publication

Attention au choix des boutons dans l'interface de publication :

[![publier.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-03/scaled-1680-/publier.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-03/publier.png) Comment terminer la publication si vous avez par erreur utilisé le bouton "demander une publication" au lieu du bouton "publier maintenant" ? [![workflow-2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/workflow-2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/workflow-2.png) #### Statut de publication L'affichage du statut de publication est visible en haut à droite de chaque page: [![statut-publ.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/statut-publ.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/statut-publ.png) Il existe une exception à ce principe du statut de publication indiqué par une couleur: Pour les pages faisant appel à des composants qui redimensionnent automatiquement les images (galeries, contenus responsive, listes filtrées, image en page d'accueil), selon la taille des images utilisées Jahia va les redimensionner dynamiquement à l'affichage dans le mode édition. Ceci a pour effet que même après publication, ces pages afficheront toujours un statut de publication "orange" même si elles ont bien été publiées. Et le fait de lancer à nouveau la publication va juste afficher un message "rien à publier". Dans ce cas il faut simplement comparer la version en édition avec la version en ligne pour s'assurer qu'elles soient identiques.

Les suppressions de contenus, de pages, images ou documents doivent également être publiées: la publication achève le processus de suppression. Un élément supprimé mais "non publié après suppression" reste visible en ligne.

### Copier/coller de contenus Jahia permet de copier/coller des contenus, avec 2 options selon l'objectif visé: 1. le "copier/coller simple", qui permet par exemple d'utiliser un contenu comme "modèle de mise en page" en le collant sur la même page ou sur une autre page du site 2. le "copier/coller la référence", qui permet de dupliquer un même contenu sur une ou plusieurs autres pages du site, et de pouvoir ensuite modifier le contenu de base pour qu'il soit également mis à jour sur les autres pages. #### Copier/coller simple Dans cet exemple, on vise à copier ce contenu depuis la page "Recherche" pour aller le coller sur la page "Enseignement" afin de s'en servir comme modèle de mise en page. [![copy1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/copy1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/copy1.png) Dès le moment où on a choisi "copier", le contenu se trouve dans le presse-papier de Jahia en attente de collage. On peut alors aller sur la page de destination et choisir l'option "coller". Ensuite le contenu collé peut être modifié indépendamment du contenu d'origine. [![copy2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/copy2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/copy2.png) #### Copier/coller la référence Parfois le but d'un copier/coller est de dupliquer un contenu à l'identique sur une ou plusieurs autres pages du même site et de pouvoir ensuite modifier le contenu de base afin qu'il soit mis à jour partout. Dans ce cas, après avoir copié le contenu initial, il faut aller sur la page de destination et choisir l'option "coller la référence". Le contenu collé se distingue visuellement dans l'interface d'édition: il mentionne la page source dont il est issu, il est représenté sur un fond gris et une icône "chaîne" apparaît sur la droite. Si on veut le modifier, il faut aller modier le contenu source, et ces modifications seront recopiés dans le contenu collé comme référence. [![copy3.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/copy3.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/copy3.png) Si on veut "coller comme référence" un contenu sur plusieurs pages différentes d'un même site, il faut répéter l'opération autant de fois qu'il y a de pages où le coller. ### Masquer temporairement un contenu Jahia permet de masquer temporairement un contenu dans une page, par exemple en le rendant non visible à partir d'une certaine date. Ceci permet de conserver certains contenus que l'on souhaite rendre provisoirement invisibles pour les visiteurs du site, en gardant l'option de pouvoir à nouvau les rendre visibles ultérieurement. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Composants de contenu Jahia ### Liste des composants disponibles pour éditer les pages Ce tableau montre quels composants sont disponibles sur la page d'accueil ou sur les pages de contenu.
**composant** **page d'accueil** **page de contenu,** **colonne centrale** **page de contenu,** **colonne latérale** **remarques**
image principale v
multi-usages v
HTML pour admin v pour affichage d'un flux Twitter
"super liens" v
"à découvrir" v
flux d'actualités v
flux d'événements v v
actualité en évidence v v
événement en évidence v v
card design v v
vidéov v v
flux RSS/Atomv v v
contenu standard v v avec éditeur visuel
liste dynamique v v
contenu responsive v avec éditeur visuel
tableau v
galerie v
liste avec présentation v
actualités avec filtres v
canal d'actualités v
événements avec filtres v
une actualité v
un événement v
formulaire v
liste filtrée v
publications Serval v
recherche académique Unisciences v
Remarque: pour tous les composants mentionnant les termes "actualités" ou "événements", les contenus ne sont pas saisis directement dans Jahia, mais proviennent des [canaux d'actualités/événements de MyUNIL](https://wiki.unil.ch/ci/books/sites-web-jahia/page/actualites-et-evenements-dans-myunil-pour-les-sites-jahia "Actualités et événements dans MyUNIL pour les sites Jahia"). Présentation illustrée des composants: [télécharger le PDF](https://www.unil.ch/files/live/sites/ci/files/shared/jahia/docjahia/composants-jahia-unil-22.pdf) Les composants pour les pages de contenu sont répartis en 2 catégories: - les composants UNIL, utilisés le plus fréquemment (=les "composants de base") - les composants avancées UNIL, utilisés moins fréquemment, et d'un emploi parfois un peu plus complexe. ### Les composants UNIL #### Note sur le contenu structuré et le contenu libre Les contenus d'un site Jahia peuvent être de 2 types selon leur emplacement et le composant utilisé: - du contenu structuré, saisi dans les champs d'un formulaire - du contenu libre, saisi dans un éditeur visuel nommé CKEditor, avec des outils de mise en forme tels que gras, liste à puces, hyperliens... #### [![structure-libre.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/structure-libre.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/structure-libre.png) On peut saisir du contenu structuré: - sur la page d'accueil (tous les composants) - et sur les pages de contenu (tous les composants sauf contenu standard et responsive) On peut saisir du contenu libre: - sur les pages de contenu (uniquement [composants contenu standard et responsive](https://wiki.unil.ch/ci/books/sites-web-jahia/page/pages-jahia-contenu-standard-et-contenu-responsive "- Contenu standard et contenu responsive")). #### Contenu standard et contenu responsive [Exemple contenu standard](https://www.unil.ch/exemplejahia/home/menuinst/composants-unil/contenu-standard.html) [Exemple contenu responsive](https://www.unil.ch/exemplejahia/home/menuinst/composants-unil/contenu-responsive.html) Documentation [contenu standard et contenu responsive](https://wiki.unil.ch/ci/books/sites-web-jahia/page/pages-jahia-contenu-standard-et-contenu-responsive "- Contenu standard et contenu responsive") #### Tableau [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-unil/tableau.html) #### Galerie [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-unil/galerie.html) #### Card design [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-unil/card-design.html) #### Vidéo [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-unil/video.html) #### Liste avec présentation [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-unil/liste-avec-presentation.html) #### Liste dynamique [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-unil/liste-dynamique.html) #### Flus RSS/Atom [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-unil/flux-rss-atom.html) ### Les composants avancés UNIL #### Formulaire [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-avances-unil/formulaire.html) [Documentation - Formulaires](https://wiki.unil.ch/ci/books/sites-web-jahia/page/pages-jahia-formulaires "Pages Jahia - Formulaires") #### Liste filtrée [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-avances-unil/liste-filtree.html) #### Publications Serval et recherche académique (Unisciences [Exemple Serval](https://www.unil.ch/exemplejahia/home/menuinst/composants-avances-unil/publications-serval.html) [Exemple Unisciences](https://www.unil.ch/exemplejahia/home/menuinst/composants-avances-unil/recherche-academique.html) [Ancienne documentation pour Jahia 7](https://www.unil.ch/files/live/sites/ci/files/shared/jahia/docjahia/jd1705_publications-serval-v20.pdf) #### Canal d'actualités ou d'événements [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-avances-unil/canal-dactualites-ou-devenements.html) #### Actualités ou événements avec filtres [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-avances-unil/actualites-ou-evenements-avec-filtres.html) #### Une actualité ou un événement [Exemple](https://www.unil.ch/exemplejahia/home/menuinst/composants-avances-unil/une-actualite-ou-un-evenement.html) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Page d'accueil d'un site Jahia ### Modèle de page pour la page d'accueil Ce modèle de page est disponible uniquement pour la page d'accueil du site[![modele-accueil.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/modele-accueil.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/modele-accueil.png) L'apparence de la page d'accueil peut varier selon l'activation (ou non) des diverses options proposées, voir [ligne graphique web UNIL pour les sites Jahia](https://wiki.unil.ch/ci/books/sites-web-jahia/page/ligne-graphique-web-unil-pour-les-sites-jahia-JrH "Ligne graphique web UNIL pour les sites Jahia") pour un exemple illustré et les dimensions des images. ### Options à régler en page d'accueil pour l'ensemble du site Ces 3 options visibles sur l'ensemble des pages du site se règlent sur la page d'accueil. [![Capture d’écran 2023-01-21 à 12.09.26.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/capture-decran-2023-01-21-a-12-09-26.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/capture-decran-2023-01-21-a-12-09-26.png) [![Capture d’écran 2023-01-21 à 12.09.51.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/capture-decran-2023-01-21-a-12-09-51.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/capture-decran-2023-01-21-a-12-09-51.png) ### Affichage optionnel des actualités et événements Voir aussi les [actualités/événements de MyUNIL](https://wiki.unil.ch/ci/books/sites-web-jahia/page/actualites-et-evenements-dans-myunil-pour-les-sites-jahia "Actualités et événements dans MyUNIL pour les sites Jahia"). Les possibilités d'affichage des événements et actualités sur la page d'accueil sont les suivantes: #### Dans la zone centrale [![accueil-central.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/accueil-central.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/accueil-central.png) #### Dans la zone actualités / événements [![accueil-actus.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/accueil-actus.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/accueil-actus.png) #### Fonctionnement de ces options Pour la zone centrale comme pour la zone actualités/événements, pour passer d'une option à l'autre, il faut supprimer le contenu et publier la suppression pour retrouver ensuite le choix entre les différentes options. Exemple avec la zone centrale: si on veut passer de l'option "affichage d'une image" à l'option "affichage d'une actualité", on supprime l'image pour retrouver le choix entre les options [![accuiel-changer-option.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/accuiel-changer-option.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/accuiel-changer-option.png) Exemple avec l'option "choix dans une liste" pour la zone des actualités: [![accueil-choix-actus-1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/accueil-choix-actus-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/accueil-choix-actus-1.png) Gestion des actualités ou événements dont la date de publication est expirée: Parfois les actualités ou événements dont la date de publication est expirée disparaissent de la liste en mode édition, mais restent affichés sur la page d'accueil du site. Pour actualiser l'affichage en page d'accueil, il faut faire une modification à la liste (peu importe laquelle) et la publier à nouveau. ### Boîtes multi-usages en page d'accueil Ces boîtes: - sont optionnelles - peuvent se trouver dans n'importe quelle colonne de la page d'accueil - peuvent être déplacées d'une colonne à l'autre par glisser-déposer Une colonne peut contenir à choix: - aucune boîte multi-usages - une seule boîte multi-usages - plusieurs boîtes multi-usages exemple de boîtes multi-usages: [![mu-accueil.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/mu-accueil.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/mu-accueil.png) Les boîtes multi-usages peuvent accueillir les éléments de contenu suivants: - sous-titre (=texte en gras), maximum 48 caractères - texte sans mise en forme, maximum 255 caractères (mais on peut en ajouter plusieurs pour un texte plus long) - liens vers une page du site ou un site externe - flux RSS/Atom pour afficher des actualités d’un autre site - document à télécharger, par exemple un PDF Une même boîte peut contenir plusieurs éléments de contenu, même de types différents (par ex. texte sans mise en forme et liens). \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Pages de contenu d'un site Jahia ### Modèle de page pour les pages de contenu Ce modèle de page est disponible uniquement pour les pages de contenu du site: [![modele-page-contenu.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/modele-page-contenu.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/modele-page-contenu.png) Voici quels composants peuvent être ajoutés dans quelles zones de contenu: [![main-side.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/main-side.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/main-side.png) Dans le contenu central: [![contenu-main.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/contenu-main.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/contenu-main.png) Dans le contenu latéral: [![contenu-side.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/contenu-side.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/contenu-side.png) Pour plus de détails sur ces composants, voir [composants de contenu Jahia](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-de-contenu-jahia "Composants de contenu Jahia"). Pour l'édition de texte mis en forme et les alignements d'images avec du texte, voir [contenu standard et contenu responsive](https://wiki.unil.ch/ci/books/sites-web-jahia/page/pages-jahia-contenu-standard-et-contenu-responsive "- Contenu standard et contenu responsive"). ### Structurer les pages Plusieurs options permettent de structurer les pages, de manière à faciliter la navigation et améliorer le référencement de la page: - l'emploi des niveaux de titre - l'emploi du sommaire pour naviguer dans les pages longues #### Les niveaux de titres [![niveaux-titres.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/niveaux-titres.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/niveaux-titres.png) #### Le sommaire [![sommaire-page.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/sommaire-page.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/sommaire-page.png) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Pages Jahia - Contenu standard et contenu responsive #### Principe Les composants "contenu standard" et "contenu responsive" sont les plus polyvalents pour les pages de contenu. Ce sont les seuls à permettre la saisie de contenu libre, mis en forme grâce à un éditeur visuel nommé CKEditor Le composant "contenu standard" est l'un des plus anciens composants de contenu disponibles dans Jahia à l'UNIL. C'est un peu la "boîte à tout faire", qui peut accueillir entre autres: - du texte avec ou sans mise en forme - des liens vers des pages internes ou externes - des liens vers des documents - des images - etc. Le composant contenu standard a évolué au fil du temps pour s'adapter à différents usages. Cependant, l'alignement d'images et de texte côte à côte n'a jamais vraiment été simple et satisfaisant à réaliser dans ce composant. Finalement, l'avènement du *responsive web design* pour adapter nos pages à la consultation sur mobile nous a amenés à créer un nouveau composant de contenu spécifiquement pour la présentation d'images et de texte côte à côte: le composant "contenu responsive". Ce composant permet un alignement correct d'une image et d'un texte côte à côte, et ceci sur toutes les tailles d'écrans. [![stand-vs-resp.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/stand-vs-resp.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/stand-vs-resp.png) [![ex.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/ex.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/ex.png) #### Points communs et différences entre ces 2 composants Les composants "contenu standard" et "contenu responsive" ont des points communs (en bleu) et des différences (en rouge): [![comm-diff.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/comm-diff.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/comm-diff.png) #### L'éditeur de texte CKEditor [![cke.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/cke.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/cke.png) Pour créer un lien interne vers une autre page du site: [![lien-int-1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/oWBlien-int-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/oWBlien-int-1.png) [![lien-int-2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/lien-int-2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/lien-int-2.png) Pour créer un lien externe vers un autre site: - étapes 1 et 2 identiques à la création d'un lien interne - puis indiquer le lien de destination dans le champ URL + OK pour confirmer [![lien-ext.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/lien-ext.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/lien-ext.png)

En mode édition, le composant "contenu responsive" doit généralement générer à nouveau la vignette de l'image à chaque affichage. Ce processus prend du temps, et par conséquent si une page contient un trop grand nombre de composants "contenu responsive", l'affichage de la page lors de l'édition est très lent et peut même parfois déboucher sur un "timeout" avec un message d'erreur "503 - service temporairement indisponible". => Nous conseillons par conséquent de ne pas dépasser le nombre d'environ 30 composants "contenu responsive" par page.

\[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Pages Jahia - Liste avec présentation ##### Le composant "Liste avec présentation", disponible sous Jahia dans les "Composants Unil" permet d'afficher plusieurs sections présentées de 3 fois façons différentes : "Normal", "Tabs" (sous forme d'onglets) et "FAQ"(sous forme d'accordéons)

Le composant "listes avec présentation" s'utilise en imbriquant d'autres composants Jahia dans chacune des sections. On peut donc obtenir de nombreuses mises en page en combinant différents éléments.

### Exemples [![Capture d’écran 2024-03-15 à 14.30.56.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/u4Tcapture-decran-2024-03-15-a-14-30-56.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/u4Tcapture-decran-2024-03-15-a-14-30-56.png)

Une liste sous forme "Normal". Chaque section est séparée par un **titre bleu**.

[![Capture d’écran 2024-03-15 à 14.31.02.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/bQ6capture-decran-2024-03-15-a-14-31-02.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/bQ6capture-decran-2024-03-15-a-14-31-02.png)

Une liste sous forme "Tabs". Chaque section est séparée par des **onglets cliquables**.

[![Capture d’écran 2024-03-15 à 14.31.10.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/FK5capture-decran-2024-03-15-a-14-31-10.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/FK5capture-decran-2024-03-15-a-14-31-10.png)

Une liste sous forme "FAQ". Chaque section est séparée par des **accordéons cliquables** qui révèlent le contenu placé à l'intérieur.

### Insérer un composant liste avec présentation 1. Sélectionnez le composant "liste avec présentation" dans la liste des composants UNIL [![Capture d’écran 2024-03-15 à 14.15.08.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/capture-decran-2024-03-15-a-14-15-08.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/capture-decran-2024-03-15-a-14-15-08.png) 2. Insérez le titre de composant (optionnel), puis sélectionnez le style de la présentation : Normal, Tabs ou FAQ [![Capture d’écran 2024-03-15 à 14.15.25.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/capture-decran-2024-03-15-a-14-15-25.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/capture-decran-2024-03-15-a-14-15-25.png) 3. Une fois le composant créé, cliquez sur "Section de liste" pour créer une nouvelle section [![Capture d’écran 2024-03-15 à 14.15.38.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/capture-decran-2024-03-15-a-14-15-38.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/capture-decran-2024-03-15-a-14-15-38.png) 4. Nommé la section, puis cliquez sur "sauvegarder", elle s’affichera différemment selon la vue sélectionnée : titre, onglet ou accordéon [![Capture d’écran 2024-03-15 à 14.15.57.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/capture-decran-2024-03-15-a-14-15-57.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/capture-decran-2024-03-15-a-14-15-57.png) 5. Une fois la section créée, cliquez sur "Tout contenu" pour ouvrir le menu des composants Jahia et ajouter un composant dans la section. À quelques exceptions près, la majorité des composants Jahia sont disponibles dans une section. Vous pouvez insérer de multiples contenus dans une section. [![Capture d’écran 2024-03-15 à 14.16.05.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/capture-decran-2024-03-15-a-14-16-05.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/capture-decran-2024-03-15-a-14-16-05.png) 6. Répétez l'opération autant de fois que vous avez de section. ### À noter Pour les styles "Tabs" et "FAQ", vous pouvez sélectionner quel élément (section) afficher par défaut. Pour le style "FAQ" vous pouvez aussi décider de n'ouvrir aucun accordéon par défaut. [![Capture d’écran 2024-03-15 à 14.18.01.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/capture-decran-2024-03-15-a-14-18-01.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/capture-decran-2024-03-15-a-14-18-01.png) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Pages Jahia - Formulaires #### Principe de fonctionnement Ce composant permet de créer dans votre site Jahia des formulaires pour lesquels vous recevez les données par email lorsqu'une personne qui visite le site les utilise. Ces données sont également consultables dans l'interface d'édition de Jahia. En option, il y a la possibilité d'envoyer une confirmation par email à la personne qui a utilisé le formulaire. [![principe-1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/principe-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/principe-1.png) Exemple: [![principe-2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/principe-2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/principe-2.png) précisions concernant certains éléments: - "texte libre" permet d'insérer du texte explicatif dans le formulaire - "sélection de fichier" permet d'insérer un bouton pour permettre aux utilisateurs du formulaire de joindre un fichier (par exemple un CV, un résumé de texte, etc.) au format PDF et d'une taille maximale de 2 MB #### Créer et mettre en ligne un formulaire simple Une bonne pratique en matière d'ergonomie : **ne pas placer un formulaire à l'intérieur d'une "liste avec présentation"** (onglet ou accordéon FAQ), car pour les visiteurs sur mobile, cela peut empêcher une bonne vision de la confirmation d'envoi ou des messages d'erreur éventuels. ##### Marche à suivre ajouter le composant "formulaire" dans la page: [![ajout-composant.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/ajout-composant.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/ajout-composant.png) puis spécifier les réglages généraux: [![reglages-gen.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/reglages-gen.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/reglages-gen.png) ajouter les champs: [![ajout-champ.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/ajout-champ.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/ajout-champ.png) quand tous les champs de saisie ont été définis, il faut ajouter le(s) bouton(s) : \- bouton de validation du formulaire (obligatoire) \- bouton d'annulation pour effacer le contenu (facultatif) [![ajout-bouton.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/ajout-bouton.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/ajout-bouton.png) ensuite publier le formulaire: [![publier-form.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/publier-form.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/publier-form.png) et finalement le tester, mais impérativement à partir du serveur de consultation et non pas à partir du serveur d'édition ! [![test form.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/test-form.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/test-form.png) Si vous ne souhaitez pas que votre formulaire soit disponible pour les visiteurs du site juste après que vous l'ayez publié, il faut utiliser les propriétés de visibilité de son composant pour le masquer temporairement. #### Message de confirmation (en option) Voici comment activer l'option pour que toute personne qui utilise le formulaire reçoive ensuite un email de confirmation (par ex. "nous accusons bonne réception de votre demande..."). [![confirmation1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-03/scaled-1680-/confirmation1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-03/confirmation1.png) [![confirmation2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-03/scaled-1680-/confirmation2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-03/confirmation2.png) #### Limites techniques - On ne peut pas ajouter plusieurs formulaires sur une même page, donc maximum 1 formulaire par page . - Les champs "nom système" du titre de la page et des champs du formulaire ne peuvent contenir ni accents, ni espaces, ni signes diacritiques ou de ponctuation, mais uniquement des caractères alphanumériques, des chiffres ou le signe - (trait d'union). - Si ces règles ne sont pas respectées, le formulaire ne peut pas fonctionner et affiche des messages d'erreur lors des tentatives d'utilisation. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Gestion des images et documents dans Jahia #### Organisation des images et documents sur le serveur Les fichiers des images et documents sont gérés dans un espace de stockage, dans des dossiers. Cet espace de stockage se nomme "jContent". Les fichiers (=images et documents) qui s'y trouvent sont appelés par les pages du site pour y être affichés. [![jc1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/jc1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/jc1.png) [![jcont1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/jcont1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/jcont1.png) Les noms des dossiers et des fichiers doivent respecter les bonnes pratiques web: - pas d’espaces, accents ou caractères spéciaux - toujours avoir une extension, comme .pdf, .jpg, etc. #### Fonctionnement de jContent [![jcont2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/jcont2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/jcont2.png) Pour charger un fichier dans jContent (=upload) - glisser/déposer - ou "importer des fichiers" dans la barre d'outils Pour déplacer un fichier: 1. glisser/déposer le fichier dans un autre dossier 2. aller dans le dossier de destination et publier le fichier déplacé [![jcont3.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/scaled-1680-/jcont3.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-03/jcont3.png) Pour savoir si un fichier est utilisé ou non sur le site: dans l'affichage sous forme de liste 1. clic sur l'icône "crayon" à côté de l'icone "3 points" 2. options avancées > utilisations 3. si le fichier est utilisé, on voit l'adresse de la page qui l'appelle Pour supprimer un fichier: 1. menu contextuel > supprimer => le nom du fichier apparaît barré 2. pour terminer la suppression: menu contextuel > publier la suppression 3. si on supprime plusieurs fichiers, gain de temps avec le bouton bleu "publier tout" en haut à droite #### Utilisation de jContent depuis Page Composer pour ajouter une image A partir d'une page en cours d'édition, on peut aller chercher une image déjà présente dans jcontent, ou sinon en charger une directement. Voici comment se présente l'interface. [![jc4.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/jc4.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/jc4.png) [![jc5.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/jc5.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/jc5.png) #### Utilisation de jContent depuis Page Composer pour ajouter un document 2 méthodes sont disponibles à choix: ##### a) ajout d'un lien vers le document directement dans l'élément "texte" du contenu standard Avec cette méthode, le lien vers le document est saisi dans le corps du texte. [![upload-doc-ck1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-08/scaled-1680-/upload-doc-ck1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-08/upload-doc-ck1.png) [![upload-doc-ck2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-08/scaled-1680-/upload-doc-ck2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-08/upload-doc-ck2.png) ##### b) ajout du document dans l'élément "fichier" du contenu standard Avec cette méthode, le lien vers le document apparaît après le corps du texte et est précédé d'une icône qui en indique le type (PDF, Word, ...). [![upload-file1b.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-08/scaled-1680-/upload-file1b.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-08/upload-file1b.png) Problème + solution: Avec cette méthode, parfois l'intitulé du lien ne correspond pas au nom du fichier, car Jahia peut lui ajouter des métadonnées (par exemple une mention "Microsost Word..."). Il est heureusement possible de rectifier cet intitulé dans jcontent. [![upload-file2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-08/scaled-1680-/upload-file2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-08/upload-file2.png) [![upload-file3.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-08/scaled-1680-/upload-file3.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-08/upload-file3.png) #### Connaître l'adresse exacte d'un fichier (document ou image) Pour savoir l'adresse complète d'un fichier chargé dans jcontent, il faut procéder ainsi: - afficher les propriétés du fichier et aller dans les options avancées (image ci-dessous) - l'adresse exacte du fichier = **https://www.unil.ch/files/live** + \[chemin\] dans cet exemple, l'adresse de l'image est [https://www.unil.ch/files/live/sites/modelejahia/files/activities/library-stunning-architecture.jpg](https://www.unil.ch/files/live/sites/modelejahia/files/activities/library-stunning-architecture.jpg) [![adresse-fichier.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/adresse-fichier.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/adresse-fichier.png) NB: le lien vers le fichier ne fonctionnera évidemment que si ce fichier a été publié au préalable, et est donc marqué d'un filet vert comme dans cet exemple. Plus d'informations sur le statut de publication: [https://wiki.unil.ch/ci/books/sites-web/page/bases-de-ledition-dans-jahia#bkmrk-edition-et-publicati](https://wiki.unil.ch/ci/books/sites-web-jahia/page/bases-de-ledition-dans-jahia#bkmrk-edition-et-publicati) . \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Gestion du multilinguisme dans Jahia Ce chapitre s'applique uniquement aux sites qui utilisent le multilinguisme, matérialisé par le sélecteur de langue présent sur toutes les pages pour lesquelles il existe une version traduite: [![selecteur-multi.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/selecteur-multi.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/selecteur-multi.png) Lors de l'édition d'un site multilingue, on peut à choix et selon les contenus: - saisir successivement le contenu dans une langue, puis dans l'autre - ou recopier le contenu d'une langue vers l'autre, si cela fait sens (par exemple un titre de page intitulé "Publications" pourra être recopié de français en anglais, car identique dans les 2 langues). [![selecteur-multi-edition.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/selecteur-multi-edition.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/selecteur-multi-edition.png) [![copier-autres-langues.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/copier-autres-langues.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/copier-autres-langues.png) Points importants: - une page n'existe dans une langue qu'à partir du moment où on lui a donné un titre dans cette langue - lors de la publication, ne pas oublier de publier les pages ou les composants dans toutes les langues. [![publier-toutes.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/scaled-1680-/publier-toutes.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-11/publier-toutes.png) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Actualités et événements dans MyUNIL pour les sites Jahia

Cette documentation présente les actualités et événements principalement pour leur utilisation dans les sites Jahia. Pour plus de détails voir le chapitre "[actualités et événements](https://wiki.unil.ch/ci/books/myunil-et-newsunil/chapter/actualites-et-evenements-documentation-publique)" dans la documentation MyUNIL.

### Principe" - Les annonces d'actualités et événements qui sont affichées dans les sites Jahia ne sont pas saisies directement dans l'interface d'édition de Jahia, mais dans le portail MyUNIL. Chaque site Jahia dispose dans MyUNIL d’un canal permettant la publication d’annonces pour des actualités et des événements. - Actualité = annonce sur divers sujets (nouveau projet, nouvelle publication…), non liée à un lieu et à une date. - Evénement = annonce indiquant un lieu et une date (conférence, soutenance de thèse…). Pour un événement organisé en ligne, le lien d'accès est indiqué à la place du lieu. - Lors de la saisie de ces annonces d'actualités ou événements, on spécifie des dates de publication (date de début et de fin de publication), qui vont déterminer la période pendant laquelle ces annonces seront affichées sur la page d'accueil ou la page actualité/événements d'un site Jahia. Une fois arrivée à leur date de fin de publication, elles apparaissent uniquement dans les pages d'archives. [![image-1640677748672.png](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/scaled-1680-/image-1640677748672.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/image-1640677748672.png) Ce principe d'actualités et événements publiés saisis et publiés dans le portail MyUNIL permet de les diffuser de manière plus large que si ces annonces étaient liées à un seul site: - Chaque site peut "relayer" des actualités et événements d'autres sites, par exemple un site de faculté peut afficher des actualités provenant des sites de ses instituts. - Au niveau global de l'UNIL, les sites [L'Actu](https://www.unil.ch/actu/home.html) et [L'Agenda](https://agenda.unil.ch/) permettent de les consulter en un seul endroit. - Toute personne qui a accès au portail MyUNIL peut [proposer une annonce d'actualité ou d'événement](https://wiki.unil.ch/ci/books/myunil-et-newsunil/page/proposer-des-actualitesevenements), même si elle n'a pas accès à l'édition d'un site Jahia. Cette proposition sera transmise pour validation et publication à une personne en charge de la communication. Par contre la personne dont la proposition d'actualité ou d'événement a été publiée ne peut pas la modifier elle-même ultérieurement si elle le souhaite. Elle devra pour cela passer par la personne qui a validé et publié son annonce. - Pour voir les annonces publiées dans un canal: - A partir d'un site Jahia, aller sur sa page "Actualités et événements" (adresse de la page = [https://www.unil.ch/xxx/home/news.html](https://www.unil.ch/xxx/home/news.html) où xxx = l'adresse du site, par exemple [https://www.unil.ch/hec/home/news.html](https://www.unil.ch/hec/home/news.html) pour la Faculté des HEC) et utiliser les liens vers les archives en bas de page. - Directement dans L'Actu et L'Agenda, aller sur la page de recherche (respectivement [https://news.unil.ch/recherche](https://news.unil.ch/recherche) et [https://agenda.unil.ch/recherche](https://agenda.unil.ch/recherche) ) et cliquer sur l'icône V sous le champ "recherche libre" afin d'accéder à la recherche avancée, qui permet de rechercher par canal. - L'accès direct est possible par l'URL du canal, sous la forme [https://news.unil.ch/?channel=xxx](https://news.unil.ch/?channel=xxx) , où xxx = l'adresse du site ou du canal, par exemple [https://news.unil.ch/?channel=hec](https://news.unil.ch/?channel=hec) pour la Faculté des HEC. - Chaque annonce d'actualité ou d'événement est également accessible par un lien permanent figurant tout en bas, sous les mentions d'auteur et dates de publication. ### Droits d'édition Les droits d'édition dans MyUNIL des actualités et événements d'un site web sont attribués en même temps que les droits d'édition de ce site. Toute personne qui veut pouvoir éditer les actualités et événements d'un site doit faire [une demande d'accès à l'édition du site](https://www.unil.ch/ci/acces-edition-site-web) (=accès à l'édition de l'ensemble du site, et non pas accès partiel à l'édition d'une rubrique). ### Marche à suivre pour publier une actualité ou un événement Cette marche à suivre s'adresse aux personnes qui ont déjà les droits d'édition d'un canal dans MyUNIL. Pour les personnes qui n'ont pas encore les droits d'accès ou qui ne sont pas webmasters d'un site mais veulent juste proposer une annonce, voir ci-dessus. ##### 1. Pour débuter la saisie Identifiez-vous sur [MyUNIL](https://my.unil.ch/), puis: [![image-1640679668184.png](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/scaled-1680-/image-1640679668184.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/image-1640679668184.png) ##### 2. Saisir le titre et l’accroche Tenir compte des recommandations d'Unicom: \- titre = maximum 10 mots \- accroche = maximum 50 mots Si vous dépassez ces longueurs, le texte ne sera pas tronqué dans l'affichage détaillé, mais n'apparaîtra que partiellement sur les sites web dans les affichages sous forme de listes. Ensuite saisir le corps du texte. Unicom recommande de ne pas dépasser environ 1500 signes pour un événement, et ne fixe pas de limite pour la longueur d'une actualité. [![image-1640681978783.png](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/scaled-1680-/image-1640681978783.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/image-1640681978783.png) Pour les événements, un certain nombre de rubriques complémentaires permettent la saisie d'informations telles que le type d'événement, le lieu exact, les dates et heures, les intervenants, etc. Seules les rubriques marquées d'une astérisque sont obligatoires. ##### 3. Ajouter une image pour la vignette Pour les actualités, une image est obligatoire pour la rubrique "vignette". Elle n'est pas obligatoire pour la rubrique "image principale", mais vivement recommandée quand même. La vignette sera affichée dans les listes d'actualités, l'image principale sera affichée dans la vue détaillée de l'actualité. Pour les événements, aucune image n'est obligatoire. [![image-1640683975272.png](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/scaled-1680-/image-1640683975272.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/image-1640683975272.png) La taille minimale pour la vignette est de 800 x 600 pixels. Si l'image plus grande, le recadrage est possible. En pratique, il est nécéssaire d'employer une image plus grande que 800 x 600 px pour pouvoir la recadrer et valider cette étape. Recommandation: utiliser une image légèrement plus grande (environ 1000 px de large), mais pas une image démesurée, car cela ralentirait très fortement l'affichage pour les personnes qui visiteront le site. ##### 4. Ajout optionnel de liens et de documents Si souhaité, il est possible d'ajouter des liens vers des sites web ainsi que des documents complémentaires, par exemple au format PDF. Remarque: des liens peuvent également être ajoutés directement dans le corps du texte (point 2 ci-dessus). [![image-1640685432406.png](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/scaled-1680-/image-1640685432406.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/image-1640685432406.png) ##### 5. Finalisation et publication Pour pouvoir publier l'annonce, il faut encore vérifier ses dates de publication et les modifier si nécessaire, puis également spécifier au minimum un mot-clé (indispensable pour permettre de la classer par thèmes dans le système d'actualités/événements). Les dates de publication par défaut sont: \- pour une actualité = une semaine \- pour un événement = la date de fin de l'événement. Une annonce arrivée en fin de publication passe automatiquement en mode archive et ne peut plus être modifiée ! [![image-1640689521123.png](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/scaled-1680-/image-1640689521123.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/image-1640689521123.png) ### Quelques points importants ##### Durée de session et sauvegarde avant publication La durée d'une session pour une saisie d'actualité ou d'événement est limitée dans le temps. Il est donc préférable de rassembler le contenu (texte, images et documents en option) avant de se lancer dans la saisie, puis d'éviter autant que possible de faire une longue pause durant la saisie pour ne pas risquer de perdre le travail en cours. Lors de la saisie d'une annonce assez longue et complexe, nous recommandons de faire une sauvegarde avant publication, comme illustré ci-dessus. Cela permet d'éviter de perdre les données au cas où un blocage de l'application surviendrait lors de la publication, ou également de pouvoir reprendre la saisie après une interruption, par exemple s'il vous manque encore un élément nécessaire avant de publier. ##### Attention aux dates de publication Une annonce d'actualité ou événement apparaîtra sur la page d'accueil ou la page actualité/événements d'un site Jahia uniquement pendant la période définie par ses dates de publication. Une fois arrivée à la date de fin de publication, elle ne peut apparaître que dans les affichages des actualité/événements archivés.

Il n'est pas possible de modifier ni de supprimer une annonce archivée. Si on souhaite la supprimer ou la modifier, on ne peut le faire que pendant sa période de publication.

Il n'est pas possible de "désarchiver" une annonce archivée => il faut prêter attention aux dates de publication lors de la saisie. Remarque: il reste possible de modifier ces dates pendant la période de publication. Si vous avez laissé expirer une annonce et que vous voulez la faire "réapparaître", il faut la recréer à nouveau, en utilisant par exemple du copier-coller depuis l'annonce archivée. ##### Publication différée Voici comment publier ultérieurement, par exemple si on a interrompu la session après la sauvegarde: [![image-1640773299222.png](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/scaled-1680-/image-1640773299222.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/image-1640773299222.png)

Pour les publications en différé, attention aux dates lors de la saisie: La durée de publication par défaut pour une actualité est d'une semaine. Si vous prévoyez d'attendre plusieurs jours entre la saisie et la publication, il faut spécifier une durée de publication plus longue, car si vous ne publiez pas l'actualité avant sa date de fin de publication, elle disparaîtra de votre liste à valider une fois cette date passée.

### Relayer une actualité ou un événement Le système de gestion des actualités et événements dans MyUNIL permet de créer dans un canal une copie d'une annonce publiée dans un autre canal. C'est ce qu'on nomme un relais. Voici comment procéder. [![relais-1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/scaled-1680-/relais-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-01/relais-1.png) [![image-1640700917949.png](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/scaled-1680-/image-1640700917949.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2021-12/image-1640700917949.png) L'annonce relayée sera publiée dans votre canal d'actualités/événements avec les mêmes dates de publication que l'annonce originale. ### Une question ou un problème ? Contacter notre helpdesk par e-mail: en décrivant le problème ou la question aussi précisément que possible: - le nom de votre canal d’actualités ou de votre site - à quelle étape en êtes-vous (saisie, modification d’une annonce déjà publiée) - prendre note des messages d'erreur éventuels - si possible, fournir une capture d’écran. Informations complémentaires: documentation du service "[actualités et événements (MyUNIL)](https://wiki.unil.ch/ci/books/myunil-et-newsunil/chapter/actualites-et-evenements-documentation-publique)". \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Référencement et SEO pour les sites Jahia Vous pouvez optimiser votre site Jahia UNIL pour qu'il soit à la fois bien classé par Google et facile à parcourir. Nous expliquons ici comment faire en sorte que votre site Jahia UNIL soit correctement référencé dans les moteurs de recherche, et comment avoir un certain contrôle sur la manière dont Google va le présenter dans ses résultats de recherche. Les méthodes à utiliser pour y parvenir permettent également de contribuer à la qualité et à l'attractivité de nos sites. ### Pourquoi et comment optimiser son site #### Qu'est-ce que le SEO En matière de moteurs de recherche, on différencie le référencement gratuit du référencement payant: - SEO = Search Engine Optimization = optimisation pour les moteurs de recherche (référencement naturel, gratuit) - ≠ SEA (Search Engine Advertising) = achat d'espaces publicitaires dans les pages de résultats des moteurs de recherche (référencement payant) Le SEO, ou référencement naturel, peut se pratiquer à un niveau élémentaire (=les bases que nous allons voir dans cette documentation), mais aussi à un niveau professionnel, souvent par des agences spécialisées. Les techniques de SEO évoluent au fil du temps pour suivre les changements de l'algorithme de Google. Certaines méthodes valables autrefois ne le sont plus aujourd'hui. Les recommandations faites ici constituent une base indémodable. I l existe de nombreuses méthodes pour réaliser une optimisation SEO. Toutefois certaines ne sont pas forcément applicables à notre contexte et notre infrastructure UNIL. Nous présentons ici uniquement des méthodes qui peuvent être mises en pratique chez nous, sur nos sites Jahia. D'après des chiffres récents, parmi les moteurs de recherche utilisés en Europe, Google a une part de marché d'environ 90%. Les autres (Bing, DuckDuckGo, Qwant, Ecosia etc.) se partagent les 10% restants. #### Nécessité d'optimiser son site Pendant longtemps, les sites d'universités étaient bien classés sur Google sans grand effort. Mais ils ont été progressivement concurrencés par des sites appliquant des recommandations d'optimisation (listings d'universités, écoles privées...). D'où la nécessité aujourd'hui pour les sites d'universités d'appliquer également des recommandations d'optimisation. Ceci se justifie d'autant plus qu'il s'agit de bonnes pratiques en matière d'accessibilité web, de structure et de clarté du contenu: **un site optimisé est un site plus facile à trouver ET à utiliser**. #### Fonctionnement de l'indexation par Google L'index de Google recense actuellement plus de [130'000 milliards de pages](https://searchengineland.com/googles-search-indexes-hits-130-trillion-pages-documents-263378). Entre le moment où Google trouve un nouveau site à indexer ou remarque des modifications sur un site existant et le moment où il va le refléter dans ses résultats de recherche, il peut s'écouler un délai de longueur variable, pouvant atteindre plusieurs mois. Afin d'optimiser le référencement de nos sites Jahia sur Google: - nous les rendons indexables par les moteurs de recherche dès leur ouverture - nous envoyons très régulièrement à Google des cartes de nos sites au format sitemap.xml. Google scanne les sites indexables et suit les liens qu'il y trouve. Ensuite il indexe, évalue et classe les pages. Pour cela, il se base essentiellement sur: - les titres de pages et de sections, et les mots-clés dans le contenu - le respect des bonnes pratiques web - la réputation des sites - les carte des sites que nous lui envoyons. #### Est-ce que votre site est visible et indexé par Google? Pour vérifier, faire la recherche suivante sur Google: *site:\[adresse-du-site\]* elle va retourner comme résultat la liste des pages de ce site indexées par Google. Cette syntaxe simple permet de vérifier rapidement si votre site est indexé par Google, et quelles sont les pages indexées. Elle permet également de vérifier si une page en particulier est indexée, si on utilise son adresse complète comme argument de recherche. Exemple: la requête *site:www.unil.ch/gse* va retourner la liste des pages de ce site indexées par Google: [![indexed.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-12/scaled-1680-/indexed.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-12/indexed.png) ### Les facteurs essentiels pour le référencement #### Identifier les mots-clés importants pour votre site Commencez par recenser les mots clés décrivants vos activités (par ex. *enseignement, recherche*...) et les thèmes qui y sont abordés, généraux (par ex. *urbanisme, glaciers...*) et spécifiques (par ex. *gentrification, pergélisol...*). Utiliser ces mots clés dans les éléments prioritairement pris en compte pour l'indexation: - titres de niveau 1, 2, 3 - méta description - liens dans le contenu - texte en gras dans le contenu - textes alternatifs des images. Ceci doit se faire en respectant une certaine hiérarchie entre ces mots clés, et en évitant la surcharge. Vouloir surcharger une page d'un trop grand nombre de mots clés est contre-productif. Si un mot clé est important pour une page, il est souhaitable qu'il figure dans 2 ou 3 des éléments mentionnés ci-dessus (titres, liens...). Il va naturellement aussi figurer dans le texte, mais il faut éviter de trop fréquentes répétitions. Google considère en effet ceci comme du *spamdexing* (contraction de spam + indexing), qui est sanctionné par un rétrogradage dans les résultats de recherche. #### Utiliser les titres de niveau 1, 2 et 3 Comme dans un traitement de texte qui permet de rédiger des documents avec une hiérarchie de niveaux de titres, il existe la même distinction dans les pages web. Les niveaux de titres vont de 1 (=le plus important) à 6 (=le moins important). Dans les templates Jahia UNIL, nous utilisons les 3 premiers niveaux: - titre de page (=titre de niveau 1) - titre de boîte de contenu (=titre de niveau 2) - titre de paragraphe (=titre de niveau 3) #### Titre de page (=titre de niveau 1) Le titre de la page a une grande importance pour l'indexation par Google, il faut qu'il soit à la fois bref et informatif. Il se retrouve: 1. dans la balise HTML <title> qui est affichée dans l'onglet du navigateur \* 2. sous une forme modifiée dans l'adresse de la page (nom système) 3. dans le menu de navigation 4. avant le début du contenu de la page 5. dans le chemin d'accès ("vous êtes ici") [![titre 1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-12/scaled-1680-/titre-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-12/titre-1.png) \* Dans la balise HTML <title> le titre de la page est complété par un suffixe propre à chaque site. Ce suffixe est par exemple très utile pour les personnes qui vont partager un lien vers une page via un mail ou les réseaux sociaux, ou ajouter la page à leurs favoris (un favori intitulé "Organisation" est moins précis qu'un favori intitulé "Organisation - SSP UNIL"). Ce suffixe contient généralement une forme abrégée du nom du site ainsi que le mot UNIL. Il est ajouté automatiquement à chaque nom de page. Si le suffixe utilisé pour votre site ne vous semble pas adapté ou exact, merci de contacter helpdesk@unil.ch pour demander sa rectification. Précisions au sujet de l'édition du titre de page: 1. On le saisit et on le modifie ici 2. Si on modifie le titre d'une page existante, ne pas oublier de mettre à jour le nom système avec le bouton "copier le titre". Attention: ⚠️ Nous déconseillons les modifications manuelles de ce nom système. Si le nom système d'une page contient autre chose que des lettres non accentuées, des chiffres et des tirets, l'adresse de cette page peut poser problème pour le référencement et les liens. 3. L'option "titre long" permet de spécifier sur une page un titre plus long que celui qui apparaît dans le menu de navigation. Si cette forme longue existe, c'est aussi elle qui est prise en compte par Google. Si on emploie cette option "titre long", il faut impérativement lui conserver une similitude importante avec le titre court afin de ne pas égarer les visiteurs. Par exemple: il faut éviter à tout prix le cas d'une page qui aurait "contact" comme titre court et "recherche" comme titre long. [![titre page.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-12/scaled-1680-/titre-page.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-12/titre-page.png) #### Intertitres (= titres de niveaux 2 et 3) En complément du titre de page (niveau 1), il faut autant que possible structurer la page au moyen des titres de compsants de contenu (=titres de niveau 2) et des titres de paragraphe (=titres de niveau 3). Niveau 2: tous les [composants pour les pages de contenu](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-de-contenu-jahia "Composants de contenu Jahia") permettent la saisie d'un titre. Niveau 3: dans les composants "contenu standard" et "contenu responsive", le style *sous-titre* de l'éditeur visuel permet de structurer un texte d'une certaine longueur.
Gérer les URLs (liens de page) personnalisées Par défaut, le lien d'une page créée va avoir comme URL le chemin de votre page + le nom système, par exemple [https://unil.ch/ci/home/menuinst/catalogue-de-services/communication-et-web/sites-web.html](https://unil.ch/ci/home/menuinst/catalogue-de-services/communication-et-web/sites-web.html). Vous pouvez définir des liens personnalisés pour faciliter la transmission des pages, par exemple [https://unil.ch/ci/web](https://unil.ch/ci/web) est une URL personnalisée de la précédente page. #### Rajouter une URL personnalisé 1\. Accéder aux options d'édition de la page [![Capture d’écran 2023-04-04 à 13.21.00.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-04/scaled-1680-/capture-decran-2023-04-04-a-13-21-00.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-04/capture-decran-2023-04-04-a-13-21-00.png) 2\. Cliquer sur les ... verticaux puis "gérer les URL personnalisées" [![URL_1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-04/scaled-1680-/X8iurl-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-04/X8iurl-1.png) 3\. Rajouter l'URL personnalisée : 1. Entrer l'URL que vous souhaitez, précédée d'un "/", par exemple "/web" pour l'adresse "unil.ch/ci/web" 2. Définir la langue de l'URL 3. Sauvegarder

Vous pouvez configurer plusieurs URLs pour une seule page, mais deux pages ne peuvent pas avoir la même URL

[![URL_3.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-04/scaled-1680-/url-3.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-04/url-3.png) #### Gérer toutes les URLs personnalisées de son site Jahia vous propose une interface pour vérifier et modifier toutes les URLs personnalisées, pour ceci : 1. Cliquer sur JContent 2. Cliquer sur Extensions [![Vanity_url_1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-04/scaled-1680-/vanity-url-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-04/vanity-url-1.png) 3\. Cliquer sur SEO puis URL personnalisées [![Vanity_url_2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2023-04/scaled-1680-/vanity-url-2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2023-04/vanity-url-2.png)
#### Utiliser la méta description Cette balise figure dans l'en-tête du document en mode source et a la syntaxe suivante: *<meta name="description" content="Description de la page" />* Elle est très importante pour Google, qui l'utilise pour l'affichage des résultats de recherche. Si cette balise n'est pas remplie pour une page, Google utilisera pour décrire cette page: - le plus souvent une formule standard que nous avons paramétrée comme valeur par défaut, qui se présente ainsi: *page \[titre de page \] du site \[nom du site\] hébergé par l'Université de Lausanne* - ou aussi parfois une partie de son contenu, sans qu'on puisse contrôler laquelle (tantôt le début du contenu, tantôt un extrait quelconque). La longueur de la meta description est généralement de 150 à 160 caractères => inutile de dépasser 200 caractères. Elle ne sera affichée intégralement que si elle est courte. [![meta description.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-12/scaled-1680-/meta-description.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-12/meta-description.png) Il est possible d'éditer ce champ meta description pour toutes les pages de contenu. Par contre pour la page d'accueil, seuls les administrateurs Jahia peuvent modifier la meta description => merci d'envoyer la vôtre à helpdesk@unil.ch en précisant l'adresse de votre page d'accueil, et nous l'intégrerons pour vous.

NB: il faut saisir la meta description uniquement au niveau de la page, et non pas pour chaque composant de la page.

### Autres facteurs et bonnes pratiques #### Liens entrants, liens internes et liens sortants **Pour les lien entrants** (= backlinks) Essayer d’établir ou faire établir des liens vers votre site pour améliorer son ranking dans les résultats de recherche Google ...mais seulement à certaines conditions: - Eviter la surabondance de liens (=spamdexing) - Ces liens auront de la valeur uniquement s’ils proviennent d’autres sites traitant du même sujet - Plus ces autres sites seront eux-mêmes bien référencés, plus leurs liens vers votre site auront de la valeur **Pour les liens internes** (=liens vers d'autres pages de votre site) Ces liens aussi sont utiles pour le référencement, mais là aussi à certaines conditions - Eviter la surabondance de liens internes en tous sens - Créer des liens internes renvoyant autant que possible vers des pages de la même rubrique (page fille, page mère, page soeur) **Pour les liens sortants** (=liens vers d'autres sites) Les liens sortants ne doivent pas êtres placés dans les zones de la navigation du site (=pas dans les menus), mais dans les zones de contenu. #### Réseaux sociaux Si vous avez des comptes sur les réseaux sociaux => partager vos pages, actualités et événements. Si possible inclure dans votre post un #unil et une image. Le site [https://unil.ch/socialmedia](https://unil.ch/socialmedia) propose informations et ressources pour une présence institutionnelle sur les réseaux sociaux. Il recense également les comptes UNIL existants sur ces réseaux. #### Actualités/événements MyUNIL Utiliser les [actualités/événements via MyUNIL](https://wiki.unil.ch/ci/books/sites-web-jahia/page/actualites-et-evenements-dans-myunil-pour-les-sites-jahia "Actualités et événements dans MyUNIL pour les sites Jahia"). Penser à y inclure des liens vers votre site s’il y a lieu. ### Ressources \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Compléments à la documentation Jahia Des sites d'exemple et des liens utiles complètent la documentation. ### Sites d'exemple - [Site exemple Jahia](https://www.unil.ch/exemplejahia/fr/home.html) : liste des composants disponibles - [Site modèle Jahia](https://www.unil.ch/modelejahia/fr/home.html) : exemple de site fictif qui utilise ces composants Voir aussi les [listes des sites Jahia UNIL](https://www.unil.ch/ci/fr/home/menuinst/catalogue-de-services/communication-et-web/sites-web/acceder-au-service--sites-web/listes-des-sites-web-heberges.html) actuellement en production. ### Liens utiles En complément à cette rubrique "Documentation Jahia", certains points concernant également les sites Jahia se trouvent - dans la rubrique [Ressources communes pour Jahia et WordPress](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/ressources-communes-pour-jahia-et-wordpress-unil-documentation-publique) de ce wiki - et sur le site du Ci: [informations générales sur l’hébergement web](https://www.unil.ch/ci/fr/home/menuinst/catalogue-de-services/communication-et-web/sites-web/acceder-au-service--sites-web.html) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Questions fréquentes sur l'édition Jahia Quelques questions ou problèmes courants que vous rencontrerez peut-être lors de l'édition de votre site Jahia UNIL. #### 1. Editer un site Jahia hors du réseau UNIL: le VPN UNIL est nécessaire Pour des raisons de sécurité, l’édition des sites web Jahia UNIL peut s’effectuer: - soit depuis le réseau de l’UNIL (connexion par câble réseau ou Wi-Fi eduroam) - soit si vous êtes hors de l’UNIL, en employant une connexion sécurisée par le [client VPN Ivanti Secure Access](https://www.unil.ch/ci/reseau-unil-chez-soi) (qui s'appelait autrefois Pulse Secure)

Important: L’utilisation de l’application client *Ivanti Secure Access* est requise, le simple accès à la passerelle web *crypto.unil.ch* sans avoir lancé Ivanti ne donne pas accès à toutes les fonctionnalités d’édition de Jahia.

[![Sans titre.001.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/olusans-titre-001.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/olusans-titre-001.png) #### 2. Vous avez par erreur utilisé le bouton "Demander une publication" au lieu de "Publier maintenant" ? Vous vouliez publier une modification dans un site Jahia et vous avez par erreur utilisé le bouton "Demander une publication" au lieu de "Publier maintenant" ? [Voici comment terminer le processus de publication](https://wiki.unil.ch/ci/books/sites-web-jahia/page/bases-de-ledition-dans-jahia#bkmrk-choisir-le-bon-bouto) #### 3. Les menus de gauche de votre site ne s'affichent plus ? Certaines pages de votre site censées avoir des sous-pages n'affichent plus ces liens dans la navigation de gauche ? Il s'agit d'un problème temporaire, qui peut survenir de manière aléatoire. Si vous rencontrez ce cas, vous n'avez rien de particulier à faire si ce n'est de patienter. La mémoire cache qui gère l'affichage des menus est actualisée toutes les 2 heures durant la journée, donc ce problème sera automatiquement corrigé dans un délai de 2h maximum. [![image-1652705258332.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-10/scaled-1680-/image-1652705258332.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-10/image-1652705258332.png) #### 4. Lors d'un changement dans les menus de navigation, délai pour actualiser l'affichage Afin d’offrir aux personnes qui visitent nos sites un affichage aussi rapide que possible, nos serveurs utilisent plusieurs systèmes de mémoire cache. Une des caractéristiques de ce système est que lorsque vous modifiez des éléments dans les menus de navigation (pages ajoutées, supprimées, renommées, déplacées), ces changements ne sont pas immédiatement visibles en ligne après publication. **Il peut y avoir un délai allant de quelques minutes à 4 heures maximum avant que certaines modifications ne soient visibles en ligne.** Pour tester, si vos modifications ont été correctement effectuées et publiées, vous devez les vérifier en mode "En ligne" et non en mode "Consultation". - Si le mode "En ligne" affiche la page sélectionnée et le menu de navigation correctement, il suffit d’attendre la mise à jour du cache comme expliqué ci-dessus. - Si en revanche, le mode "En ligne" n’affiche pas les modifications souhaitées, une ou plusieurs étapes de publication n’ont pas été effectuées ou terminées. [![mode-en-ligne.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-10/scaled-1680-/mode-en-ligne.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-10/mode-en-ligne.png) #### 5. Edition non disponible pendant les travaux de maintenance Vous voulez éditer votre site Jahia, mais vous ne voyez pas de lien "Edition" dans le pied de page ? Ceci signifie que des travaux de maintenance sont en cours sur les serveurs. Sauf s’il s’agit d’une panne ou d’un redémarrage en urgence des serveurs, nous vous informons à l’avance des travaux de maintenance par la liste de diffusion email *jahia\_redactors*, à laquelle toute personne ayant des droits d’édition sur un site Jahia est automatiquement abonnée. [![image-1647616058614.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-10/scaled-1680-/image-1647616058614.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-10/image-1647616058614.png) #### 6. Problèmes de publication de certains contenus et documents Depuis septembre 2023, notre serveur Jahia rencontre parfois des problèmes lors de la publication de pages ou de documents. Dans certains cas, le délai avant qu’une publication ne soit visible en ligne peut être de plusieurs heures. S'il n'y a pas d'urgence, **vérifier le lendemain si la publication s'est faite durant la nuit** lors des opérations de maintenance effectuées sur le serveur. Ne pas oublier de recharger la page lors de la vérification. Si vous ne souhaitez pas attendre le lendemain pour vérifier si la publication s'est faite, voici quelques propositions de solutions pour tenter de résoudre ces problèmes: **6.1. Cas d'un fichier publié mais qui retourne une erreur 404 ou qui n'affiche pas sa taille en Ko en ligne** Solution possible : 1. télécharger le fichier depuis le mode "Aperçu/Preview", 2. dans JContent > Medias, utiliser l'action "Remplacer par" dans le menu déroulant, sélectionner le fichier téléchargé à l'étape précédente et publier uniquement le fichier. **6.2. Cas d'un contenu qu'on a publié mais qui n'est pas en ligne** Solutions possibles (1 solution par ligne) : - dépublier puis republier le contenu ; - contrôler la présence éventuelle d'une condition de visibilité/invisibilité ; - créer sur la même page un nouveau contenu par copier/coller, le publier, puis en cas de succès supprimer l'ancien ; - pour un contenu standard, créer un nouveau contenu à partir de zéro en copiant/collant le code source HTML, le publier, puis en cas de succès supprimer l'ancien. **6.3. De manière générale** Ces solutions ne fonctionnent pas à chaque fois. Si le problème persiste, merci de nous le signaler par mail à *helpdesk@unil.ch* en précisant les informations qui nous permettent de le localiser : \- adresse de la page concernée, \- si nécessaire, adresse des documents PDF ou images. Nous sommes désolés pour ce dysfonctionnement du système de publcation et pour le supplément de travail qu'il vous occasionne. Nous travaillons activement à la recherche d'une solution. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web/chapter/jahia-unil-documentation-publique) \] # Release notes Jahia Voici l'historique des dernières mises à jour effectuées sur nos serveurs de production Jahia UNIL. 12 juin 2025 - Correction: - Le lien permanent vers le détail d'une actualité/d'un événement fonctionne uniquement dans le cas où l'actualité/l'événement est/a été publié. 7 juin 2025 - Nouveautés: - Site web de la [Faculté de théologie et de sciences des religions](https://www.unil.ch/ftsr/fr/home.html) 26 mai 2025 - Nouveautés: - Logo Unil version 2025 23 avril 2025 - Améliorations: - Liens de type "hreflang" pour toute page comme optimisation le SEO - Corrections: - Liste des membres d'une faculté dans le composant avancé 'recherche académique' 17 avril 2025 - Améliorations: - Migration majeure à Jahia 8.1 - Interface d'édition Content Editor 4.14 de Jahia 27 février 2025 - Améliorations: - - ajout du réseau social Mastodon 20 février 2025 - Améliorations: - - ajout des réseaux sociaux Threads et Bluesky 16 janvier 2025 - Corrections techniques: - - correctif de sécurité pour Tomcat 12 décembre 2024 - Corrections techniques: - - version allégée du fichier sitemap au format XML d'un site pour SEO 5 décembre 2024 - Améliorations: - - modification des liens dans l'en-tête et la bannière Unil 14 novembre 2024 - Corrections techniques: - - version allégée du fichier sitemap au format XML d'un site pour SEO 7 novembre 2024 - Corrections techniques: - - traductions de labels - balise OpenGraph "og:title" avec suffixe de site pour SEO - header "Last-Modified" dans la réponse uniquement pour un élément publié - cas vide pour le menu déroulant "Plus d'informations/Profils" pour un site avec plusieurs langues - cas vide pour les composants "Une actualité" et "Un événement" pour un site avec plusieurs langues - suppression de la bannière de site "samemes" 4 septembre 2024 - Nouveauté: - - nouvel outil de consentement aux cookies OneTrust 21 août 2024 - Corrections: - - lien vers la page en anglais du site de la Faculté de théologie et des sciences des religions dans l'en-tête des sites : - erreur 503 en édition suite à un timeout - désactivation de la génération d'images au format WebP pour les composants card-design, responsive, liste filtrée et galerie 10 juillet 2024 - Améliorations: - option pour désactiver le lien d'abonnement pour le composant RSS-Atom - génération d'images au format WebP pour les composants card-design, responsive, liste filtrée et galerie - Corrections: - - correctif de sécurité pour Spring Web CVE-2024-22243, CVE-2024-22259 et CVE-2024-22262 - ajout d'un lien vers le moteur de recherche DuckDuckGo dans la page d'erreur 404 12 juin 2024 - Améliorations: - adaptations à l'évolution de la plateforme des actualités et des événements - optimisation des ressources CSS et Javascript - chargement différé pour certaines images en page d'accueil (logos, card-design, dernières actualités) 2 mai 2024 - Nouveautés: - nouveau logo pour le [département de géologie du Muséum cantonal des sciences naturelles](https://www.unil.ch/mcg/fr/home.html "MCG") - recherche interne des sites via DuckDuckGo - Améliorations: - modification des liens dans la bannière Unil - Corrections: - mise en page du composant 'card-design' en 2 colonnes avec Firefox - correctif de sécurité pour Spring Web CVE-2024-22243 et CVE-2024-22259 - remplacement des liens du domaine 'unil.ch' vers le domaine 'www.unil.ch' 21 mars 2024 - Nouveautés: - ajout du réseau social Threads - logo HES-SO Valais [https://www.hevs.ch](https://www.hevs.ch) comme partenaire - logo TheSense [https://www.the-sense.ch](https://www.the-sense.ch) comme partenaire 7 mars 2024 - Améliorations: - Interface d'édition Content Editor 4.4 de Jahia 15 février 2024 - Nouveautés: - logo CIVIS [https://www.unil.ch/international/fr/home/menuguid/civis.html](https://www.unil.ch/international/fr/home/menuguid/civis.html) comme partenaire - intégration de l'outil Google Tag Manager 25 janvier 2024 - Corrections: - nouvelle icône du réseau social X-Twitter - lien pour l'annuaire en ligne [https://annuaire.unil.ch](https://annuaire.unil.ch/) 17 janvier 2024 - Améliorations: - nouveau logo PRME [https://www.unprme.org](https://www.unprme.org) comme partenaire - Corrections: - nouveau lien pour l'annuaire en ligne [https://annuaire.unil.ch](https://annuaire.unil.ch/) - affichage des descriptions pour les contrats et mandats dans le composant 'recherche académique' 19 décembre 2023 - Corrections: - correctif de sécurité pour JSON-Java CVE-2023-5072 21 novembre 2023 - Corrections: - mise à jour de la base de données du CMS Jahia 31 août 2023 - Améliorations: - mise à jour de la base de données du CMS Jahia 24 août 2023 - Corrections: - correctif de sécurité Apache Jackrabbit RMI CVE-2023-37895 - suppression de l'ancienne plateforme des actualités et des événements 29 juin 2023 - Corrections: - affichage des événements proposés en édition triés selon leurs dates d'événements - affichage de l'heure d'un événement qui est décalé de 2 heures - désactivation du téléchargement forcé de fichiers pour les composants 'Contenu standard', 'Tableau' et 'Multi-usage' 21 juin 2023 - Nouveautés: - nouvelle plateforme des actualités et des événements - Améliorations: - téléchargement forcé de fichiers pour les composants 'Contenu standard', 'Tableau' et 'Multi-usage' - Corrections: - liste des facultés en anglais 4 mai 2023 - Corrections: mise à jour de sécurité 14 mars 2023 - Corrections: configuration de l'éditeur WYSIWYG CKeditor 9 mars 2023 - Améliorations: - nouveau logo pour le Musée cantonal de géologie - effet hover sur les éléments du composant card design - adaptation à l'outil ContentEditor 4.0 Jahia 23 janvier 2023 - Corrections: règles internes de réécriture 17 janvier 2023 - Améliorations: augmentation de la taille maximale à 5 Mo d'un document pour le composant avancé de formulaire 21 novembre 2022 - Améliorations: - mise à jour de librairies - message en édition pour indiquer que le composant "image" en page d'accueil n'a plus d'image référencé - personnalisation de l'image en fond pour le login Jahia - Corrections: - suppression définitive du formulaire de contact dans les pages prédéfinies, car ce dernier a été abandonné en août 2022 - correctif de sécurité Apache Shiro CVE-2022-40664 - correctif de sécurité Apache Commons-text CVE-2022-42889 - limitation du nombre de caractères à afficher pour le titre des actualités et les événements à choix en édition - génération du fragment pour une image dans un composant de galerie - dépendance de cache pour le composant avancé de contenu filtré - affichage de type liste pour le composant avancé de contenu filtré 21 octobre 2022 - Migration majeure à Jahia 8 15 septembre 2022 - Améliorations: nouvelles fonctionnalités pour le composant avancé de contenus filtrés - Corrections: suppression du formulaire de contact par défaut des sites Jahia \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-pre-refonte-web-documentation-publique) \] # Jahia UNIL post refonte web - Documentation publique **EN CONSTRUCTION** - Documentation pour les sites Jahia qui utilisent déjà le nouveau design post refonte web 2024 (site de la Direction et des services centraux, sites des facultés, instituts et centres qui ont démarré leur migration) # Introduction à Jahia #### Qu'est-ce que Jahia ? Jahia est un CMS, ou content management system : c'est une application web permettant de créer et mettre à jour des sites web. Il existe de nombreux CMS permettant de répondre à différents besoins. A l'UNIL, nous employons Jahia pour réaliser nos sites web institutionnels : services, facultés, prestations, etc. WordPress est utilisé en complément pour d'autres types de sites (événements, groupes de recherche, blogs...) La documentation figurant dans ce wiki concerne uniquement la version de Jahia employée à l'UNIL et les templates et composants développés à l'UNIL. Elle n'est pas pertinente pour des personnes qui chercheraient un mode d'emploi Jahia global à employer hors du contexte UNIL. #### Que pourrez-vous éditer dans votre site Jahia ? Les différents sites web institutionnels de l'UNIL doivent clairement pouvoir être reconnaissables comme faisant partie d'un ensemble. Pour cela ils font auppel au même design et utilisent les mêmes modèles de page et composants de contenus : tableaux, boutons, galeries d'images etc. Par conséquent, ils vont partager plusieurs éléments communs, au niveau structurel, visuel et fonctionnel : en-tête, pied de page, navigation, styles etc. Les aspects concernant la structure et la mise en page sont décrits dans la page [structure et design des sites web Jahia UNIL](https://wiki.unil.ch/ci/books/sites-web-jahia/page/structure-et-design-des-sites-web-jahia-unil "Structure et design des sites web Jahia UNIL"). Voici ce que vous pourrez éditer dans votre site Jahia : - structure du site, contenu des pages à l'aide de plusieurs composants (texte, tableau, galerie, formulaire...) - gestion des liens hypertextes et mise en forme du contenu - gestion des images et des documents à télécharger (PDF, Word...) - insertion de certains contenus externes (actualités et événements saisis dans MyUNIL, publications Serval, vidéos RecUNIL ou YouTube...) - création et gestion de formulaires (pour contacts et inscriptions) - statut des pages: brouillon ou publiées, visibles ou masquées #### Principe de l'imbrication : pages > composants > éléments Un site web Jahia est composé d'un ensemble de pages, qui sont elles-mêmes composées de composants de contenu, et ces composants sont une addition d'éléments de contenu.
#### Les composants de contenu Il existe plusieurs types de composants qui peuvent voisiner sur une page, comme dans cet exemple où 3 composants différents sont utilisés : - texte - teasers avec texte - tableau [![structure-page.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/Esxstructure-page.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/Esxstructure-page.png) #### Edition et publication : 2 étapes distinctes Les ajouts ou modifications de contenu dans les sites Jahia ne sont pas publiés immédiatement, la publication est un processus distinct qu'il faut lancer manuellement. Ceci permet de compléter et relire une nouvelle page ou un nouveau contenu avant de le rendre visible pour tout le monde. #### Possibilité de masquer une page ou un contenu temporairement Jahia permet de masquer temporairement une page ou un contenu si on souhaite le rendre temporairement non visible mais qu'on veut le garder pour un usage ultérieur. Pour cela il ne faut pas dépublier ce contenu, mais agir sur sa propriété de visibilité. #### Formulaires Un composant "formulaire" permet d'ajouter sur une page un formulaire d'inscription ou de contact. Les données récoltées au moyen de ce formulaire sont consultables dans l'interface d'édition de Jahia, et sont également envoyées par email à l'adresse mail spécifiée dans les paramètres du formulaire. #### Pages ou rubriques protégées par mot de passe En option, il est possible de restreindre la consultation d'une page ou d'une rubrique (=une page et ses sous-pages) à un groupe de personnes qui devront s'idenfier par mot de passe. Ce mécanisme n'est applicable que pour des groupes de personnes disposant d'un compte UNIL, et permet ainsi de créer si nécessaire une partie "intranet" dans un site Jahia. Son activation n'est pas possible directement dans l'interface, il faut en faire la demande au helpdesk. #### Référencement Jahia permet également de travailler à un référencement efficace du site, tant au niveau de sa structure (arborescence, niveaux de titres dans les pages) que de la saisie de méta descriptions et de textes alternatifs. Nous envoyons régulièrement aux principaux moteurs de recherche la liste des pages de nos sites Jahia. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique "Jahia UNIL post refonte web - Documentation publique") \] # Structure et design des sites web Jahia UNIL

EN CONSTRUCTION

- Pendant la construction de cette page, merci de vous référer aux slides 8 à 23 de cette présentation : [formation Jahia refonte web](https://wp.unil.ch/webci6/files/2025/04/formation-refonte-web-unil-1-5-print.pdf) - Voir aussi la [liste des composants](https://wiki.unil.ch/ci/books/sites-web-jahia/page/liste-des-composants-jahia) et la [taille des images](https://wiki.unil.ch/ci/books/sites-web-jahia/page/taille-des-images-dans-ledition-jahia). Ce document explique la structure des sites et pages web Jahia sur lesquels est basée la présence web institutionnelle de l'UNIL. ### Structure des sites Nos sites institutionnels sont basé sur un structure arborescente à plusieurs niveaux : - niveau 0 = page d'accueil - niveau 1 = landing pages - niveau 2 et + = basic pages A chacun de ces niveaux correspond un template (ou modèle de page). C'est l'emplacement d'une page dans la structure du site qui va automatiquement déterminer le template qui lui sera appliqué. [![arbo-site.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/arbo-site.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/arbo-site.png) Certains éléments sont communs à tous les templates d'un site, notamment l'en-tête et le pied de page. Chaque template peut accueillir différents zones de contenu. Certaines de ces zones sont identiques dans tous les templates, et d'autres zones diffèrent d'un template à l'autre. Il existe aussi des zones optionnelles, comme par exemple "continuer ma lecture" en bas de page. [![structure-page.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/structure-page.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/structure-page.png) ### Structure des pages Home page [![structure-home.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/structure-home.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/structure-home.png) Landing page [![structure-landing.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/structure-landing.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/structure-landing.png) Basic page [![structure-basic.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/structure-basic.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/structure-basic.png) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Bases de l'édition dans Jahia ### L'interface d'édition Se connecter [![modif doc actuelle.023.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/modif-doc-actuelle-023.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/modif-doc-actuelle-023.png) Se déconnecter [![modif doc actuelle.024.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/modif-doc-actuelle-024.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/modif-doc-actuelle-024.png) Edition des pages: **Page Composer** [![page-composer.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/page-composer.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/page-composer.png) Gestion des images et documents: **jContent** [![jcontent.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/jcontent.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/jcontent.png) ### Les interactions de base 3 actions fréquentes dans la manipulation des pages et des composants : - glisser/déposer, pour déplacer une page dans la structure du site ou un composant dans une page - clic droit, pour accéder au menu contextuel - bouton "+ ajouter un composant" au bas de chaque page, pour ajouter un nouveau composant sur la page ### Edition et publication = étapes distinctes L'édition d'une page ou d'un composant (ajout, modification, suppression) n'est pas directement visible en ligne par les personnes qui visitent le site. Il faut ensuite publier ces modifications. Avant de publier, on peut optionnellement utiliser le **mode "aperçu"** pour vérifier que les changements effectués correspondent à notre attente. Ce mode affiche dans un nouvel onglet une prévisualisation de la page avant sa publication. [![mode-apercu.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/mode-apercu.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/mode-apercu.png)Ensuite on peut passer à la publication : [![publication-jahia.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/publication-jahia.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/publication-jahia.png) #### Statut de publication L'affichage du statut de publication est visible en haut à droite de chaque page : [![statut-publication.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/statut-publication.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/statut-publication.png) Les suppressions de contenus, de pages, images ou documents doivent également être publiées : la publication achève le processus de suppression. Un élément supprimé mais "non publié après suppression" reste visible en ligne. ### Masquer temporairement un contenu Jahia permet de masquer temporairement un contenu dans une page, par exemple en le rendant non visible à partir d'une certaine date. Ceci permet de conserver certains contenus que l'on souhaite rendre provisoirement invisibles pour les visiteurs du site, en gardant l'option de pouvoir à nouvau les rendre visibles ultérieurement. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique "Jahia UNIL post refonte web - Documentation publique") \] # Liste des composants Jahia ### Liste des composants disponibles pour éditer les pages Les différents composants sont répartis en catégories, en fonction de leur caractéristiques communes. [![liste-composants.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/liste-composants.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/liste-composants.png) Actuellement les composants pour l'affichage des publications (Serval/Iris) et des profils scientifiques (Unisciences/Iris) ne figurent pas encore dans ce tableau car ils sont en cours de développement et/ou d'adaptation. #### Bouton "ajouter un composant"
**Groupe** **Composant**
Contenu[Texte](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-contenu-texte)Permet d’ajouter du contenu de type textuel, avec des options de mise en forme simples. Il peut être utilisé pour structurer l’information sur une page à l’aide de titres, paragraphes, listes et liens.
Formulaire[Formulaire](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-formulaire-formulaire)Permet d’ajouter un formulaire simple sur une page de votre site, par exemple pour collecter des inscriptions, des retours ou des questions.
Media[Audio](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-media-audio) Permet d’ajouter un lecteur audio directement dans une page du site. Il est conçu pour mettre à disposition un podcast ou une playlist.
[Flux RSS/Atom](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-media-flux-rssatom) Permet d’afficher automatiquement les dernières actualités ou contenus provenant d’un flux RSS externe.
[Galerie d'images](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-media-galerie-dimages)Permet d’afficher plusieurs images liées à un même sujet, dans un format visuel attrayant. Il est particulièrement utile pour montrer une série de photos ayant un sens éditorial (événement, ambiance, portraits, lieux…).
[Image(s)](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-media-images)Permet d’insérer une ou deux images côte à côte dans une page.
[Plan](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-media-plan)Permet d’ajouter une carte interactive centrée sur le campus de l’UNIL, pour situer des bâtiments, des accès ou d’autres informations géolocalisées. Il s’appuie sur Planète UNIL.
[SVG](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-media-svg) Permet d’ajouter une illustration vectorielle dans une page web. Il est particulièrement adapté aux pictogrammes, schémas simples ou illustrations légères.
[Social wall](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-media-social-wall)
[Vidéo](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-media-video) Permet d’intégrer facilement une vidéo dans une page web, que ce soit pour illustrer un contenu, enrichir une information ou proposer un contenu audio-visuel de l’UNIL. Il accepte plusieurs plateformes (YouTube, Vimeo, REC UNIL, av.unil.ch(s'ouvre dans un nouvel onglet), Play RTS).
Mise en page[Accordéon](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-mise-en-page-accordeon) Permet d’afficher du contenu de manière compacte et structurée, en le répartissant dans des sections repliables. Il aide à organiser les informations longues ou denses, tout en évitant de surcharger la page visuellement.
[Onglets](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-mise-en-page-onglets) Permet d’afficher du contenu de manière compacte et structurée, en le répartissant dans des onglets. Il aide à organiser les informations longues ou denses.
[Tableau](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-mise-en-page-tableau) Permet d’organiser de façon concise et lisible un ensemble d’informations sur une page. C’est un outil idéal pour structurer des contacts, des prestations ou des liens utiles de manière compacte et efficace.
Navigation[Bouton](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-navigation-bouton) Permet de créer un appel à l’action clair et visible sur une page, comme par exemple "S'inscrire", "En savoir plus" ou "Télécharger". Il est conçu pour orienter la navigation de l’utilisateur vers un lien interne ou externe.
[Groupe de pages](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-navigation-groupe-de-pages) Permet de créer une liste de liens claire et structurée vers des pages internes ou des ressources externes. Il est conçu pour mettre en valeur un ensemble de contenus liés, sous forme de blocs de navigation facilement identifiables.
Ressources[Citation](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-ressources-citation)Permet de mettre en valeur une citation d’une personne (avec photo, nom, fonction) afin de renforcer un message ou d’illustrer une information.
[Groupe de liens](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-ressources-groupe-de-liens) Permet d’afficher un ensemble de liens contextuels (internes, externes ou vers des documents), sous forme de bloc bien délimité. Ce composant est conçu pour compléter un contenu principal, en orientant les utilisateurs vers des ressources utiles.
[Interview](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-ressources-interview) Permet de présenter une citation forte, une personne mise en avant (avec photo, nom, fonction), et un jeu de questions-réponses sous forme d’accordéon.
Teasers[Liste filtrée](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-teasers-liste-filtree "Composant Jahia > Teasers > Liste filtrée")
[Teasers avec icône](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-teasers-teasers-avec-icone) Permet de créer une liste de liens rapides, chacun accompagné d’une icône reconnaissable. Ce type de teaser est particulièrement adapté pour orienter l’utilisateur vers des pages pratiques, des rubriques spécifiques ou des actions fréquentes. Il facilite la navigation.
[Teasers avec texte](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-teasers-teasers-avec-texte) Permet de rediriger vers d'autres pages. Il peut s'agir de pages enfants, d'autres pages du site, voire de pages de sites externes. Ce composant permet donc de créer une liste de liens visuellement reconnaissables. Chaque teaser combine un titre, un court descriptif et un lien, c’est un excellent outil pour créer des accès rapides et lisibles vers des pages de référence ou des contenus complémentaires.
[Teasers de publication](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-teasers-teasers-de-publication) Permet de mettre en avant une publication ou un contenu éditorial par un teaser visuel vertical composé d’une image, d’un titre et d’un lien. Il est conçu pour attirer l’attention sur un contenu publié – comme une page dédiée à un magazine, un article de fond, une archive – qu’il soit interne ou externe à l’UNIL.
[Teasers externes verticaux](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-teasers-teasers-externes-verticaux)Permet de mettre en avant jusqu’à 6 contenus externes à l’UNIL, en lien avec la vie ou l’image de l’université. C’est un outil idéal pour présenter une sélection d’articles, d’interviews, de reportages ou d’interventions médiatiques concernant l’UNIL tout en respectant une mise en page harmonieuse.
Text et media[Highlight](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-texte-et-media-highlight) Permet de valoriser un élément cliquable sur les pages de niveau 1 (landing). Il peut s'agir aussi bien de pages filles, que d’autres pages du site ou même des pages de sites externes.
[Texte et image](https://wiki.unil.ch/ci/books/sites-web-jahia/page/composants-jahia-texte-et-media-texte-et-image "Composant Jahia > Texte et média > Texte et image")
#### Bouton "ajouter un composant news et agenda" Pour intégrer des actualités ou événements sur une page, quatre composants sont disponibles. Ils s’appuient tous sur les informations remplies lors de la création de l’actualité ou de l'événement, mais proposent deux mises en page différentes.
Teasers d'actualités en vedette- Affichage en grille : une actualité mise en avant à gauche, trois autres à droite - Idéal pour valoriser un contenu important en le mettant en avant visuellement - Composant à privilégier pour les landing pages (niveau 1)
Teasers d'actualités verticaux- Affichage en grille (jusqu’à 6 éléments, 2 lignes de 3) - Format compact et lisible pour présenter une sélection d’actualités - Possibilité de configurer un lien pour le composant
Teasers d'événements verticaux - Affichage vertical en colonnes (max 3 ou 6 événements) - Permet l'ajout d'un titre (H2) optionnel - Permet l'ajout d'une description (max 360 caractères) - Permet de filtrer les événements par canal et type, langues, mots clés, type , et de choisir une sélection automatique ou manuelle - Filtrage par canal (obligatoire), vous pouvez sélectionné un ou plusieurs canaux, y compris des canaux dont vous n'êtes pas responsable - Filtrage par type d'événements, vous pouvez utiliser cette option pour mettre en valeur un contenu particulier comme les séminaires de votre unité par exemple
Teasers d'événements en vedette - Affichage en grille avec une mise en avant visuelle du premier événement (4 événements) - Permet l'ajout d'un titre (H2) optionnel - Permet l'ajout d'une description (max 360 caractères) - Permet de filtrer les événements par canal et type, langues, mots clés, type , et de choisir une sélection automatique ou manuelle
\[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Contenu > Texte

Le composant Texte permet d’ajouter du contenu de type textuel, avec des options de mise en forme simples. Il peut être utilisé pour structurer l’information sur une page à l’aide de titres, paragraphes, listes et liens. Ce composant est idéal pour présenter des contenus éditoriaux, des descriptions détaillées, etc.

[![text.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/text.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/text.png) ### Cas d'utilisation - Titres de paragraphe : afin de faciliter la lecture et le découpage d’une page, il est possible d’utiliser plusieurs niveaux de titres, h3 et h4. Le niveau 2 (<h2>) est le titre du composant Texte. Il peut y avoir plusieurs niveaux de titres 3 et 4 dans le corps du composant Texte. - Styles : Un style basique peut être ajouté, mettre un texte en italique / gras / exposant / indice, mais également ajouter un caractère spécial. - Liens : il est possible d’ajouter des liens dans le composant. - Listes numérotées ou à puces : les listes permettent d’énumérer des éléments et de faciliter la lecture ou le scannage des informations contenues dans la page. - Les cas d’utilisation Styles/Liens/Listes numérotées ou à puces peuvent se combiner entre eux lorsque l’édition de contenus en a besoin. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Formulaire > Formulaire

Le composant Formulaire permet d’ajouter un formulaire simple sur une page de votre site, par exemple pour collecter des inscriptions, des retours ou des questions.

[![form.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/form.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/form.png) ### Bonnes pratiques Plusieurs bonnes pratiques sont nécessaires pour la création d’un formulaire : - Simplicité : le formulaire doit être le plus simple possible et utiliser le minimum de champs nécessaires. Il est par exemple déconseillé de demander le genre de la personne. - Longueur : il a été prouvé que plus le formulaire est long, plus le taux d’abandon est élevé. - Hiérarchie : classer et hiérarchiser les informations demandées - Temporalité : ​​indiquer le temps de complétion - Aide contextuelle : utiliser des textes additionnels pour aider les utilisatrices et utilisateurs lorsque le champ pourrait prêter à confusion Il est important que le processus d’envoi correspondent aux standard attendus par la majeure partie des usagers : - Au minimum, il est nécessaire de proposer un bouton d’envoi permettant à la personne de décider à quel moment elle est prête à envoyer ses informations et de faire valider les informations entrées dans les champs. - Un feedback doit toujours être donné après l’envoi: le formulaire a-t-il bien été soumis ou y a-t-il des erreurs à corriger ? Par défaut, la formule suivante est intégrée: "Le formulaire a été envoyé avec succès". ### Cas d’utilisation Le formulaire à votre disposition permet de choisir entre les options de champs suivantes: - Texte (Text area) - Demande d’informations de type alphanumériques (Text input), - Numéro de téléphone (Phone input), - Sélection entre différentes options (Select input ou Radio input; un seul choix possible), - Case à cocher (Checkbox input, un ou plusieurs choix possible), - Interrupteur (Toggle Switch, sélection entre deux options) - Sélection d’une date ou d’une période (Datepicker) - Insertion d’un mot de passe (Password input). Le formulaire disponible sur le CMS Jahia propose d’envoyer l’information à une adresse email qu’il sera nécessaire d’intégrer à la création du formulaire ainsi que le sujet du message qui sera reçu par le destinataire. Les données soumises via une formulaire Jahia sont également compilées dans un fichier qui peut être téléchargé ultérieurement. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Media > Audio

Le composant Audio permet d’ajouter un lecteur audio directement dans une page du site. Il est conçu pour mettre à disposition un podcast ou une playlist. Ce composant répond à un besoin croissant : permettre l’écoute de contenus audio produits ou relayés par l’UNIL, que ce soit pour s’informer, découvrir ou approfondir un sujet.

[![audio.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/audio.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/audio.png) ### Bonnes pratiques Afin de respecter la position éco-responsable choisie pour les plateformes digitales de L’Université de Lausanne, l’intégration d’audio dans la page doit amener une plus-value au contenu et aider à sa compréhension. Il est recommandé de décrire brièvement le contenu de l’audio, afin que les utilisatrices et utilisateurs sachent de quoi il s’agit avant de le charger pour l’écouter. ### Cas d'utilisation Le composant se décline en deux variantes: - Lecteur simple : contient un seul élément audio. Il est composé d’un titre, d’un sous-titre - Playlist : contient plusieurs éléments audio d’une liste de lecture. Il est composé d’un titre, d’un sous-titre et un pictogramme à droite indique qu’il s’agit d’une playlist. Les lecteurs de fichiers audio peuvent être ajoutés sur toutes les pages à tous les endroits du corps de la page tant qu’ils sont pertinents et amènent une plus-value. ### Remarques particulières Dans un souci d’éco-responsabilité, l’audio n’est pas automatiquement chargé à l’ouverture de la page. Seul un clic sur le composant permettra de charger la source audio depuis la plateforme qui l’héberge. Le média sera alors prêt à être écouté. La plateforme proposée à l’Université de Lausanne est [podcastics](https://www.podcastics.com/fr/hebergement-podcast/). \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Media > Flux RSS/Atom

Le composant RSS/Atom permet d’afficher automatiquement les dernières actualités ou contenus provenant d’un flux RSS ou Atom (format sucesseur de RSS) externe. Ce composant est utile pour partager des contenus à jour sans avoir à les ressaisir manuellement.

[![flux rss.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/flux-rss.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/flux-rss.png) ### Cas d'utilisation Ce composant contient un titre, une description, des teasers des éléments du flux (recommandation : 3 éléments), un bouton qui permet de s’abonner au flux ainsi qu’un lien “Plus d'informations" renvoyant vers la page d'informations légales, décrivant ce qu'est une flux RSS et son utilisation. Le composant Flux RSS est utile pour afficher les dernières actualités, articles ou publications. Il permet aussi de s’y abonner. - Actualités, événements ou blog : il est possible d’intégrer un flux RSS dans une section dédiée aux actualités, articles de blog ou mises à jour. Cela permet aux visiteuses et visiteurs de rester informés des derniers contenus publiés. - Page d'Accueil : il est possible d’intégrer un flux RSS à la page d’accueil pour afficher les dernières actualités ou événements. - Page de ressources ou de publications : le flux RSS peut être utilisé afin d’afficher les publications issues de Serval. ### Bonnes pratiques Le composant Flux RSS nécessite l’intégration de plusieurs éléments pour permettre son affichage: - l’URL de flux RSS à intégrer dans le composant. - Le nombre d'entrées distinctes qui seront remontées par le flux RSS. Par défaut, 10 entrées sont affichées. - En option, il est possible d’ajouter un Titre ainsi qu'un Sous-titre afin de donner du contexte au flux RSS et aux entrées qu'il intègre dans la page. [Notre documentation pour comprendre les flus RSS/Atom](https://wiki.unil.ch/ci/books/navigateurs-web/page/flux-rss-et-atom "Flux RSS et Atom") \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Media > Galerie d'images

Le composant Galerie d’images permet d’afficher plusieurs images liées à un même sujet, dans un format visuel attrayant. Il est particulièrement utile pour montrer une série de photos ayant un sens éditorial (événement, ambiance, portraits, lieux…).

[![galerie.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/galerie.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/galerie.png)

Ce composant sert à visualiser plusieurs images reliées à une même thématique afin d’illustrer un propos. Il permet d’afficher ces images en plein écran et indique le nombre d’images contenues dans la galerie. Afin que la création de contenu respecte la démarche éco-responsable de l’Université de Lausanne, l’intégration d’images dans la page doit amener une plus-value au contenu et aider à sa compréhension. Il faut éviter les images prétextes.

### Droits d’auteur et copyright Depuis l’entrée en vigueur de la révision de la loi sur le droit d'auteur le 1er avril 2020, toutes les photos sont protégées en Suisse. Il n’est donc pas légal d’utiliser des images au hasard sur le web ou les réseaux sociaux sans l’accord de leur propriétaire. Les composants dotés d’images sont donc pour la plupart prévus pour accueillir un copyright que l’usager peut ajouter dans un champ ad hoc du back office. De plus, pour la fonction Édition de contenu ou Édition de pages, il est recommandé d’ajouter des sources tierces (hors celles proposées par l’UNIL) dans les informations légales dans un espace Crédit photos. Qu’elles soient sous licence libre ou mises à disposition par l’UNIL, les images peuvent poser des problèmes dans leur usage. Le fait qu'une image puisse être utilisée gratuitement ne signifie pas forcément que son auteur ne doive pas être mentionné (par exemple si vous utilisez une image gratuite sous licence Creative Commons autre que CC0 et que vous ne mentionnez pas sa source, ceci peut faire l'objet de poursuites). Voici quelques autres points à tenir compte lors de votre usage des images: - Droit à l’image et droit d’auteur pour les marques et monuments: Certains photographes mettent parfois à disposition dans des banques d'images gratuites des images qu'ils ont réalisées, mais pour lesquelles ils ne possèdent pas tous les droits (par exemple l'accord de personnes reconnaissables, ou les droits de copyright des marques ou de certains lieux ou monuments). - Partage de catalogues entre banques d’images: Certaines banques d'images gratuites mettent à disposition des images provenant d'autres banques gratuites, mais cette situation peut évoluer dans le temps (par exemple la banque d'images A vous propose une image qui provient en fait de la banque d'image B, qui entre temps ne la propose plus). - Spécialistes en copyright et Copyright trolling: Pour protéger leurs droits de leurs images, de nombreux photographes font appel à des entreprises dotées de moyens de détection des utilisations de leurs images, qui fondent leur business model sur des réclamations de compensations financières pour les utilisations illicites ou ne mentionnant pas les auteurs. Pour complexifier la situation, certains individus peu scrupuleux pratiquent également le copyright trolling pour tenter de s'enrichir illégalement. Vous trouverez (plus d’informations sur les droits et le copyright ainsi que sur les bases de données disponibles à l’UNIL sous Images)\[[https://docs.google.com/document/d/1IYtw79enlpDATnKHGCFYOWB0OhiWoFmaNDjf0IXq718/edit?pli=1#heading=h.fnsqjh68tnwz](https://docs.google.com/document/d/1IYtw79enlpDATnKHGCFYOWB0OhiWoFmaNDjf0IXq718/edit?pli=1#heading=h.fnsqjh68tnwz)\]. ### Bonnes pratiques Les galeries d’images doivent mentionner un copyright (sur le composant ou dans le crédit photo; voir plus haut). Chaque image peut aussi avoir une description optionnelle qui permet de donner un contexte à cette dernière. Un maximum de 120 caractères espaces compris peuvent être saisis dans la description de l'image. Un maximum de 60 caractères espaces compris peuvent être saisis dans le copyright de l'image. Chaque galerie peut accueillir un maximum de 20 images et il est nécessaire de bien choisir la première image de la galerie. En effet, la première image doit être représentative du contenu car elle sera visible avant même l’ouverture de la galerie. Les images doivent être correctement décrites dans la balise “alt” (il s’agit d’un texte alternatif qui décrit l’image pour les personnes qui ne seraient pas en capacité de la voir ou si une erreur de chargement survient). Par défaut, la description de l’image est reprise dans le texte alternatif de celle-ci. Chaque composant intégrant une image nécessite, pour fonctionner de manière optimale, une certaine taille et ratio de média. Les tailles d'images recommandées sont indiquées à lors de l’utilisation du composant et dans le styleguide. Il est nécessaire de respecter ces recommandations pour un affichage optimal. Enfin, il est indispensable d’optimiser les images et leur poids afin qu’elles soient plus rapides à charger et consomment moins de ressources serveur. ### Cas d'utilisation Les galeries d’images peuvent être ajoutées sur toutes les pages à tous les endroits du corps de la page tant qu’elles sont pertinentes et amènent une plus-value (voir plus haut). Il existe 2 variantes de ce composant : - Avec description optionnelle, une simple galerie, avec une description optionnelle, un copyright et le nombre d’images contenues dans la galerie - Avec débordement des slides : le composant peut détecter lorsque le nombre de miniatures dépasse la capacité d'affichage. Il affichera des flèches au format desktop. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Media > Image(s)

Le composant "Image(s)" permet d’insérer une image (ou deux images côte à côte) dans une page.

[![image.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/sZzimage.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/sZzimage.png) [![image double.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/image-double.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/image-double.png)

Les images servent à illustrer un propos dans la page. Afin que la création de contenu respecte la position éco-responsable choisie pour les plateformes numériques de l’Université de Lausanne, l’intégration d’images dans la page doit amener une plus-value au contenu et aider à sa compréhension. Il faut éviter les images prétextes.

### Droits d’auteur et copyright des images Depuis l’entrée en vigueur de la révision de la loi sur le droit d'auteur le 1er avril 2020, toutes les photos sont protégées en Suisse. Il n’est donc pas légal d’utiliser des images au hasard sur le web ou les réseaux sociaux sans l’accord de leur propriétaire. Les composants dotés d’images sont donc pour la plupart prévus pour accueillir un copyright que l’usager peut ajouter dans un champ ad hoc du back office. De plus, pour la fonction Édition de contenu ou Édition de pages, il est recommandé d’ajouter des sources tierces (hors celles proposées par l’UNIL) dans les informations légales dans un espace Crédit photos. Afin de respecter le droit en vigueur, l’UNIL vous propose plusieurs solutions adaptées à vos besoins: - Unimedia: des images des collections de l'UNIL, pour lesquelles nous possédons les droits d'auteurs; - Banques gratuites: listes de sites proposant des images souvent sous licence libre Creative Commons zéro (CC0); - Dreamstime: banque commerciale destinées aux employé·e·s de l'UNIL et institutions partenaires. Qu’elles soient sous licence libre ou mises à disposition par l’UNIL, les images peuvent poser des problèmes dans leur usage. Le fait qu'une image puisse être utilisée gratuitement ne signifie pas forcément que son auteur ne doive pas être mentionné (par exemple si vous utilisez une image gratuite sous licence Creative Commons autre que CC0 et que vous ne mentionnez pas sa source, ceci peut faire l'objet de poursuites). Voici quelques autres points à tenir compte lors de votre usage des images: - Droit à l’image et droit d’auteur pour les marques et monuments: Certains photographes mettent parfois à disposition dans des banques d'images gratuites des images qu'ils ont réalisées, mais pour lesquelles ils ne possèdent pas tous les droits (par exemple l'accord de personnes reconnaissables, ou les droits de copyright des marques ou de certains lieux ou monuments). -Partage de catalogues entre banques d’images: Certaines banques d'images gratuites mettent à disposition des images provenant d'autres banques gratuites, mais cette situation peut évoluer dans le temps (par exemple la banque d'images A vous propose une image qui provient en fait de la banque d'image B, qui entre temps ne la propose plus). - Spécialistes en copyright et Copyright trolling: Pour protéger leurs droits de leurs images, de nombreux photographes font appel à des entreprises dotées de moyens de détection des utilisations de leurs images, qui fondent leur business model sur des réclamations de compensations financières pour les utilisations illicites ou ne mentionnant pas les auteurs. Pour complexifier la situation, certains individus peu scrupuleux pratiquent également le copyright trolling pour tenter de s'enrichir illégalement. ### Bonnes pratiques Les images doivent mentionner un copyright (sur le composant ou dans le crédit photo; voir plus haut). Elles peuvent aussi avoir une description pour l’usager qui permet de donner un contexte à cette image, mais celle-ci est optionnelle. Un maximum de 120 caractères espaces compris peuvent être saisis dans la description de l'image. Un maximum de 60 caractères espaces compris peuvent être saisis dans le copyright de l'image. Les images doivent être correctement décrites dans la balise “alt” (il s’agit d’un texte alternatif qui décrit l’image pour les personnes qui ne seraient pas en capacité de la voir ou si une erreur de chargement survient). Chaque composant intégrant une image nécessite, pour fonctionner de manière optimale, une certaine taille et ratio de média. Les tailles d'images recommandées sont indiquées à lors de l’utilisation du composant et dans le styleguide. Il est nécessaire de respecter ces recommandations pour un affichage optimal. Enfin, il est indispensable d’optimiser les images et leur poids afin qu’elles soient plus rapides à charger et consomment moins de ressources serveur. ### Cas d'utilisation Les images peuvent être ajoutées sur toutes les pages à tous les endroits du corps de la page tant qu’elles sont pertinentes et amènent une plus-value. Il existe plusieurs variantes de ce composant : - Deux images côte à côte : ells sont disposées sur deux colonnes, - Avec bordure, qui est utilisé pour les schémas et graphiques ou les images sur fond blanc intégrant du texte. - Afin d’intégrer des infographies parfois complexes, un composant Infographie SVG est spécifiquement prévu pour intégrer ce type d’images, uniquement au format SVG. Afin d’être pleinement lisibles, les infographies de ce composant sont les seules à ne pas avoir de version propre à l’éco-conception \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Media > Plan

Le composant Plan permet d’ajouter une carte interactive centrée sur le campus de l’UNIL, pour situer des bâtiments, des accès ou d’autres informations géolocalisées. Il s’appuie sur [Planète UNIL](https://planete.unil.ch/) et offre une navigation fluide, avec des options de personnalisation (zoom, centre, couches) et des plans interactifs des bâtiments du campus.

[![carte.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/carte.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/carte.png) ### Bonnes pratiques Dans un souci de durabilité, il a été choisi de limiter les interactions car elles ont pour conséquences de faire des requêtes multiples vers le serveur ou vers un service. C’est pourquoi, il a été décidé de privilégier l’affichage d’une image et de charger la carte uniquement si la personne clique sur “charger la carte”. ### Cas d'utilisation Les cartes permettent de localiser un lieu. Elles peuvent être utilisées sur les pages “accès” par exemple. ### Ajout et édition Le composant Jahia issu de Planète UNIL se base sur le système de coordonnées MN95 (mensuration nationale de 1995), propre à la Suisse et dont l’origine est à Berne. À l’international et sur la plupart des plateformes de géodonnées (par exemple Google Maps), le système de coordonnées WGS84 est la norme utilisée. #### Pour les utilisateurs sur PC Pour définir le centre de la carte/plan à son ouverture sur la page web, vous pouvez utiliser CTRL+clic sur la mini carte disponible en édition. Les champs de coordonnées seront automatiquement complétés dans le bon format. [![plan-pc.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/plan-pc.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/plan-pc.png) #### Pour les utilisateurs sur Mac Deux champs sont disponibles pour saisir des coordonnées dans la configuration du plan ou de la carte. Ces coordonnées doivent être exprimées dans le système MN95. [![plan-mac.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/plan-mac.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/plan-mac.png) Si vous utilisez une plateforme sur le web pour récupérer des coordonnées, il est fort probable que vous ayez accès à des coordonnées WGS84. **Assurez-vous alors de bien les convertir en MN95 pour les utiliser dans le composant Jahia.** Vous trouverez ici un exemple de convertisseur qu’il est possible d’utiliser : [https://www.swisstopo.admin.ch/fr/conversion-coordonnees-navref](https://www.swisstopo.admin.ch/fr/conversion-coordonnees-navref) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Media > SVG

Le composant SVG permet d’ajouter une illustration vectorielle dans une page web. Contrairement aux images classiques (JPEG ou PNG), le format SVG reste net à toutes les tailles, même sur écran haute résolution et n'est pas affecté par le mode éco-conçu. Il est particulièrement adapté aux pictogrammes, schémas simples ou illustrations légères.

[![svg.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/scaled-1680-/svg.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/svg.png) ### Bonnes pratiques Ce composant doit suivre les recommandations usuelles de toutes les images. Les images doivent: - être correctement décrites dans la balise “alt” (il s’agit d’un texte alternatif qui décrit l’image pour les personnes qui ne seraient pas en capacité de la voir ou si une erreur de chargement survient). - avoir, pour fonctionner de manière optimale, une taille et un ratio de média définis. Les tailles d'images recommandées sont indiquées à l’utilisation dans le composant en toute transparence pour la personne intégrant le composant. Il est nécessaire de respecter ces recommandations pour un affichage optimal. - avoir un poids optimisé afin qu’elles soient plus rapides à charger et consomment moins de ressources serveur. ### Cas d’utilisation Ce composant peut être ajouté sur toutes les pages à tous les endroits du corps de la page tant qu’elle est pertinente et amène une plus-value. Ce composant n’accepte que et uniquement des fichiers au format SVG. Ce composant utilisant un média de type image est le seul à ne pas être automatiquement traité pour l’éco-conception comme toutes les autres images des sites afin de garantir une lisibilité optimale des informations. ### Remarques Une bordure optionnelle peut être ajoutée autour de l’infographie afin de faire ressortir cette dernière, notamment si les informations dans le SVG sont sur écrites sur fond blanc. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Media > Social wall En construction. Va servir à afficher des posts provenant des comptes UNIL sur les médias sociaux. Il sera basé sur le [social wall de l'outil Flockler](https://flockler.com/fr/social-wall). \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Media > Vidéo

Le composant Vidéo permet d’intégrer facilement une vidéo dans une page web, que ce soit pour illustrer un contenu, enrichir une information ou proposer un contenu audio-visuel de l’UNIL. Ce composant accepte plusieurs plateformes (YouTube, Vimeo, REC UNIL, av.unil.ch(s'ouvre dans un nouvel onglet), Play RTS) et affiche une image de couverture avec bouton "play" pour inviter à la lecture.

[![video.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/video.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/video.png) ### Droits d’auteur et copyright des vidéos La [Cour de justice de l’Union Européenne](https://curia.europa.eu/juris/document/document.jsf?docid=159023&doclang=FR) estime que les vidéos embed (intégrée et embarquée dans une page web) ne constituent pas une infraction au copyright, même sans avoir obtenu l’autorisation des ayants droit pour sa diffusion. Les législations évoluant continuellement, il est important de garder de bonnes pratiques telles que citer vos sources, y compris pour des vidéos. Un champ a été prévu à cet effet. ### Bonnes pratiques Les vidéos peuvent mentionner un copyright sur le composant (voir plus haut). Elles peuvent aussi avoir une description optionnelle destinée à donner plus de contexte à la vidéo. Un maximum de 120 caractères espaces compris peuvent être saisis dans la description de la vidéo. Un maximum de 60 caractères espaces compris peuvent être saisis dans le copyright de la vidéo. Afin de respecter la position éco-responsable choisie pour les plateformes digitales de l’Université de Lausanne, l’intégration de vidéos dans la page doit amener une plus-value au contenu et aider à sa compréhension. Il faut éviter les vidéos prétextes. ### Cas d’utilisation Les vidéos peuvent être ajoutées sur toutes les pages à tous les endroits du corps de la page tant qu’elles sont pertinentes et amènent une plus-value. Le composant vidéo accepte les formats suivants : -[REC·UNIL](https://rec.unil.ch/) (ubicast) : cette source est le média serveur de l’Université de Lausanne permettant à la Communauté de diffuser des cours ou des événements en direct et en différé en tant qu’outil pédagogique. - YouTube : cette source permet la diffusion de vidéos hébergées sur [la chaîne officielle de l’UNIL](https://www.youtube.com/channel/UCMRwzZJguCyzvveznZBrFgQ) ou toute autre chaîne. Le composant permet d’intégrer aussi bien des vidéos individuelles que des playlists issues de la chaîne concernée. - [Vimeo](https://vimeo.com/) : cette source permet la diffusion de vidéos hébergées depuis toute chaîne issue de la plateforme Vimeo destinée au partage et au visionnage. Le composant permet d’intégrer aussi bien des vidéos individuelles que des playlists issues de la chaîne concernée. - HVA: Cette plateforme est aujourd’hui fermée. Toutefois, les vidéos qui étaient précédemment utilisées via la plateforme HVA pourront toujours être intégrées dans le Video player. - Play RTS: les vidéos issues de la plateforme de la Radio Suisse Romande peuvent également servir de source pour intégrer un contenu additionnel. L'image de couverture ou miniature de la vidéo est récupérée automatiquement selon une méthode propre à chaque plateforme puis affichée. Cette image n’est pas stockée sur les serveurs de l’UNIL afin de diminuer encore une fois l’impact des vidéos. Cependant, dans le cas ou l’image récupérée automatiquement par le composant n’est pas satisfaisante, il est possible d’uploader sa propre image au format 16/9 (dimensions maximales de 1280 x 720 px). \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Mise en page > Accordéon

Le composant Accordéon permet d’afficher du contenu de manière compacte et structurée, en le répartissant dans des sections repliables. Il aide à organiser les informations longues ou denses, tout en évitant de surcharger la page visuellement. Chaque section peut être ouverte ou fermée individuellement par l’utilisateur·trice.

[![accordéon.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/accordeon.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/accordeon.png) ### Bonnes pratiques Le modèle en accordéon est idéal pour décomposer un contenu long ou complexe en morceaux plus petits et plus faciles à lire ou à parcourir. Il est également idéal pour les sites mobiles car il réduit la quantité de défilement qu'un utilisateur doit effectuer pour lire un contenu. Cela permet aux utilisateurs de contrôler ce qu'ils veulent lire et quand, ce qui peut améliorer leur expérience. Le contenu d’un accordéon est caché et est révélé lorsqu’une action d’ouverture est effectuée. Il n’est donc pas recommandé d’y mettre des informations essentielles qui seront de ce fait moins visibles. ### Cas d'utilisation Un accordéon est utilisé en général avec d’autres accordéons et dans le but de mettre des questions-réponses, comme une FAQ. Il est souvent placé dans le bas de la page, au cas où les personnes n’ont pas trouvé les informations dans la page. Ce composant ne peut contenir que les composants suivants : - Richtext, - resources, - vidéo, - audio, - image seule, - bouton (optionnel) Il existe une variante sur fond foncé de ce composant qui est utilisée pour constituer le composant Interview. Elle peut être utile pour créer du rythme et du contraste dans une page qui a beaucoup de blanc. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Mise en page > Onglets

Le composant Onglets permet d’afficher du contenu de manière compacte et structurée, en le répartissant dans des onglets. Il aide à organiser les informations longues ou denses, tout en évitant de surcharger la page visuellement.

[![onglet.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/onglet.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/onglet.png) Ces éléments ne peuvent contenir que les composants suivants : - Richtext - tableau - formulaire - ressources - vidéo - audio, - images (seules ou galeries) - citation (testimonial) - interview - bouton (optionnel) ### Bonnes pratiques Il est utilisé pour structurer la page lorsque des contenus ont des thématiques différentes et regroupables. Il s’agit d’un système de rangement qui permet un accès rapide aux contenus. Les titres de ces onglets doivent être clairs et concis et sont limités à 30 caractères maximum (espaces compris). ### Cas d'utilisation Il est à utiliser avec parcimonie, quand plusieurs éléments ou thématiques distinctes ont la même priorité. Exemple : dans la section Unisciences, sur la page d’un membre. ### Remarques particulières Sur mobile, ce composant s’affiche comme un dropdown. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Mise en page > Tableau

Le composant Tableau permet d’organiser de façon concise et lisible un ensemble d’informations sur une page. Grâce à ce composant, les lecteur·trice·s peuvent trier facilement les données (si vous activez cette option), et accéder rapidement aux informations recherchées. C’est un outil idéal pour structurer des contacts, des prestations, ou des liens utiles de manière compacte et efficace. Sur mobile, toutes les colonnes d’une même ligne sont affichées dans la même case, pour une meilleure lisibilité.

[![tableau.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/tableau.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/tableau.png) ### Bonnes pratiques L’utilisation d’un tableau est fortement recommandée lorsque l’on souhaite représenter des données, c'est-à-dire des informations exprimées sous la forme d’un tableau en 2 dimensions. Le tableau ne doit pas être utilisé pour mettre en page du texte. On préférera dans ce cas des composants texte riche, plus adaptés pour un contenu purement textuel. ### Cas d'utilisation Il existe plusieurs variantes de ce composant : - Avec en-tête : lorsque l’intitulé des colonnes aide à la compréhension du tableau ou nécessite le tri des colonnes. - Sans en-tête : lorsqu’il s’agit d’une liste structurée et que le contenu des colonnes est suffisamment parlant pour se passer d’en-tête - Avec un ou plusieurs composants texte riche dans une case de tableau, notamment pour afficher du texte mis en forme, des listes ou des liens dans le contenu - Avec un ou plusieurs composants People Teaser dans une case de tableau, par exemple pour présenter les membres d’un service - Un tableau peut avoir deux ou trois colonnes selon les besoins éditoriaux. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Navigation > Bouton

Le composant Bouton permet de créer un **appel à l’action** clair et visible sur une page, comme par exemple "S'inscrire", "En savoir plus" ou "Télécharger". Il est conçu pour orienter la navigation de l’utilisateur vers un lien interne ou externe, tout en respectant la charte graphique de l’UNIL.

[![bouton.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/bouton.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/bouton.png) ### Bonnes pratiques Chaque bouton doit communiquer clairement son objectif. Un bouton comporte toujours un libellé commençant par un verbe pour faciliter la communication de l'action du bouton. À ce libellé peut s’ajouter aussi une icône pour aider à la compréhension de l’action au clic. Les boutons utilisent des libellés textuels qui décrivent l'action qui se produira si une personne clique sur le bouton. ### Cas d'utilisation Les templates de pages permettent de visualiser les différentes possibilités d’utilisation des boutons. Voici quelques règles simples : - Lien ou bouton ? - les boutons représentent une action (télécharger, s’inscrire, soumettre, postuler, etc.) - les liens de naviguer ou d’accéder à une autre page ou un autre site - Taille : - Par défaut, la taille est “medium”. La plateforme Jahia utilise cette taille comme standard. - La taille “large” n’est aujourd’hui pas utilisée dans les templates proposés sur la plateforme Jahia. Elle pourrait être utilisée dans le cadre d’autres développements pour une landing page personnalisée pour un événement qui nécessiterait un grand call-to-action. - La taille “small” n’est aujourd’hui pas utilisée dans les templates proposés sur la plateforme Jahia. Elle pourrait être utilisée dans le cadre d’autres développements pour un écran qui serait chargé en actions dans un espace limité. Par exemple des filtres complexes. - Style : Le style des boutons sont à choisir selon le type d’action qu’ils engendrent et selon leur importance : - Action principale = bouton “primaire”. Ce bouton doit garder un contraste élevé. Deux variantes existent: - Variante couleur (bleu pour le site principal) lorsqu’il est sur un fond clair - Variante blanc lorsqu’il est sur un fond de couleur. - Exemples : Sur le détail d’un événement : s’inscrire; sur la page profil “Futures étudiantes et futurs étudiants”, la possibilité de consulter le programme de la semaine d’accueil; sur le détail d’un bachelor : s’inscrire à la formation - Action secondaire = bouton “secondaire”. Ce bouton a moins de contraste du fait que l’action qu’il engendre est moins importante que celle d’un bouton primaire. Deux variantes existent: - Variante claire (gris et texte noir pour le site principal) lorsqu’il est sur un fond clair et - Variante transparent (texte blanc) lorsqu’il est sur un fond de couleur. - Exemples : Sur le détail d’un événement : l’ajouter à son agenda; sur le détail d’un bachelor, télécharger la brochure ou le plan de formation - Ne pas utiliser deux boutons “primaires” l’un à côté de l’autre. La variante “secondaire” devra être utilisée s’il y a un ou plusieurs autres boutons à côté d’un “primaire”. - Icône : - Une icône peut accompagner le libellé si l’on souhaite renforcer une action. Par exemple pour un bouton “Télécharger”, “Rechercher”, “Imprimer”, etc. - Si une icône est ajoutée, elle sera à gauche du libellé. - Seul un chevron (par exemple dans le composant Dropdown) ou une flèche (par exemple sur un bouton “suivant”) seront placés à droite du libellé - Le bouton avec une icône seule est utilisé lors d’actions - Le bouton “back to top” dans le footer - Les réseaux sociaux dans le footer - Les réseaux sociaux pour le composant “Partager l’actualité” ou “Partager l’événement” - La “croix” pour fermer une modale ou la galerie plein écran - Les flèches pour faire défiler les images d’un carrousel - Sur le placeholder d’une vidéo, le bouton “Play” - Sur mobile dans la navigation fermée : la loupe pour ouvrir la recherche et le burger menu pour ouvrir le menu \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Navigation > Groupe de pages

Le composant Groupe de pages permet de créer une liste de liens claire et structurée vers des pages internes ou des ressources externes. Il est conçu pour mettre en valeur un ensemble de contenus liés, sous forme de blocs de navigation facilement identifiables. Il améliore la lisibilité et oriente les utilisateurs dans leur parcours. Ce composant permet la navigation vers des pages-filles de la page dans laquelle il est intégré, mais aussi des liens externes lorsque cela est nécessaire. Il est par exemple utilisé sur les landing pages (pages de premier niveau) nécessitant de rediriger vers des sous-pages.

[![groupe de pages.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/scaled-1680-/groupe-de-pages.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/groupe-de-pages.png) ### Bonnes pratiques Ce composant regroupe des liens vers des contenus ayant une cohérence thématique et permettant à la personne d’avoir une vue claire d’un sujet tout en donnant du contexte. Exemple : Si le sujet principal est Etudier à l’UNIL, le Featured Links List décrit la thématique Offres de formation. Il peut alors rediriger vers la page traitant de ce sujet et redirige obligatoirement vers des liens vers des sous-pages de la même thématique comme Bachelors, Masters, Formations continues, etc. ### Cas d'utilisation Ce composant est utilisé pour valoriser des liens vers des contenus. Il permet de structurer une page qui redirige vers beaucoup d’éléments et peut précéder par exemple des blocs comprenant Icon Page Teaser ou Page Teaser. Son contenu doit être plus important. Des variantes peuvent être sélectionnées pour personnaliser le composant : - La position de l’image et du texte (gauche ou droite) permet de varier le rythme de la page si ce composant est utilisé plusieurs fois. - Le nombre de liens secondaires peut varier. Un maximum de 6 liens peuvent être saisis. Le lien de contenu principal (limité à 60 caractères espaces compris) est toujours accompagné d’un texte expliquant la thématique qui regroupe les liens des contenus secondaires. Il peut être associé ou non à un lien vers une page ad hoc expliquant la thématique si existante. Un maximum de 250 caractères maximum espaces compris peuvent être saisis pour cette description. - Un maximum de 60 caractères maximum espaces compris peuvent être saisis pour le titre du lien du contenu principal. - Un maximum de 250 caractères maximum espaces compris peuvent être saisis pour la description du contenu principal. Les liens secondaires peuvent être accompagnés ou non de texte permettant d’identifier le contenu des pages vers lesquelles ils redirigent. - Un maximum de 60 caractères maximum espaces compris peuvent être saisis pour le titre d’un lien secondaire. - Un maximum de 150 caractères maximum espaces compris peuvent être saisis pour la description optionnelle d’un lien secondaire. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Ressources > Citation

Le composant Citation permet de mettre en valeur une citation d’une personne (avec photo, nom, fonction) afin de renforcer un message ou d’illustrer une information.

[![citation.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/scaled-1680-/citation.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/citation.png) ### Bonnes pratiques Le composant Citation contient obligatoirement une image, un texte (le témoignage en lui-même), le prénom, nom et fonction de la personne. Si aucun média n’est uploadé, une image placeholder sera chargée. Le composant peut avoir un lien facultatif qui encourage à l’action ("call to action") de découvrir une page spécifique. ### Cas d'utilisation Ce composant peut être utilisé à tout moment dans une page. Il permet de valoriser une phrase ou une personne. Il existe plusieurs variantes de ce composant : - Sans "Call to Action" : à utiliser lorsqu'il s’agit d’une citation simple à insérer dans un contenu - Avec Call to Action : lorsque le témoignage renvoie à une page plus détaillée - Compact : à utiliser quand on veut afficher plusieurs témoignages d’un coup (ex: page futurs étudiants) - [Interview](https://unil-styleguide.vercel.app/iframe.html?path=/docs/content-interview--overview) : lorsqu’il s’agit par exemple d’un entretien et que la citation est divisée en plusieurs thématiques, le composant intègre la variante Accordéon - fond foncé (voir plus haut). \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Ressources > Groupe de liens

Ce composant sert à afficher des informations complémentaires, comme des éléments à télécharger, des liens externes ou des liens internes.

[![bloc de liens.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/scaled-1680-/bloc-de-liens.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/bloc-de-liens.png) ### Cas d’utilisation Il peut être utilisé sur n’importe quelle page (landing, page de contenu basique, Détail d’une actualité ou d’un événement). Il est possible d’ajouter une description. Ceci est recommandé lorsque le titre de l’élément ne parle pas de lui-même ou s’il s’agit d’un élément à télécharger, il peut être utile de décrire son contenu pour éviter un téléchargement inutile. ### Points techniques avancés Les liens peuvent être accompagnés de 3 icônes différentes: - l'icône attachement24 pour les documents - l'icône externalLink24 pour les liens externes - l'icône arrowLink24 pour les liens internes \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Ressources > Interview

Le composant Interview permet de présenter une citation forte, une personne mise en avant (avec photo, nom, fonction), et un jeu de questions-réponses sous forme d’accordéon. Ce composant est idéal pour valoriser des témoignages, des expert·e·s, ou des retours d’expérience tout en proposant un accès à un contenu plus riche via un lien.

[![interview_.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/scaled-1680-/Vnwinterview.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/Vnwinterview.png) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Teasers > Liste filtrée En construction \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique "Jahia UNIL post refonte web - Documentation publique") \] # Composants Jahia > Teasers > Teasers avec icône

Le composant Teaser avec icône vous permet de créer une liste de liens rapides, chacun accompagné d’une icône reconnaissable. Ce type de teaser est particulièrement adapté pour orienter l’utilisateur vers des pages pratiques, des rubriques spécifiques ou des actions fréquentes. Il facilite la navigation grâce à un affichage visuel simplifié et structuré.

[![icon page teaser.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/scaled-1680-/icon-page-teaser.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/icon-page-teaser.png) ### Bonnes pratiques Le titre des page teasers doit être suffisamment explicite pour que les personnes sachent à quoi s’attendre en cliquant dessus. Il est idéal d'avoir un nombre de caractères proche entre les titres des page teasers d'un même groupe. L’important est de rester régulier et succinct. Le nombre de caractères pour le titre est limité à 60 caractères maximum, espaces compris. Les page teasers permettent, si souhaité, d’ajouter un texte permettant d’indiquer à l’usager quel contenu il pourra trouver au clic. Comme pour le titre, si on ajoute un texte explicatif a un page teaser, il est important de proposer un texte explicatif à tous les page teasers réunis dans un même ensemble. Le nombre de caractères de cette description est limité à 250 caractères maximum, espaces compris ### Cas d'utilisation Ce composant est notamment utilisé sur les landing pages pour diriger vers leurs sous-pages. Les pages teasers sont répartis dans une section. Chaque section peut avoir un titre de composant et un texte d’accompagnement permettant d’annoncer les pages teasers. Ce texte peut avoir un lien à gauche redirigeant vers une page traitant du thème général regroupant les page teasers. Une section comprend autant de page teasers que nécessaire. Suivant le résultat désiré, il est donc possible de créer plusieurs types d'agencement de sections. ### Types d’agencement de sections Afin de créer les différents types de section, la largeur d'un composant est schématisée en %. Ce pourcentage de largeur ne comprend pas les espacements autour des page teasers. - Type A : 1 page teaser x 100% de la largeur disponible - Type B : 2 page teasers x 50% de la largeur disponible - Type C : 3 page teasers x 33% de la largeur disponible - Type D : 4 page teasers x 25% de la largeur disponible - Type E : 5 page teasers x 20% de la largeur disponible, il s’agit du maximum disponible pour une ligne sur desktop ### Variantes du composant Il existe plusieurs variantes de ce composant : - Lorsqu’il y a 1 à 3 teasers sur la largeur (Type A, B et C), utiliser la variante Page teaser (grand titre avec texte explicatif) - Lorsqu'il y a 4 à 5 teasers (Types D et E), utiliser les variantes Petits page teaser ( avec texte explicatif) - Pour tous les types de répartition des teasers sur une ligne, utiliser la variante Très petits page teasers selon si un texte explicatif est nécessaire ou non. Cette variante est utilisée notamment dans la page qui décrit une formation (bachelor ou master) quand il est souhaité de valoriser des liens dans le corps de la page, mais que ceux-ci ne nécessite pas de texte explicatif particulier. ### Icônes supplémentaires dans le composant Jahia "Teaser avec icône" ? Si vous utilisez le composant Jahia "Teasers avec icône", il se peut parfois que vous ne trouviez pas d'icône adaptée au concept que vous voulez illustrer parmi celles qui sont à disposition dans l'interface de ce composant dans Jahia. Ces icônes proviennent toutes de la [collection Flex Duo](https://www.streamlinehq.com/icons/flex-duo) par Streamline. Nous avons souscrit une licence qui nous permet d'utiliser un certain nombre de ces icônes dans nos composants web institutionnels. Si vous trouvez dans cette collection des icônes non encore disponibles dans notre composant et que vous souhaitez utiliser dans le cadre de votre site web ou rubrique web Jahia à travers le composant "Teaser avec icône", vous pouvez nous en faire la demande au moyen d'un [formulaire](https://www2.unil.ch/ci/forms_otrs/jahia/iconesjahia.php). Nous évaluerons si ces demandes d'ajout sont intégrables dans notre charte graphique, et si oui nous ajouterons ces icônes dans le composant. Les demandes d'ajout sont examinées par l'équipe web 3x par an, une réponse vous sera donnée dans tous les cas. Voici comment référencer les icônes souhaitées dans ce formulaire : [![form-flex-duo.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/form-flex-duo.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/form-flex-duo.png) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Teasers > Teasers avec texte

Le composant Teaser avec texte vous permet de rediriger vers d'autres pages. Il peut s'agir de pages enfants, d'autres pages du site, voire de pages de sites externes. Ce composant permet donc de créer une liste de liens visuellement reconnaissables. Chaque teaser combine un titre, un court descriptif et un lien, et peut être présenté sous différentes répartitions pour s’adapter au contenu de votre page. C’est un excellent outil pour créer des accès rapides et lisibles vers des pages de référence ou des contenus complémentaires.

[![page teaser.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/scaled-1680-/page-teaser.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-08/page-teaser.png) ### Bonnes pratiques Le titre des page teasers doit être suffisamment explicite pour que les personnes sachent à quoi s’attendre en cliquant dessus. Il est idéal d'avoir un nombre de caractères proche entre les titres des page teasers d'un même groupe. L’important est de rester régulier et succinct. Le nombre de caractères pour le titre est limité à 60 caractères maximum, espaces compris. Les page teasers permettent, si souhaité, d’ajouter un texte permettant d’indiquer à l’usager quel contenu il pourra trouver au clic. Comme pour le titre, si on ajoute un texte explicatif a un page teaser, il est important de proposer un texte explicatif à tous les page teasers réunis dans un même ensemble. Le nombre de caractères de cette description est limité à 250 caractères maximum, espaces compris ### Cas d'utilisation Ce composant est notamment utilisé sur les landing pages pour diriger vers leurs sous-pages. Les pages teasers sont répartis dans une section. Chaque section peut avoir un titre de composant et un texte d’accompagnement permettant d’annoncer les pages teasers. Ce texte peut avoir un lien à gauche redirigeant vers une page traitant du thème général regroupant les page teasers. Une section comprend autant de page teasers que nécessaire. Suivant le résultat désiré, il est donc possible de créer plusieurs types d'agencement de sections. ### Types d’agencement de sections Afin de créer les différents types de section, la largeur d'un composant est schématisée en %. Ce pourcentage de largeur ne comprend pas les espacements autour des page teasers. - Type A : 1 page teaser x 100% de la largeur disponible - Type B : 2 page teasers x 50% de la largeur disponible - Type C : 3 page teasers x 33% de la largeur disponible - Type D : 4 page teasers x 25% de la largeur disponible - Type E : 5 page teasers x 20% de la largeur disponible, il s’agit du maximum disponible pour une ligne sur desktop ### Variantes du composant Il existe plusieurs variantes de ce composant : - Lorsqu’il y a 1 à 3 teasers sur la largeur (Type A, B et C), utiliser la variante Page teaser (grand titre avec texte explicatif) - Lorsqu'il y a 4 à 5 teasers (Types D et E), utiliser les variantes Petits page teaser ( avec texte explicatif) - Pour tous les types de répartition des teasers sur une ligne, utiliser la variante Très petits page teasers selon si un texte explicatif est nécessaire ou non. Cette variante est utilisée notamment dans la page qui décrit une formation (bachelor ou master) quand il est souhaité de valoriser des liens dans le corps de la page, mais que ceux-ci ne nécessite pas de texte explicatif particulier. #### Teaser avec un lien externe A utiliser lorsque le lien pointe vers une page externe au site actuel. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Teasers > Teasers de publication

Ce composant permet de mettre en avant une publication ou un contenu éditorial par un teaser visuel vertical composé d’une image, d’un titre et d’un lien. Il est conçu pour attirer l’attention sur un contenu publié – comme une page dédiée à un magazine, un article de fond, une archive – qu’il soit interne ou externe à l’UNIL.

### Cas d'utilisation Ce composant est utilisé lorsque l’on souhaite mentionner des publications afin d’encourager la personne visitant le site à consulter celles-ci. Par exemple, Uniscope et Allez savoir!. A noter que jusqu’à 6 teasers peuvent être ajoutés au composant. ### Bonnes pratiques L’image utilisée dans chaque teaser doit avoir un ratio ¾ et idéalement les dimensions suivantes : 345 px de large pour 456 pixels de haut. Une image au ratio 16/9 peut également être ajoutée. Ces dimensions seront idéalement de 494 pixels par 323 pixels de haut. Pour obtenir une image avec le logo d’un magazine comme Uniscope par exemple, ce dernier doit être ajouté dans l'image avant d'uploader cette dernière. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Teasers > Teasers externes verticaux

Le composant Teasers externes verticaux permet de mettre en avant jusqu’à 6 contenus externes à l’UNIL, en lien avec la vie ou l’image de l’université. C’est un outil idéal pour présenter une sélection d’articles, d’interviews, de reportages ou d’interventions médiatiques concernant l’UNIL tout en respectant une mise en page harmonieuse.

### Bonnes pratiques Ce composant contient un titre, un texte de description et la mention du site vers lequel il redirige sous forme de lien avec l’icône externalLink16. Il est utilisé principalement sous sa forme “Liste”, où les teasers sont affichés côte-à-côte au nombre de 3 par ligne. Un maximum de 6 éléments sur 2 lignes peuvent être présentés par le composant. Les Vertical external teasers sont répartis dans une section. Chaque section peut avoir un titre de sectionet un texte de description permettant de renseigner le thème abordé par les vertical external teasers qui suivent. Ce texte peut avoir un lien à gauche redirigeant vers une page traitant du thème général ### Cas d'utilisation Ce composant peut être intégré dans des pages de premier niveau (landing page). Il est particulièrement pertinent sur la page “Actualités”. Chaque élément du composant est constitué des éléments suivants : - Image principale de l’élément - Titre de la page vers laquelle il redirige de 60 caractères maximum espaces compris. - Chapô pour situer le contexte de 150 caractères maximum espaces compris. - Texte et URL du lien vers lequel il redirige avec l’icône externalLink16. ### Remarques particulières Sur desktop, l'accroche comporte 3 lignes maximum, le texte est ensuite tronqué. Cet aspectest géré en CSS. Le titre, l’image et le lien sont cliquables et mènent au site externe. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Texte et média > Highlight

Ce composant est utilisé pour valoriser un élément cliquable sur les pages de niveau 1. Il peut s'agir aussi bien de pages filles, que d’autres pages du site ou même des pages de sites externes. Au clic sur le composant, les visiteuses et visiteurs se rendent sur la page en question.

[![highlight.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/scaled-1680-/highlight.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/highlight.png) ### Bonnes pratiques Il est composé d’une image, d’un titre, d’une accroche et d’un bouton principal, qui met en avant une action. Un bouton secondaire est optionnel. Il peut être utilisé pour envoyé sur une page qui donne plus d’informations sur l’élément mais qui n’est pas l’action principale. Exemple : “s’inscrire” = bouton principal et “en savoir plus” = bouton secondaire. ### Cas d’utilisation Ce composant est utilisé sur les pages de niveau 1. Il est à utiliser uniquement ponctuellement, lorsqu’il y a un événement très important (ex : l’ouverture des inscriptions). Son affichage est limité dans le temps : il est possible de l’enlever une fois l’événement passé. Il est recommandé de ne l’utiliser qu’une seule fois par page et pas sur toutes les pages car il sert à valoriser un élément. Exemples : Page Futures étudiantes et futurs étudiants : Admission aux études. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Composants Jahia > Texte et média > Texte et image En construction. [![image et texte.png](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/scaled-1680-/image-et-texte.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2024-09/image-et-texte.png) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique) \] # Rôles dans l'édition Jahia Liste des rôles et permissions pour l'édition Jahia
Fonctionnalité / Rôle JahiaWebmaster de pageWebmaster de siteWebmaster de facultéExpert
Demander l'ajout d'une icône pour Jahia
Gérer le menu principal d'un site (mode, contenus)
Gérer le hero de la page d'accueil d'un site (composant affichant des actualités/événements)
Gérer les contenus non centralisés du pied de page (exemples : réseaux sociaux, liens utiles, adresse, téléphone, site map etc.)
Utiliser le composant HTML personnalisé
Utiliser le composant Social Wall
Peut créer des pages sur le modèle Espaces dédiés d'un site
Gérer les contenus centralisés du pied de page (exemples : contact, annuaire, urgences)
Gérer les contenus centralisés du menu en haut de chaque page
Gérer les icônes disponibles sur Jahia
Accéder aux codes sources des éditeurs de texte (CK Editor)
Éditer la zone fixed du modèle de page tool (pages impressum et contact)
\[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique "Jahia UNIL post refonte web - Documentation publique") \] # Taille des images dans l'édition Jahia Taille idéale pour les images
**Composants Jahia****Ratio et dimensions idéales des images à contribuer**
Homepage Hero – colonne gauchePaysage 16:9 1340 x 754 Images contribuées et gérées par News et agenda MyUNIL
Homepage Hero – colonne droitePaysage 16:9 1340 x 754 Images contribuées et gérées par News et agenda MyUNIL
Hero sur page de niveau 1Carré 1:1 1340 x 1340
ImagePaysage 16:9 1340 x 754
Infographie SVGPaysage 16:9 1340 x 754
VidéoPaysage 16:9 1340 x 754
GaleriePaysage 16:9 1340 x 754 Accepte aussi les formats portraits
Citation InterviewMiniature 1:1 140 x 140
People teaserMiniature 1:1 140 x 140
Teasers de publicationsPortrait 3:4 750px de large
Image et textePortrait 3:4 750px de large
HighlightPortrait 3:4 750px de large
Teasers externes verticauxPaysage 16:9 750px de large
Teasers d'actualité en vedette Teasers d'actualités verticaux Teasers d'événements verticaux Teasers des événements en vedettePaysage 16:9 750px de large Images contribuées et gérées par News et agenda MyUNIL
\[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique "Jahia UNIL post refonte web - Documentation publique") \] # Référencement et SEO pour les sites Jahia Vous pouvez optimiser votre site ou rubrique de site Jahia UNIL pour qu'il soit à la fois bien classé par Google et facile à parcourir. Nous expliquons ici comment faire en sorte que votre contenu Jahia UNIL soit si possible correctement référencé dans les moteurs de recherche, et comment avoir un certain contrôle sur la manière dont Google va le présenter dans ses résultats de recherche. Les méthodes à utiliser pour y parvenir permettent également de contribuer à la qualité et à l'attractivité de nos sites. ### Pourquoi et comment optimiser son site #### Qu'est-ce que le SEO En matière de moteurs de recherche, on différencie le référencement gratuit du référencement payant: - SEO = Search Engine Optimization = optimisation pour les moteurs de recherche (référencement naturel, gratuit) - ≠ SEA (Search Engine Advertising) = achat d'espaces publicitaires dans les pages de résultats des moteurs de recherche (référencement payant) Le SEO, ou référencement naturel, peut se pratiquer à un niveau élémentaire (=les bases que nous allons voir dans cette documentation), mais aussi à un niveau professionnel, souvent par des agences spécialisées. Les techniques de SEO évoluent au fil du temps pour suivre les changements de l'algorithme de Google. Certaines méthodes valables autrefois ne le sont plus aujourd'hui. Les recommandations faites ici constituent une base indémodable. I l existe de nombreuses méthodes pour réaliser une optimisation SEO. Toutefois certaines ne sont pas forcément applicables à notre contexte et notre infrastructure UNIL. Nous présentons ici uniquement des méthodes qui peuvent être mises en pratique chez nous, sur nos sites Jahia. D'après des chiffres récents, parmi les moteurs de recherche utilisés en Europe, Google a une part de marché d'environ 90%. Les autres (Bing, DuckDuckGo, Qwant, Ecosia etc.) se partagent les 10% restants. Ces chiffres évolueront sans doute prochainement avec l'arrivée progressice d'outils d'IA dans la recherche web (ChatGPT, Perplexity, ...). #### Nécessité d'optimiser son site Pendant longtemps, les sites d'universités étaient bien classés sur Google sans grand effort. Mais ils ont été progressivement concurrencés par des sites appliquant des recommandations d'optimisation (listings d'universités, écoles privées...). D'où la nécessité aujourd'hui pour les sites d'universités d'appliquer également des recommandations d'optimisation. Ceci se justifie d'autant plus qu'il s'agit de bonnes pratiques en matière d'accessibilité web, de structure et de clarté du contenu: **un site optimisé est un site plus facile à trouver ET à utiliser**. #### Fonctionnement de l'indexation par Google En 2016, l'index de Google recensait déjà plus de [130'000 milliards de pages](https://searchengineland.com/googles-search-indexes-hits-130-trillion-pages-documents-263378) , un chiffre qui a encore augmenté depuis lors. Entre le moment où Google trouve un nouveau site à indexer ou remarque des modifications sur un site existant et le moment où il va le refléter dans ses résultats de recherche, il peut s'écouler un délai de longueur variable, pouvant atteindre plusieurs mois. Afin d'optimiser le référencement de nos sites Jahia sur Google, nous envoyons très régulièrement à Google des cartes de nos sites au format sitemap.xml. Google scanne les sites indexables et suit les liens qu'il y trouve. Ensuite il indexe, évalue et classe les pages. Pour cela, il se base essentiellement sur : - les titres de pages et de sections, et les mots-clés dans le contenu - la qualité globale du contenu et son actualité (mises à jour récentes) - le respect des bonnes pratiques web - la réputation des sites - les carte des sites que nous lui envoyons. #### Est-ce que votre site est visible et indexé par Google? Pour vérifier, faire la recherche suivante sur Google: *site:\[adresse-du-site\]* elle va retourner comme résultat la liste des pages de ce site indexées par Google. Cette syntaxe simple permet de vérifier rapidement si votre site est indexé par Google, et quelles sont les pages indexées. Elle permet également de vérifier si une page en particulier est indexée, si on utilise son adresse complète comme argument de recherche. Exemple: la requête *site:www.unil.ch/gse* va retourner la liste des pages de ce site indexées par Google: [![indexed.png](https://wiki.unil.ch/ci/uploads/images/gallery/2022-12/scaled-1680-/indexed.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2022-12/indexed.png) ### Les facteurs essentiels pour le référencement #### Identifier les mots-clés importants pour votre site Commencez par recenser les mots clés décrivants vos activités (par ex. *enseignement, recherche*...) et les thèmes qui y sont abordés, généraux (par ex. *urbanisme, glaciers...*) et spécifiques (par ex. *gentrification, pergélisol...*). Utiliser ces mots-clés dans les éléments prioritairement pris en compte pour l'indexation: - titres de niveau 1, 2, 3, 4 - méta description - liens dans le contenu - texte en gras dans le contenu - textes alternatifs des images. Ceci doit se faire en respectant une certaine hiérarchie entre ces mots clés, et en évitant la surcharge. Vouloir surcharger une page d'un trop grand nombre de mots clés est contre-productif. Si un mot clé est important pour une page, il est souhaitable qu'il figure dans 2 ou 3 des éléments mentionnés ci-dessus (titres, liens...). Il va naturellement aussi figurer dans le texte, mais il faut éviter de trop fréquentes répétitions. Google risque en effet interpréter ceci comme une tentative de *spamdexing* (contraction de spam + indexing), qui est sanctionné par un rétrogradage dans les résultats de recherche. #### Utiliser les titres de niveau 1, 2, 3 et 4 Comme dans un traitement de texte qui permet de rédiger des documents avec une hiérarchie de niveaux de titres, il existe la même distinction dans les pages web. Les niveaux de titres vont de 1 (=le plus important) à 6 (=le moins important). Dans les templates Jahia UNIL, nous utilisons les 4 premiers niveaux: - titre de page (=titre de niveau 1) - titre de composant de contenu (=titre de niveau 2) - uniquement dans le composant texte : titre de paragraphe (=titre de niveau 3) et sous-titre de paragraphe (=niveau 4) Les niveaux de titre en mode consultation : [![niveaux-titres.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/niveaux-titres.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/niveaux-titres.png) Les même en mode édition : [![niveaux-titres-edition.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/SCKniveaux-titres-edition.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/SCKniveaux-titres-edition.png) #### Titre de page (=titre de niveau 1) Le titre de la page a une grande importance pour l'indexation par Google, il faut qu'il soit à la fois bref et informatif. Il se retrouve : 1. dans la balise HTML <title> qui est affichée dans l'onglet du navigateur \* 2. sous une forme modifiée dans l'adresse de la page (nom système) 3. dans le menu de navigation 4. dans le chemin d'accès ("vous êtes ici") 5. avant le début du contenu de la page [![titre-page.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/titre-page.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/titre-page.png) \* Dans la balise HTML <title> le titre de la page est complété par un suffixe propre à chaque site. Ce suffixe est par exemple très utile pour les personnes qui vont partager un lien vers une page via un mail ou les réseaux sociaux, ou ajouter la page à leurs favoris (un favori intitulé "Organisation" est moins précis qu'un favori intitulé "Organisation - SSP UNIL"). Ce suffixe contient généralement une forme abrégée du nom du site ainsi que le mot UNIL. Il est ajouté automatiquement à chaque nom de page. Si le suffixe utilisé pour votre site ne vous semble pas adapté ou exact, merci de contacter helpdesk@unil.ch pour demander sa rectification. Précisions au sujet de l'édition du titre de page: 1. On le saisit et on le modifie ici 2. Si on modifie le titre d'une page existante, ne pas oublier de mettre à jour le nom système avec le bouton "copier le titre". Attention : ⚠️ nous déconseillons fortement les modifications manuelles de ce nom système. Si le nom système d'une page contient autre chose que des lettres non accentuées, des chiffres et des tirets, l'adresse de cette page peut poser problème pour le référencement et les liens. 3. L'option "titre alternatif" permet de spécifier sur une page un titre plus long que celui qui apparaît dans le menu de navigation. Si cette forme longue existe, c'est aussi elle qui est prise en compte par Google. Si on emploie cette option "titre alternatif", il faut impérativement lui conserver une similitude importante avec le titre court afin de ne pas égarer les visiteurs. Par exemple: il faut éviter à tout prix le cas d'une page qui aurait "contact" comme titre court et "recherche" comme titre alternatif. [![titre-page-edition.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/titre-page-edition.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/titre-page-edition.png) Le titre de la page va aussi influencer son URL, qui va se composer du chemin de votre page suivi de son nom système, par exemple [https://unil.ch/ci/home/menuinst/catalogue-de-services/communication-et-web/sites-web.html](https://unil.ch/ci/home/menuinst/catalogue-de-services/communication-et-web/sites-web.html). #### Intertitres (= titres de niveaux 2, 3 et 4) En complément du titre de page (niveau 1), il faut autant que possible structurer la page au moyen des titres de compsants de contenu (=titres de niveau 2). Dans le cas de longs textes, utiliser en complément les titres et sous-titres de paragraphe (=titres de niveau 3 et 4). Niveau 2 : presque tous les [composants de contenu](https://wiki.unil.ch/ci/books/sites-web-jahia/page/liste-des-composants-jahia "Liste des composants Jahia") permettent la saisie d'un titre. Niveaux 3 et 4 : dans le composant Texte, des styles dans l'éditeur visuel permet de structurer un texte d'une certaine longueur. #### Utiliser la méta description Cette balise figure dans l'en-tête du document en mode source et a la syntaxe suivante : *<meta name="description" content="Description de la page" />* C'est un très bref résumé du contenu de la page. Elle est très importante pour les moteurs de recherche, qui l'utilisent souvent pour l'affichage des résultats de recherche. Si cette balise n'est pas remplie pour une page, les moteurs de recherche utiliseront pour décrire cette page une partie de son contenu, sans qu'on puisse contrôler laquelle (tantôt le début du contenu, tantôt un extrait quelconque). La longueur recommandée pour le texte de la meta description est généralement de 150 à 160 caractères, espaces compris => inutile de dépasser 200 caractères, elle ne sera affichée intégralement dans les résultats de moteurs de recherche que si elle est assez courte. [![meta-description.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/scaled-1680-/meta-description.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-07/meta-description.png) Il est possible d'éditer ce champ meta description pour toutes les pages de contenu. Par contre pour la page d'accueil, seuls les administrateurs Jahia peuvent modifier la meta description => merci d'envoyer la vôtre à helpdesk@unil.ch en précisant l'adresse de votre page d'accueil, et nous l'intégrerons pour vous.

NB: il faut saisir la meta description uniquement au niveau de la page, et non pas pour chaque composant de la page.

### Autres facteurs et bonnes pratiques #### Liens entrants, liens internes et liens sortants **Pour les lien entrants** (= backlinks) Essayer d’établir ou faire établir des liens vers votre site pour améliorer son ranking dans les résultats de recherche Google ...mais seulement à certaines conditions: - Eviter la surabondance de liens (=spamdexing) - Ces liens auront de la valeur uniquement s’ils proviennent d’autres sites traitant du même sujet - Plus ces autres sites seront eux-mêmes bien référencés, plus leurs liens vers votre site auront de la valeur **Pour les liens internes** (=liens vers d'autres pages de votre site) Ces liens aussi sont utiles pour le référencement, mais là aussi en évitant la surabondance **Pour les liens sortants** (=liens vers d'autres sites) Les liens sortants ne doivent pas êtres placés dans les zones de la navigation du site (=pas dans les menus), mais dans les zones de contenu. #### Réseaux sociaux Si vous avez des comptes sur les réseaux sociaux => partager vos pages, actualités et événements. Si possible inclure dans votre post un #unil et une image. La page [Réseaux sociaux à l'UNIL](https://www.unil.ch/unil/fr/home/menuinst/universite/media-et-communication/reseaux-sociaux.html) propose des conseils et ressources pour une présence institutionnelle sur les principaux réseaux sociaux. Elle recense également les comptes UNIL existants sur ces réseaux. #### Actualités/événements MyUNIL Utiliser les [actualités/événements via MyUNIL](https://wiki.unil.ch/ci/books/sites-web-jahia/page/actualites-et-evenements-dans-myunil-pour-les-sites-jahia "Actualités et événements dans MyUNIL pour les sites Jahia"). Penser à y inclure des liens vers votre site s’il y a lieu. \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique "Jahia UNIL post refonte web - Documentation publique") \] # Gestion du multilinguisme dans Jahia ### Traduire, traduire automatiquement ou recopier d'une langue à l'autre Lors de l'édition d'une page dans un site multilingue, il faut appliquer selon les situations ou les contenus l'une de ces 3 techniques : 1. **traduire** : saisir successivement le contenu dans une langue, puis dans l'autre 2. **traduire automatiquement** : utiliser l'outil de traduction automatique Deepl inclus dans Jahia 3. **recopier un contenu d'une langue vers l'autre** : dans les cas où cela fait sens Points importants : - une page n'existe dans une langue qu'à partir du moment où on lui a donné un titre dans cette langue - pour modifier un contenu, la méthode la plus sûre est est d'éditer les langues dans ce contenu en parallèle, afin d'éviter de créer par erreur un "doublon" de ce contenu dans l'autre langue - lors de la publication, ne pas oublier de publier les pages ou les composants dans toutes les langues. En édition dans Jahia, pour changer la langue d'affichage de la page on ne va pas utiliser le sélecteur de langue en haut à droite de celle-ci, mais le sélecteur qui se trouve en haut à gauche : [![selecteur-de-langue.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/selecteur-de-langue.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/selecteur-de-langue.png) ### Ajouter un titre de page dans la 2ème langue Puisqu'une page n'existe dans une langue qu'à partir du moment où elle a un titre dans cette langue, s'il n'est pas déjà présent il faut aller l'ajouter : [![titre-langue-1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/titre-langue-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/titre-langue-1.png) [![titre-langue-2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/titre-langue-2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/titre-langue-2.png) ### Technique de base pour traduire (recommandée) La méthode simple et sûre consiste à éditer les langues en parallèle pour chaque élément de chaque composant : saisir successivement le contenu dans une langue, puis dans l'autre. Exemple : [![trad-composant-1.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/trad-composant-1.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/trad-composant-1.png) [![trad-composant-2.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/trad-composant-2.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/trad-composant-2.png) Lors de la publication, ne pas oublier d'englober toutes les langues (sauf dans les cas où le contenu ne doit pas pas être publié simultanément) : [![publier-toutes-langues.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/publier-toutes-langues.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/publier-toutes-langues.png) ### Recopier un contenu d'une langue vers une autre Pour certains champs dans les contenus, cela fait sens d'utiliser un contenu identique dans toutes les langues. Jahia permet alors d'éviter une saisie à double en utilisant une option de recopie d'une langue vers l'autre. Exemple : pour le titre d'une page intitulée "Publications" qui pourra être recopié de français en anglais, car identique dans les 2 langues. On accède à cette option de recopie en cliquant sur les 3 points en haut à droite du champ concerné, puis en choisissant "copier dans d'autres langues" [![recopie-langues.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/gperecopie-langues.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/gperecopie-langues.png) ### Traduction automatique avec DeepL Un module de traduction avec DeepL est désomais intégré dans Jahia. Il permet de traduire soit une page entière, soit un composant. Quelques précautions s'imposent lors de son utilisation : - Toujours relire et vérifier la traduction proposée par DeepL avant publication. Si besoin, corriger manuellement cette traduction. - Stratégie recommandée : utiliser la traduction de la page entière juste la première fois pour une traduction initiale, mais ensuite pour les modifications ultérieures une fois que la page est publiée, utiliser uniquement la traduction par composant. Ceci permet de ne pas perdre les différentes corrections manuelles après la traduciton initiale. - Prendre garde à ne pas se tromper lors du choix des langues. [![trad-deepl.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/trad-deepl.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/trad-deepl.png) \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique "Jahia UNIL post refonte web - Documentation publique") \] # Articles sur la refonte web [Le site internet de l’UNIL fait peau neuve](https://www.unil.ch/news/fr/1732014278676) - Actualités UNIL, novembre 2024 [Le site de l’UNIL, une aventure collective](https://wp.unil.ch/uniscope/le-site-de-lunil-une-aventure-collective/) - Uniscope, décembre 2024 [La refonte du site unil.ch et des sites des services centraux](https://wp.unil.ch/newsci/la-refonte-du-site-unil-ch-et-des-sites-des-services-centraux/) - Blog du Ci, janvier 2025 [Design System unil.ch](https://antistatique.net/projets/design-system-de-luniversite-de-lausanne-unil-ch) - Site Antistatique, mars 2025 \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique "Jahia UNIL post refonte web - Documentation publique") \] # Questions fréquentes sur l'édition Jahia Quelques questions ou problèmes courants que vous rencontrerez peut-être lors de l'édition de votre site Jahia UNIL. #### 1. Editer un site Jahia hors du réseau UNIL: le VPN UNIL est nécessaire Pour des raisons de sécurité, l’édition des sites web Jahia UNIL peut s’effectuer : - soit depuis le réseau de l’UNIL (connexion par câble réseau ou par le Wi-Fi eduroam) - soit si vous êtes hors de l’UNIL, en employant une connexion sécurisée par le [client VPN Ivanti Secure Access](https://www.unil.ch/ci/reseau-unil-chez-soi) (qui s'appelait autrefois Pulse Secure) Sinon vous rencontrez les problèmes suivants : - en cas d'oubli de lancer le VPN ou la passerelle crypto.unil.ch , vous ne pouvez pas atteindre le serveur d'édition des sites Jahia (message d'erreur qui indique un timeout ou un serveur introuvable) - en cas de passage par la passerelle crypto.unil.ch sans lancer le client VPN Ivanti, vous pouvez vous connecter au serveur d'édition mais pas éditer normalement le contenu du site

Important: L’utilisation de l’application client *Ivanti Secure Access* est requise, le simple accès à la passerelle web *crypto.unil.ch* sans avoir lancé Ivanti ne donne pas accès à toutes les fonctionnalités d’édition de Jahia.

[![Sans titre.001.png](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/scaled-1680-/sJWsans-titre-001.png)](https://wiki.unil.ch/ci/uploads/images/gallery/2025-05/sJWsans-titre-001.png) Si vous avez besoin d'aide pour installer ou configurer Ivanti Secure Access, merci de vous adresser au [helpdesk du Ci](https://www.unil.ch/ci/fr/home/menuinst/help-desk.html). \[ Documentation Jahia: [retour au sommaire](https://wiki.unil.ch/ci/books/sites-web-jahia/chapter/jahia-unil-post-refonte-web-documentation-publique "Jahia UNIL post refonte web - Documentation publique") \]