Sites web - WordPress
Voir également :
- WordPress UNIL - Documentation publique
- Au sujet de la documentation WordPress
- Présentation de WordPress
- Débuter avec WordPress
- L'éditeur de WordPress
- Thèmes sur nos serveurs WordPress
- Guide du thème Chaplin pour WordPress
- Extensions sur nos serveurs WordPress
- Gestion des droits d'édition dans WordPress
- Formulaires WordPress avec Gravity Forms
- Newsletter dans WordPress avec MailPoet
- Multilinguisme facile avec TranslatePress
- Questions fréquentes sur l'édition WordPress
- Bonnes pratiques pour la gestion des médias dans Wordpress
WordPress UNIL - Documentation publique
Au sujet de la documentation WordPress
Certains points de documentation concernant également les sites WordPress se trouvent dans la rubrique
Ressources communes pour Jahia et WordPress - Documentation publique
Présentation de WordPress
Définitions
WordPress est
- un CMS (content management system) = système de gestion de site web
- apparu en 2003 pour gérer des blogs et petits sites
- gratuit et open source
- actuellement utilisé par 1/3 des sites web dans le monde
Sa relative simplicité d'emploi (en comparaison d'autres systèmes de gestion de sites plus complexes) et le fait qu'il soit open source ont largement contribué à son succès.
Les principales fonctionnalités d'un CMS
- gestion des pages et de la structure du site
- statut des pages: brouillon ou publiées
- accès aux pages: publiques ou protégées
- gestion des liens et mise en forme du contenu
- gestion des images et documents
- modèles de contenu et réglages
Si on doit créer un site web aujourd'hui, l'utilisation d'un "content management system" est la solution la plus rapide et confortable, car elle permet d'éviter une formation longue et complexe aux langages et technologies du web.
WordPress convient pour un site ou un blog
L'une des forces principales de WordPress est sa capacité à pouvoir gérer 2 types de contenu différents :
- les pages
- les articles
Il permet donc aussi bien la réalisation d'un site classique avec une arborescence de pages que la réalisation d'un blog ou d'un site de type magazine.
Quand on consulte un site WordPress, selon les cas et les contenus, on voit :
- une page
- une liste d'articles
- le détail d'un article
Cette différence entre pages et articles est une notion de base importantes pour bien comprendre la logique de WordPress.
WordPress permet de gérer simultanément des pages et des articles, ce qui est tout à fait dans la tendance actuelle en matière de sites web. On trouve par exemple fréquemment des sites avec des pages de présentation (activités, équipe, etc.) et en complément une partie blog, avec par exemple des articles pour les actualités et nouveautés. WordPress permet de donner accès à ces deux types de contenu dès la page d'accueil.
WordPress est également bien interfacé avec les réseaux sociaux. Il permet par exemple d'afficher des icônes "suivez-nous sur Twitter, Instagram, etc." ou encore des icônes "partagez ceci sur Twitter, Facebook, etc." Il génère aussi un flux RSS, qui permet à d'autres sites d'afficher une liste dynamique de vos derniers articles.
Thèmes et extensions
Le logiciel de base de WordPress ne dispose que d'un nombre limité de fonctionnalités et d'options de présentation. Grâce à l'utilisation de composants supplémentaires, on peut cependant lui ajouter des capacités et modifier l'apparence des sites:
- les extensions permettent d'ajouter à un site des fonctionnalités supplémentaires (comme par exemple la création d'un formulaire de contact ou l'affichage d'un message "site en travaux")
- les thèmes permettent d'agir sur la présentation du site (un site utilise toujours un thème, mais on peut changer ce dernier)
L'offre WordPress du Ci
- un cours d'initiation (durée: 1/2 journée)
- l'accès à notre helpdesk si vous avez des questions ou des problèmes
- l'hébergement de votre site s'il est répond à nos conditions et à notre organisation, qui est cependant soumis aux contraintes techniques suivantes:
- vous devez impérativement faire partie de la communauté UNIL et disposer d'un compte informatique UNIL pour pouvoir éditer votre site
- utilisation uniquement des thèmes et extensions disponibles sur nos serveurs (vous n'avez pas la possibilité d'en installer d'autres)
- hors du réseau UNIL, le passage par le client VPN Ivanti Secure Access est requis pour éditer
En savoir plus sur WordPress
A l'UNIL
- l'offre web du Ci: unil.ch/ci/web
- notre documentation WordPress sur ce wiki
- Formation E-learning avec LinkedIn Learning
Hors de l'UNIL
- site du projet wordpress.org
- documentation officielle en anglais
- documentation officielle en français
- communauté francophone: wpfr.net
- conférences et événements: les WordCamps à venir , les anciennes WordCamps en vidéo et les Meetups
Débuter avec WordPress
Editer un site WordPress sur l'hébergement web du Ci
La structure de ce document est basée sur celle du cours "Sites web avec WordPress" régulièrement organisé par le Ci. Ce cours présente la création d'un site avec plusieurs pages et articles en partant d'un site vide comportant uniquement une page d'accueil, semblable aux sites WordPress nouvellement ouverts sur nos serveurs.
Sommaire:
- L'interface d'administration
- Un site avec des pages
- Le menu de navigation
- Un blog avec des articles
- Les widgets
- Gestion de fichiers (images et PDF)
- Réglages généraux
- Les extensions
- Aide
1. L'interface d'administration
Si vous n'éditez pas 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...
Débuter l'édition du site
- aller à l'adresse de connexion: ajouter /wp-admin à l'adresse de la page d'accueil du site, sur le modèle https://adresse_du_site/wp-admin (exemple fictif: https://wp.unil.ch/xyz/wp-admin )
- s'identifier avec votre compte edu-ID
- arrivée sur le tableau de bord de l'interface d'édition :
- Articles pour créer ou modifier un article
- Pages pour créer ou modifier une page
Mode édition et mode affichage
Passer de l'édition à l'affichage du site avec la barre d'outils :
la barre d'outils permet de passer de l'édition du site à l'affichage et inversément
en édition d'une page, prévisualisation ou sauvegarde + affichage:
Premier réglage: modifier le titre et le sous-titre du site
Pour modifier le titre et le sous-titre du site qui apparaissent dans le bandeau d'en-tête, il faut passer par l'interface de personnalisation :
- Apparence > Personnaliser > Identité du site
- modifier le titre du site et le slogan (=sous-titre), vérifier visuellement
- enregistrer, puis quitter l'interface de personnalisation
2. Un site avec des pages
Les pages sont accessibles par le menu principal
Créer des pages
- Pages > Ajouter
- titre de la page
- texte de la page
- enregistrer comme brouillon ou publier
Modifier une page publiée
- Pages > Modifier
- modifier le contenu
- mettre à jour pour publier les modifications
Edition du contenu
L'emploi detaillé de l'éditeur (mise en forme, mise en page, etc.) fait l'objet d'un chapitre séparé: l'éditeur de WordPress
3. Le menu de navigation
- soit dans l'interface classique (avantage: meilleure vue d'ensemble) => image ci-dessous
- soit dans l'interface de personnalisation (avantage: prévisualisation) => Apparence > Personnaliser > Menus
Par défaut, pour tous les site nouvellement ouverts sur les serveurs du Ci, un menu a été créé.
Voir la documentation relative aux menus sur le site officiel WordPress.
4. Un blog avec des articles
Quand les articles sont affichés sous forme de liste (sur la page d'accueil ou sur une autre page) :
-
les plus récents sont en premier
-
si un article est long, une option permet de n'afficher que son début, avec un lien "lire la suite"
Créer des articles
- Articles > Ajouter
- titre de l'article
- texte de l'article
- enregistrer comme brouillon ou publier
Catégories
Tout article créé est automatiquement rattaché à une catégorie par défaut. Si vous créez beaucoup d'articles, il est conseillé de créer plusieurs catégories qui permettront de classer ces articles par thèmes.
L'attribution d'un article à une catégorie exsitante ou l'ajout d'une nouvelle catégorie peuvent s'effectuer dans l'éditeur de contenu. La gestion détaillée des catégories s'effectue quant à elle en allant dans Articles > Catégories.
Commentaires
Pendant longtemps, la fonctionnalité "Commentaires" a constitué une partie importante dans la vie des blogs. Actuellement, les commentaires dans les blogs ont été en grande partie remplacés par les échanges sur les réseaux sociaux.
Par défaut, pour tous les site nouvellement ouverts sur les serveurs du Ci, les commentaires sont désactivés. Il reste possible de les activer, soit pour l'ensemble du site ou du blog, soit pour un article en particulier.
Dans les réglages (Réglages > Discussion), plusieurs garde-fous sont disponibles pour limiter le risque élevé de spam. Malgré cela, en complément, il faut toujours activer l'extension anti-spam Akismet si on autorise les commentaires !
5. Les widgets
Les widgets sont des éléments qui permettent d'afficher certaines informations sur une ou plusieurs pages du site, voir même sur toutes les pages. Parmi les éléments proposés comme widgets, on trouve par exemple:
- des listes d'articles (articles récents, ou archives par mois ou par catégorie)
- des blocs de texte (adresse de contact etc.)
- des logos (de l'institution qui publie le site, de ses partenaires).
Autrefois la plupart des thèmes WordPress proposaient une colonne latérale à droite du contenu (la sidebar) pour afficher des widgets identiques sur toutes les pages du site. Progressivement des zones d'affichage de widgets sont également apparues dans le pied de page de nombreux thèmes. La plupart des thèmes WordPress récents proposent actuellement des zones de widgets uniquement dans le pied de page, et ne proposent plus de colonne latérale.
Exemple d'ajoute d'un widget "derniers articles" dans le pied de page :
En complément, l'éditeur de blocs permet d'afficher certains widgets directement dans la zone de contenu des pages, uniquement sur les pages où on les appelle, et non plus dans seulement dans un pied de page identique sur toutes les pages du site.
6. Gestion de fichiers (images et PDF)
Formats, taille et noms de fichiers
Formats de fichiers autorisés pour les images: jpg (photos) et gif ou png (logos ou schémas).
Les noms de fichiers doivent:
- éviter les accents et les caractères spéciaux ("-" et "_" sont autorisés).
- être suivis d'une extension (bilan.pdf, photo.jpg, etc.) ; elle n'est souvent pas visible par défaut sur macOS ou Windows, mais elle est visible quand le fichier est sur le serveur
Sur nos serveurs, l'espace disponible pour les fichiers est limité
=> surveiller son utilisation:
ne pas conserver de fichiers à double, à triple, etc. Si nécessaire, cet espace peut être augmenté sur demande justifiée au helpdesk.
Les fichiers volumineux (> 30 MB, par ex. vidéos) doivent être stockés sur d'autres serveurs, et appelés ensuite depuis votre site.
Les tailles d'images dans WordPress
Si on insère dans une page WordPress une image plus grande que nécessaire, WordPress va automatiquement en générer une version plus petite, adaptée à la taille de la colonne de contenu dans laquelle on effectue l'insertion.
Insérer un document PDF
7. Réglages généraux
En plus du réglage du titre + sous-titre du site (chapitre 1), d'autres réglages ont leur importance dans la gestion d'ensemble du site.
Réglage en mode "site" ou "blog"
On peut définir si la page d'accueil doit afficher une page de contenu (=mode site) ou les articles les plus récents (=mode blog).
Gestion des droits d'édition
Voir la gestion des droits d'édition dans WordPress pour savoir commant ajouter ou supprimer des droits d'édition du site pour d'autres personnes.
Langue du site
Il est possible de changer la langue du site. Dans ce cas, les intitulés gérés par le système sont traduits automatiquement (par exemple dans les articles les dates de publications apparaissent en anglais plutôt qu'en français, les liens "lire la suite" se transforment en "read more", etc.). La langue de l'interface d'administration change également.
Pour réaliser un site multilingue, le changemen de langue ne suffit pas => il faut demander au helpdesk l'activation de l'extension WPML.
Changer de thème
Le changement de thème permet de modifier la présentation du site. Cette opération est réversible. Pour cela, aller sous Apparence > Thèmes.
Tous les thèmes ne proposent pas les mêmes options. Tous les thèmes ne sont pas adaptables à tous les types de sites. Par exemple, certains thèmes sont spécialisés: pour un blog, un magazine, un portfolio, etc.
Lors d'un changement de thème, il faut parfois paramétrer à nouveau l'affichage de certains éléments: en-tête, menu de navigation, widgets, etc.
8. Les extensions
Les extensions permettent d'ajouter des fonctionnalités supplémentaires à un site WordPress. Cependant beaucoup d'extensions
- ne sont pas mises à jour régulièrement
- ne sont pas compatibles entre elles
- ne sont pas conçues pour une installation multisite comme la nôtre
- ou posent des problèmes de sécurité, de stabilité et de performance.
Seules les extensions disponibles sur nos serveurs sont disponibles pour réaliser votre site. Vous n’avez pas la possibilité d’en installer d’autres par vous-même. Voir la liste de ces extensions à disposition sur nos serveurs.
Certaines extensions nécessitant un paramétrage préalable des administrateurs du serveur sont activables sur demande (exemple: WPML pour les sites multilingues).
Nous ne pouvons fournir aucune garantie de fonctionnement ou de disponibilité dans le long terme pour les extensions mises à disposition. Il se peut que leurs auteurs cessent de les mettre à jour dans le futur, et que nous soyons contraints de les retirer de nos serveurs.
9. Aide
Pour toute question relative aux sites web, contacter le helpdesk du Ci par email à helpdesk@unil.ch .
En cas de problème, merci de le décrire aussi précisément que possible, avec adresse de la page, capture d’écran, etc.
Documentation à l'UNIL
- sur le site du Ci: informations générales sur l'offre web, formulaires de demandes, accès aux statistiques, etc. https://www.unil.ch/ci/web
- actualités sur l'offre en matière de publication web: https://wp.unil.ch/infoweb
- documentation pour l'édition des sites web: https://wiki.unil.ch/ci/books/sites-web
- plusieurs didacticiels WordPress sur LinkedIn Learning via votre compte UNIL: https://www.unil.ch/ci/e-learning
Documentation hors UNIL
- documentation en anglais (complète)
- documentation en français (partielle, en cours de traduction)
- le site de la communauté francophone https://wpfr.net
L'éditeur de WordPress
Ce document traite spécifiquement de l'interface d'édition des pages et des articles. Si vous en êtes à vos débuts avec WordPress, nous vous conseillons de lire au préalable le chapitre débuter avec WordPress.
Introduction
Dans l'éditeur de contenu de WordPress apparu fin 2018, aussi nommé éditeur de blocs, tout élément de contenu est un bloc:
- un paragraphe est un bloc
- un titre est un bloc
- une image est un bloc
- etc.
Le "bloc par défaut" est le bloc paragraphe : si on commence directement à saissit du texte sur une page, on créé par défaut un bloc paragraphe. Si on veur créer un contenu autre qu'un paragraphe, il faut cliquer sur l'icône + (dans la page ou en haut à gauche) pour choisir un autre type de bloc.
Voici comment créer une page avec l'éditeur de blocs:
Voir tous les types de blocs disponibles
Il existe 5 groupes de blocs:
Texte | pour |
formater le texte |
Média | insérer images, son, vidéos, etc. | |
Apparence | gérer la mise en page | |
Widgets | insérer du contenu relatif aux extensions | |
Contenu embarqué | insérer du contenu de sites externes |
Prévisualiser et enregistrer
Structurer le texte
Si le texte est assez long, il est conseillé de le structurer avec des intertitres. Il existe 6 niveaux de titres en HTML, de H1 (le plus important, réservé au titre de page) à H6, le moins important. En général, on utilise couramment H2 et H3 pour subdiviser, rarement au-delà.
Insérer des liens
Dans un bloc "paragraphe", créer un lien interne (=vers une autre page du même site):
Dans un bloc "paragraphe", créer un lien externe (=vers un autre site):
Insérer des images et des documents PDF
Ce point est traité dans le chapitre débuter avec WordPress.
Modifier les propriétés de la page
Plusieurs propiétés concernant toute la page, et non pas un bloc en particuler, peuvent être paramétées.
Gérer les blocs avec la "vue liste"
Dans les cas de blocs imbriqués, comme par exemple un bloc texte dans un bloc colonne, la "vue liste" permet d'en afficher la hiérarchie, ainsi que de le déplacer
On peut également remonter d'un niveau dans la hiérarchie de blocs imbriqués en survolant le type d'un bloc pour faire apparaître un lien vers le bloc de niveau supérieur.
Groupes et blocs réutilisables
Si on souhaite gérer plusieurs blocs ensemble, afin de pouvoir par exemple leur attribuer une même couleur de fond, on peut les sélectionner pour en faire un groupe.
Si on souhaite ensuite faire apparaître ce groupe sur plusieurs pages, on peut le transformer en bloc réutilisable.
Editeur de blocs et bloc "classique"
Si on édite avec l'éditeur de blocs une page créée avec "l'ancien éditeur" proposé jusqu'en 2019, son contenu se trouve dans un bloc de type "classique" identique à l'ancien éditeur. On peut alors à choix:
- soit continuer l'édition dans le bloc "classique"
- soit convertir ce contenu en blocs, pour pouvoir utiliser les possibilités de l'éditeur de blocs (opération non réversible):
Liens utiles
Ressources utiles sur le site officiel wordpress.org pour utiliser l'éditeur de blocs:
- Documentation en français (partielle)
- Documentation en anglais (complète)
Thèmes sur nos serveurs WordPress
Pour des raisons de stabilité, sécurité et performance de nos serveurs WordPress, nous mettons à disposition uniquement un nombre limité de thèmes. Comme précisé dans nos conditions d'hébergement, vous n'avez pas la possibilité d'en télécharger d'autres, ni d'éditer ou modifier ceux qui sont fournis. Vous pouvez utiliser uniquement ceux qui figurent dans la liste ci-dessous.
Nous ne pouvons fournir aucune garantie dans le long terme de fonctionnement ou de disponibilité des thèmes mis à disposition : s'ils ne sont plus mis à jour par leurs auteurs ou compatibles avec les versions récente de WordPress, nous devons les retirer de nos serveurs.
Changer de thème
Le changement de thème permet de modifier la présentation du site. Tous les thèmes ne proposent pas les mêmes options. Tous les thèmes ne sont pas nécessairement adaptables à tous les types de sites.
Par exemple, certains thèmes sont spécialisés pour un blog, un magazine, etc.
Lors d'un changement de thème, il faut fréquemment paramétrer à nouveau l'affichage de certains éléments, tel que par exemple:
- l'en-tête
- les images à la une
- les menu de navigation
- les widgets
- une éventuelle CSS personnalisée.
Les thèmes actuellement disponibles
Chaplin
- thème polyvalent pour différents type de sites
- c'est actuellement le thème par défaut pour les sites nouvellement ouverts sur nos serveurs
- description
- informations complémentaires
- notre guide d'utilisation pour ce thème
Twenty Twenty
- thème polyvalent pour différents type de sites
- description
- informations complémentaires et article
Twenty Twenty-Five
- thème polyvalent pour différents type de sites
- fonctionne selon le nouveau principe de l'édition complète de site (full site editing) apparu en 2022
- description
- informations complémentaires
- fonctionnement de l'édition complète de site, pour les thèmes basés sur des blocs
- actuellement nous ne pouvons fournir qu'un support partiel et limité pour ce thème (support best effort) => des cours seront organisés ultérieurement
Guide du thème Chaplin pour WordPress
Chaplin est l'un des thèmes proposés sur nos serveurs WordPress.
Voici des explications pour utiliser quelques unes de ses nombreuses possibilités.
Ses principales caractéristiques sont décrites dans notre liste des thèmes disponibles.
Modèles de page
Selon la quantité de contenu qui figurera sur la page et le type de contenu, Chaplin propose différents modèles de page. Voici où sélectionner le modèle utilisé par la page et (optionnellement) définir une image mise en avant:
Voici la même page affichée avec différents modèles, tout d'abord sans image mise en avant:
puis avec une image mise en avant:
Réglages d'affichage de l'en-tête
Dans les options de personnalisation, il est possible de choisir parmi plusieurs réglages pour l'en-tête:
- en-tête qui reste toujours affiché en haut de la fenêtre même quand on fait défiler la page
- afficher l'icône de recherche dans le site
- affichage du menu de navigation sous forme de liste horizontale ou d'icône identique à l'affichage pour mobile
- afficher les icônes de liens vers nos comptes sur les réseaux sociaux
Afficher le chemin d'accès aux pages
Pour les sites avec une structure en arborescence à plusieurs niveaux, il peut être intéressant d'afficher le chemin d'accès aux pages.
Insérer un logo dans le pied de page
Pour ajouter un logo dans le pied de page, il faut tout d'abord le préparer:
- redimensionnement à la taille souhaitée avant de le charger dans la médiathèque
- utiliser un format PNG, GIF ou JPG
Ensuite le logo peut être ajouté grâce à un widget de type "HTML personnalisé":
Images utilisées dans les exemples: © Hdim1993 | Dreamstime.com
Extensions sur nos serveurs WordPress
Pour des raisons de stabilité, sécurité et performance de nos serveurs WordPress, nous mettons à disposition uniquement un nombre limité d'extensions. Comme précisé dans nos conditions d'hébergement, vous n'avez pas la possibilité d'en télécharger d'autres, ni d'éditer ou modifier celles qui sont fournies. Vous pouvez utiliser uniquement celles qui figurent dans la liste ci-dessous.
De plus, nous ne pouvons fournir aucune garantie dans le long terme de fonctionnement ou de disponibilité des extensions mises à disposition : si elles ne sont plus mis à jour par leurs auteurs, nous sommes contraints de les retirer de nos serveurs.
Activer une extension
N'activez que les extensions nécessaires (=que vous utilisez) et désactivez celles que vous n'utilisez pas. L'utilisation d'extensions consomme de la mémoire. Un grand nombre d'extensions activées simultanément sur un site va ralentir le chargement des pages et créer une expérience utilisateur décevante pour les visiteurs.
Les extensions actuellement disponibles
Articles
- Post Expirator – permet de définir une date d’expiration automatique pour un article publié
- Akismet – anti-spam pour commentaires
Bibliographies
- Zotpress - permet d'afficher dnas le site des éléments provenant d'une biblioraphie Zotero - extension activable sur demande au helpdesk
Formulaires
- Gravity Forms - création et gestion de formulaires (documentation de l'éditeur)
Gestion de fichiers (images et documents)
- Filebird - permet d'organiser la médiathèque d'un site avec des dossiers virtuels
Images
- Easy FancyBox – différents effets pour galeries d’images, avec plusieurs options
- Meta Slider – insertion d’un slider d’images
- Regenerate Thumbnails – après un changement de la taille des vignettes dans les réglages des médias, permet de ré-générer des vignettes aux nouvelles dimensions pour toutes les images déjà présentes dans la bibliothèque de médias
- The Icon Block - insertion d'icônes SVG
Maintenance
- Under Construction - permet de rendre un site temporairement non visible par les visiteurs, par exemple pendant sa phase de création initiale ou pendant une refonte (le site reste accessible pour les éditeurs)
- Page list – affiche les sous-pages d’une page ou une liste des pages du site
Mise en page
- iframe – insertion d’un iframe dans une page
- Table of Contents Plus - création d'une table des matières au début d'une longue page
- Shortcodes Ultimate – ajout d’éléments de présentation: onglets, accordéons, boutons, etc. (documentation)
Multilinguisme
Attention: 2 langues = 2 fois plus de travail !
Ces extensions sont activables sur demande à helpdesk@unil.ch .
Lire auparavant nos explications sur le multilinguisme.
- TranslatePress - gestion multilingue pour les cas courants (site intégralement traduit)
- WPML – gestion multilingue pour les cas complexes (par exemple site partiellement traduit, exceptions diverses, etc.)
- MailPoet – création et envoi de newsletters, avec gestion d’abonnés (informations complémentaires) – extension activable sur demande au helpdesk
Moteur de recherche
- Relevanssi – améliore la fonctionnalité de recherche fournie par défaut dans WordPress (à travers le widget recherche ou l’icône recherche dispoonible dans certains thèmes) : les résultats de recherche sont plus pertinents et mis en évidence dans leur contexte. Après actvation, penser aux réglages : Réglages > Relevanssi (documentation)
Référencement
-
Google XML Sitemaps - activée par défaut sur tous nos sites, envoie aux moteurs de recherche une carte des sites au format XML (informations sur ce format) ; accès aux paramètres depuis le tableau de bord: Réglages > XML-Sitemap Very Simple Meta Description - permet d'ajouter dans le champ "extrait" des pages et des articles un texte pour la balise meta description utilisée dans l'affichage des résultats par les moteurs de recherche (marche à suivre)Open Graph and Twitter Card Tags - permet d'ajouter des balises Open Graph pour améliorer le rendu lors du partage d'articles sur les réseaux sociaux - extension activable sur demande au helpdesk- SEOPress - activé par défaut sur tous nos sites depuis début 2025. Remplace les extensions dédiées au référencement jusque là.
Réseaux sociaux
Tableaux complexes (lorsque le bloc "tableau" ne suffit plus)
- Ninja Tables - permet la création de tableaux complexes avec plusieurs options de tri, d'affichage et d'import/export
- Ninja Charts - le complément de Ninja Tables pour la génération et l'affichage de graphiques
Gestion des droits d'édition dans WordPress
Les webmasters des sites WordPress hébergés par le Ci ont un rôle d'administrateur selon la terminologie WordPress. Ceci leur permet de gérer directement les droits d'accès pour les autres personnes qui doivent éditer leur site, sans passer par le Ci.
Toute personne disposant d'un rôle administrateur d'un site WordPress peut ajouter / modifier / supprimer des droits d'édition pour ce site à une autre personne qui possède un compte informatique UNIL.
Les différent rôles
Pour gérer le contenu d'un site WordPress, il existe différents rôles possibles. En voici la liste, depuis celui qui offre le moins de possibilités à celui qui en offre le plus :
rôle | permet de |
abonné | accéder en lecture à des pages protégées |
contributeur | écrire des articles (sans images) et les proposer pour publication |
auteur | écrire, publier et supprimer ses propres articles |
éditeur |
|
administrateur |
|
Ces rôles concernent l'ensemble d'un site : il n'est pas possible de donner à quelqu'un des droits d'édition uniquement pour une partie d'un site.
Se connecter à l'interface d'administration
- aller à l'adresse de connexion: ajouter /wp-admin à l'adresse de la page d'accueil du site, sur le modèle https://adresse_du_site/wp-admin (exemple fictif: https://wp.unil.ch/xyz/wp-admin )
- s'identifier avec votre compte edu-ID
Ajouter des droits d'édition
Il faut pour cela que la personne à laquelle on veut attribuer des droits possède un compte utilisateur UNIL ouvert et un compte edu-ID lié à son compte UNIL.
- aller dans "comptes" > "add UNIL user"
- indiquer l'adresse mail UNIL de la personne à laquelle on veut attribuer des droits, ainsi que le rôle souhaité
Pour ajouter des droits à une personne qui a un compte UNIL sans adresse mail UNIL, il faut indiquer l'adresse mail spécifiée dans son compte edu-ID comme associée à son compte UNIL.
Modifier les droits d'édition
Si une personne possède déjà des droits d'édition d'un site, on peut les modifier pour lui attribuer un rôle différent.
Supprimer les droits d'édition
On peut également supprimer les droits d'édition d'une personne.
Formulaires WordPress avec Gravity Forms
Découvrez la documentation détaillée de Gravity Forms sur le site de l'éditeur.
En complément à cette documentation, voici quelques remarques et conseils pratiques.
Possibilités de Gravity Forms
Gravity Forms propose par défaut beaucoup plus de fonctionnalités que Contact Form 7 utilisé sans extensions complémentaires. Mentionnons notamment:
- une interface de création par glisser/déposer et un aperçu avant publication
- le choix (via champs avancés) parmi un grand nombre de types de champ: date, heure, adresse, nom (sur 2 colonnes ou plus au choix), adresse de site web etc.
- une collecte automatique des données envoyées via les formulaires, qui vous permet de les consulter dans l'interface d'administration de WordPress même si vous avez égaré les emails de notification ou que vous n'en avez pas configuré
- parmi ces données, la possibilité de les filtrer avant de les exporter, par exemple en vue de les récupérer dans Excel
- des options pour limiter l'affichage d'un formulaire selon des critères de date (formulaire affiché jusqu'à telle date) ou de nombre d'envoi (formulaire disponible jusqu'à ce que x personnes se soient inscrites)
- une logique conditionnelle qui permet de faire apparaître des champs ou pas selon la reponse de certains champs
Conseils d'utilisation
Pour construire le corps du formulaire, Gravity Forms offre une quantité de champs qui peuvent être glissés de la barre latérale de droite vers le formulaire.
Il est à noter que la section "Champs avancés" contient de nombreux champs utiles, tels que "Nom", "Email", "Téléphone" (pensez à sélectionner le format "international" dans les réglages du champ), etc. qui sont souvent utilisés dans des formulaires. À la différence d'une simple ligne de texte, ces champs appliquent des restrictions supplémentaires pour vérifier que l'utilisateur entre les données correctement.
Message de confirmation
Lors de l'envoi d'un formulaire, par défaut un message de confirmation "Merci de nous avoir contactés ! Nous vous répondrons dans les plus brefs délais." s'affiche à la place du formulaire. Il est cependant assez peu visible, surtout si la page contient d'autres éléments en plus du formulaire => nous conseillons de le modifier pour le rendre plus visible:
Notifications administrateur
Configuration du message reçu par la personne qui gère le formulaire lorsque quelqu'un le remplit (dans l'onglet "Notifications" des réglages du formulaire):
Le champs "Répondre" vous permet de répondre à l'e-mail de notification, il est donc impératif de préciser l'adresse e-mail de l'utilisateur, si elle est demandée dans le formulaire.
Insertion du formulaire dans une page
Pour insérer un formulaire Gravity Forms dans une page, ajoutez un bloc "Gravity Forms". Sélectionnez ensuite le formulaire à afficher parmi la liste.
Limite technique: on ne peut insérer qu'un seul formulaire par page. Si vous souhaitez utiliser plusieurs formulaires sur votre site, chacun devra figurer seul sur une page distincte.
Consulter les réponses
- Depuis l'interface d'administration de Wordpress, cliquer le menu "formulaires" (1) puis sur "entrées" (2)
- Sélectionner le formulaire depuis le menu déroulant en haut de page (3)
- La liste des réponses s'affiche directement dans le tableau de la page
- Il est possible de sélectionner les informations qui s'affichent sur le tableau de résumé en cliquant sur la roue crantée (4) et puis en glissant et déposant les colonnes actives dans l'ordre que vous désirez
- Vous pouvez consulter les informations détaillées en cliquant sur le lien en première colonne de chaque ligne
- Vous pouvez affiner les recherches en utilisant le champ de recherche au-dessus du tableau.
Vous pouvez affecter tous les résultats en cochant la boite sur la première ligne puis en utilisant le menu déroulant et en validant la sélection.
Supprimer les données
- Pour supprimer toutes les réponses, cochez la boite sur la première ligne, sélectionnez l'option "corbeille" et cliquez sur le bouton "Appliquer"
- En cas d'erreur, ces informations sont toujours disponibles sous l'onglet "Corbeille" (point n°1)
- Pour supprimer définitivement toutes les entrées de la corbeille, utilisez le bouton "Vider la corbeille" (point n°2).
Une fois la corbeille vidée, il est impossible de récupérer les informations supprimées. Nous vous conseillons d'archiver ces données avant de les supprimer.
Archiver / exporter
- Pour récupérer les informations d'un formulaire, cliquez sur Importer/Exporter (1) depuis le menu Formulaires
- Assurez-vous d'être sur l'onglet Exporter des entrées
- Sélectionnez un formulaire avec le menu déroulant (2)
- Sélectionnez les champs du formulaire que vous voulez exporter
- Sélectionnez une plage de date, si laissée vide, toutes les entrées sont exportées
- Cliquez sur Télécharger le fichier d'export pour récupérer toutes les données en format "CSV" (format qui peut être ouvert et édité avec Excel).
Protection contre les spams
Les formulaires Gravity Forms sont protégés contre les spams par des captchas invisibles, ainsi que par le service Akismet. Ces protections servent à identifier les entrées frauduleuses, mais parfois peuvent classifier une entrée légitime comme du spam. Pensez donc à vérifier régulièrement l'onglet "Indésirables" sous Formulaires > Entrées, car des informations importantes pourraient s'y trouver:
Newsletter dans WordPress avec MailPoet
L’outil MailPoet est une extension WordPress pour créer et gérer l’envoi de newsletter. Après le réglage de l’extension par le CI, vous êtes prêt·e à l’utilisation de cet outil !
Afin de créer une newsletter, trois composants sont nécessaires :
- un e-mail (la newsletter en tant que telle)
- des abonné·e·s (les personnes à qui vous souhaitez envoyer votre newsletter)
- une liste (le regroupement de mes abonné·e·s)
Les abonné·e·s
Vos abonné·e·s sont absolument nécessaires, créer une newsletter sans personne à qui l’envoyer ne fait aucun sens. Il existe trois manières d’obtenir ces personnes pour votre base de données :
- Ajouter manuellement chaque personne, les unes après les autres
- Importer un fichier avec les adresses mail, nom et prénom de vos futur·e·s abonné·e·s
- Créer un formulaire d’inscription à la newsletter
1. Ajouter manuellement des abonné·e·s
2. Importer des abonné·e·s
Dans le menu "Importer", vous pouvez importer un fichier en format CSV avec les informations des personnes. Il est possible de demander une telle liste directement au modérateur du groupe UNIL que vous souhaitez atteindre. Si ce groupe est soumis à des changements récurrents (par ex. tous-xxx) nous vous conseillons de le réimporter avant chaque envoi de la newsletter.
Le format requis par MailPoet étant : adresse mail, prénom, nom. Les virgules sont nécessaires entre chaque champ pour que la personne soit importée dans la base de données. Pour séparer les différent·e·s abonné·e·s un retour à la ligne est nécessaire.
Vous avez également la possibilité de "Coller les données dans une boîte de texte". Cette méthode vous permet de directement copier et coller votre liste depuis Excel, ce qui peut être plus simple que l'importation d'un fichier.
3. Créer un formulaire d’inscription à la newsletter
La troisième solution concerne davantage les utilisateurs externes de l'UNIL: l'inscription à une newsletter. Cette inscription s’effectue par le remplissage d’un formulaire et donc requiert la rédaction de ce formulaire au préalable. Nous vous conseillons d'y inscrire au minimum quatre champs : adresse email, nom, prénom ainsi que la ou les listes auxquelles la personne veut s'inscrire.
Le nombre d'abonné·e·s est limité à 20'000 par site au maximum ! Lorsque cette limite est dépassée, l'envoi de newsletters est désactivé, et ce même pour des envois à des listes contenant moins d'abonné·e·s que la limite. Il est donc primordial de trier et retirer de vos listes les abonnés superflus régulièrement afin de ne pas atteindre ce plafond. Même les abonnés "inactifs" et "non confirmés" comptent pour cette limite.
Les listes
Ainsi, un·e abonné·e peut appartenir à une ou plusieurs listes, et une newsletter peut être envoyée à une ou plusieurs listes. La sélection des informations que vous souhaitez envoyer au dentinaire final dépendra donc de la liste.
Pour plus d'informations et une marche à suivre, vous pouvez vous référer à la documentation de MailPoet : Créer une liste
Veuillez éviter d'abonner des listes de distribution préexistantes de l'UNIL (p.ex. etudiants@unil.ch) à vos newsletters. Privilégiez les listes d'abonnés de MailPoet à la place.
Les formulaires
Afin de permettre à tout un chacun de s’inscrire à votre newsletter (« Abonné·e·s », point 3), il est nécessaire de créer un formulaire à cette fin. L’intégration de ce formulaire se fera ensuite très aisément sur votre site WordPress par trois moyens différents :
- un widget spécifique à MailPoet
- via un block Gutenberg, ou un shortcode sur une page/article
- en le rendant disponible sur toutes les pages et articles via le créateur de formulaire
Il est important de noter que chaque thème WordPress est différent, et affiche les widgets différemment. Si vous ne pouvez pas intégrer le formulaire sur le côté du site (sidebar), il est fort probable que votre thème ne contienne pas d’espace pour ceci. Par contre, vous retrouverez au minimum un espace de widget dans le pied de page (footer).
Naturellement, un nouveau formulaire demande au minimum l’adresse mail de l’individu, ainsi que la liste à laquelle il/elle souhaite s’inscrire. Nous vous recommandons vivement d'ajouter les champs supplémentaires que sont le nom et le prénom.
Vous pouvez retrouver les étapes en détail au lien suivant : Création d'un formulaire, doc MailPoet
Les e-mails
Pour MailPoet, tout envoi est considéré comme un mail. Ainsi, on en distingue trois types, que nous vous présentons par ordre de pertinence :
Le mail de bienvenue
Ce mail est envoyé automatiquement par MailPoet suite à l'inscription à l'une de vos listes. Il peut prendre plusieurs formes : la confirmation d’abonnement de la personne, directement après inscription, ou des envois multiples à des dates déterminées. Concernant les envois multiples, il vous sera nécessaire de paramétrer ces envois, avec le contenu à envoyer, ainsi que les dates d'envoi.
Les notifications de post
Si WordPress est votre site principal et que vous écrivez des articles suffisamment souvent, cet outil peut vous intéresser. Ce mail est également envoyé automatiquement par MailPoet, il consiste à envoyer, à une fréquence déterminée, un résumé de l’article ou des articles de la période. Le type de contenu à insérer se retrouve sous : Dernier contenu automatisé. Ainsi, vous pouvez tenir au courant vos abonné·e·s de vos activités. Dans les paramètres d'affichage disponibles vous pouvez déterminer si vous souhaitez :
- afficher le titre uniquement
- afficher un extrait
- afficher l'article complet
D'autres options sont disponibles concernant le layout, avec le positionnement de l'image, du texte, etc.
Les newsletters
L’outil qui vous intéressera (et sûrement celui pour lequel vous lisez cette documentation). La newsletter permet d’envoyer, par mail à vos abonné·e·s l’information que vous souhaitez transmettre. Une newsletter peut regrouper deux types de contenu :
- un contenu reprenant tout ou partie du contenu de votre site WordPress (voir Dernier contenu automatisé ou Articles)
- un contenu réalisé manuellement avec les outils disponibles (voir Le contenu)
Style et layout
Le modèle
La première étape de la création d’une newsletter consiste à choisir un modèle. Le modèle que vous avez créé, ou qui est disponible, comprenant une identité visuelle ainsi que des éléments fixes qui se retrouvent dans vos différentes newsletters.
Choisir un modèle vide ou en reprendre un déjà existant pour le modifier peut devenir un choix épineux ; voici quelques conseils :
Le modèle vide est idéal pour une personne avec des connaissances graphiques soutenues, ainsi que des compétences créatrices. Ou alors une personne préférant garder un style très simple.
Pour une personne avec peu d’expérience graphique, ou en recherche d’idées, la reprise d’un modèle est le bon choix. Cela vous permet de reprendre une structure déjà éprouvée ainsi que d’apprendre/vous inspirer des possibilités offertes par MailPoet.
Notez que ce choix est indispensable uniquement pour la première newsletter. Vous pourrez reprendre le modèle déjà créé pour les prochaine, ou encore dupliquer un newsletter déjà envoyée en modifiant les éléments que vous souhaitez.
Style
Le style permet une uniformisation de la newsletter, ceci en choisissant la police, taille et couleur du texte et des titres. Il sera appliqué à tout le reste de votre newsletter.
Vous pouvez également choisir l’espacement des textes ainsi que la couleur d'arrière plan et du fond de contenu de la newsletter.
Le contenant (mise en page)
MailPoet vous propose plusieurs types de mise en page, de une à trois colonnes avec une répartition équivalente ou en format un tiers - deux tiers. Ces différents types de mise en page peuvent être utilisés isolément ou ensemble au sein de la même newsletter.
Le choix du nombre dépendra du style que vous souhaitez donner à votre newsletter. Pour proposer un article avec sa miniature, par exemple, on préférera le format en deux colonnes.
Le style sur une seule colonne permet une lecture plus attentive du texte, de même qu’il permet d'afficher une image qui ressemblera à une utilisation de type "bannière".
L'autre type de mise en page, celui en 2 tiers gauche / 1 tiers droite, ou son contraire, permet un contenu quelque peu différent. On l’utilisera davantage pour placer un bouton (call to action) ou encore un pictogramme. Deux autres outils vous seront précieux afin de gérer la mise en page de votre newsletter :
- Espacement
- Séparateur
L'Espacement permet d’ajouter de l’espace là où vous le souhaiter, que ce soit dans un bloc regroupant des colonnes, une colonne, ou entre des blocs. Comme il n’existe pas d’alignement vertical automatique, cet outil vous permettra d’aligner le contenu d’une colonne adjacente à la deuxième.
Le Séparateur remplit la même fonction que l'Espacement, c’est-à-dire de séparer les contenus. La différence réside dans l’aspect visuel ; le Séparateur se voit par une ligne de la couleur de votre choix séparant les contenus, avec une hauteur personnalisable.
Le contenu
MailPoet vous propose 8 types de contenu qu’il est possible d’ajouter dans chaque colonne :
Texte
Principal outil de création de contenu, la boîte « Text » inclus un éditeur de type « wysiwyg ». Il vous sera donc possible de faire une mise en forme simple, avec l’italique, gras, souligné, liste à puce, etc. La possibilité supplémentaire de cet éditeur est l’inclusion de shortcodes propres à MailPoet. :
- Nom, prénom, adresse mail de l’abonné
- Sujet et numéro de la newsletter
- Nombre d’articles, de pages ainsi que le titre du dernier article du site
- La date courante sous différents formats
Le contenu de ces shortcodes sera automatiquement actualisé et/ou remplacé lors de l'envoi de chaque newsletter.
Image
Comme pour WordPress ou Jahia, l’outil image permet d’inclure un visuel de votre choix qui est présent dans votre bibliothèque de médias. MailPoet laisse très peu d’options, seulement la largeur de l’image, son alignement et la présence ou non d’un padding. Il est possible d'utiliser le bloc image pour créer une bannière par exemple, si celui-ci est placer dans une colonne de pleine largeur.
Bouton
Cet outil consiste à un lien cliquable visuellement amélioré. Vous pouvez définir sa couleur, l’angle de ses bords, sa taille et sa police.
Avec les différentes versions d'Outlook utilisées par les destinataires, il peut arriver que les boutons soient tronqués ou que le texte ne s'affiche pas. Les boutons dont le libellé s'étend sur deux lignes ou plus sont verticalement réduits à une seule ligne. Une solution possible est de se limiter à une ligne courte dans le bouton et à définir la largeur du bouton pour être large.
Cette petite boîte permet d’afficher des icônes renvoyant à vos différentes plateformes sociales, comme Facebook, Twitter, Instagram ou même votre adresse mail. Comme toutes les plateformes ne sont pas proposées par défaut, il vous est offert la possibilité d’ajouter votre propre image.
Sur Outlook 2007, 2010, 2013, 2016, et 2019, les icônes de réseaux sociaux perdent leur marge, et se retrouvent "collés" les uns aux autres. Une bonne solution à ce problème est d'utiliser les icônes de réseaux sociaux sans couleur de fond.
Articles
Si vous utilisez votre site WordPress pour produire du contenu, cet outil va vous intéresser. MailPoet permet d’inclure automatiquement le contenu d’un article ou d’une page et y ajouter un lien pour lire la suite de celui ou celle-ci. Il existe notamment des options d'affichage similaire à ceux du "Dernier contenu automatisé".
Dernier contenu automatisé
Cet outil vous permettra d’afficher automatiquement les derniers contenus du site, que ce soit des articles, pages ou médias. Vous pourrez choisir le nombre d’éléments à afficher de manière simple.
Les « Options d'affichage » sont, par contre, très riches. Il est possible de choisir :
- l’alignement
- le style de titre
- le type de « lire la suite »
- l’ordre d’apparition
- des critères d’inclusion ou d’exclusion par catégorie
Si ce contenu vous intéresse, regardez dans le détails toutes les options qui vous sont offertes d’afficher ces contenus.
En-tête
L’en-tête (« Header ») est un bloc de texte standard, à la différence qu’il contient de base un lien pour faire apparaître la newsletter dans le navigateur.
Pied de page
Tout comme l’outil précédent, c’est un bloc standard de texte qui incluent automatiquement deux éléments : un lien pour se désabonner (légalement obligatoire), et un lien pour gérer son abonnement.
Veuillez éviter d'abonner des listes de distribution préexistantes de l'UNIL (p.ex. etudiants@unil.ch) à vos newsletters. En effet, dans cette configuration, vous courez le risque qu'une personne de la liste préexistante clique sur "se désabonner", ce qui entraînerait le désabonnement de cette liste en entier.
Envoi
A n'importe quel moment vous pouvez prévisualiser ce à quoi ressemble votre e-mail. Pour ceci le bloc "Aperçu" vous permet de soit, vous envoyer l'e-mail directement, soit de le prévisualiser dans le navigateur sous format desktop ou mobile. Nous vous recommandons très vivement d'utiliser cette fonctionnalité avant l'envoi, ceci vous permettra de vous assurer que les dizaines, centaines ou milliers de personnes recevant votre e-mail n'auront aucun bug.
Lorsque votre e-mail est prêt (ou non), vous rendre en bas de page permettra l’apparition d’une boîte de dialogue afin de :
- Enregistrer en tant que modèle
- Exporter en tant que modèle
- Continuer l’envoi (suivant)
L'enregistrement d'un modèle vous permet de stocker cet e-mail dans votre bibliothèque de modèles, sous "Vos modèles enregistrés". L'intérêt réside dans le fait que vous puissiez le reprendre pour de futurs e-mails, en gardant une structure que vous souhaitez.
L'exportation d'un modèle diffère dans le sens où votre modèle pourra être utilisé pour un autre site.
Envoyer: Quoi ? A qui ? De qui ? Quand ?
Pour finaliser votre envoi il est nécessaire de mentionner certaines informations :
- Premièrement le sujet de votre mail, qui, comme pour un mail standard, apparait en gras lorsque vos abonné-e-s le voient dans leur boîte mail.
- Deuxièmement, définissez à qui vous souhaitez envoyer ce mail par la sélection d’une, ou même plusieurs listes.
- Troisièmement, vous pouvez spécifiez de qui provient le mail et à qui répondre ; le plus courant étant de spécifiez votre mail générique ou même un no-reply@unil.ch (il est primordial que cette adresse se finisse par @unil.ch). De base, l'adresse que vous avez spécifié dans les réglages sera reprise.
- Dernièrement, vous avez la possibilité de sauvegarder comme brouillon ce mail, et de planifier une date et heure d’envoi ultérieur ou de l’envoyer directement. Veuillez privilégier l'envoi de vos newsletters durant la nuit via une planification.
Les réglages
Les seuls réglages que vous pouvez modifier, sans mettre en danger le fonctionnement de votre newsletter, se trouvent sous "Essentiels", "Confirmation d'abonnement" et "Avancés".
Peu de réglages vont nous intéresser ici, bien que quelques-uns peuvent être utiles. Ils concernent principalement les réglages par défaut que l’on retrouve dans les e-mails, ou encore la façon dont sont traités les nouveaux abonnés et l’affichage des newsletters sur le site WordPress ainsi que le traitement des echecs d'envois..
Onglet "Essentiels"
Comme nous l’avons vu, lors de l’envoi d’un mail il est nécessaire de paramétrer les coordonnées de la personne qui envoie celui-ci, et à qui répondre. Plutôt que de définir ce paramètre à chaque envoi, vous pouvez indiquer cette information dans ces réglages et elle sera automatiquement reprise pour chaque newsletter.
Les abonné·e·s également entraînent une notification pour chaque souscription. Vous pouvez choisir d’en être informé par mail à une adresse mentionnée dans les réglages.
Onglet "Confirmation d'abonnement"
Si l'option est activée, les abonné·e·s devront confirmer leur inscription avant de pouvoir recevoir vos newsletters.
Onglet "Avancés"
Il est important, afin de limiter les risques d'être taggué comme spammeur par différent services de messagerie ( gmail, hotmail, bluewin), de vérifier après chaque envoi de newsletter, les envois qui ont échoués. Un email d'avis d'échec est envoyé à l'adresse mail mentionnée dans Mailpoet > Réglages > Avancés > Adresse e-mail de rebond. Merci de vérifier ce paramètre avant tout envoi. Ce paramètre est global et ne peut pas être paramétré par newsletter. Vous pouvez aussi consulter le détail des envois en cliquant sur la rubrique "Etat" de la newsletter concernée dans le menu Mailpoet > E-mails.
Si des listes de distribution préexistantes de l'UNIL (p.ex. etudiants@unil.ch) sont abonnées à vos newsletters, il est primordial de vérifier dans les réglages avancés de MailPoet (MailPoet > Réglages > Avancés), que l'option "Suivi analytique de l’engagement" soit mis sur "basique", car elle engendre des problèmes majeurs de performance.
Affichage des newsletters sur le site
Dernièrement, mais pas le moins intéressant, il vous est possible d’afficher automatiquement vos newsletters passées sur votre site WordPress. Pour ceci, le shortcode indiqué sous « Archive page shortcode »1 doit être ajouté dans une page de votre site. Si vous utilisez l’éditeur classique un simple copié/collé suffira. Par contre, avec le nouvel éditeur Gutenberg, le shortcode doit figurer dans une boîte de « code court ». Plus en détail, la possibilité vous est offerte de filtrer les newsletters selon le type de liste, par exemple pour n’afficher que la newsletter « générale » et non pas celles plus spécifiques. La sélection de la liste provoquera un nouveau shortcode spécifique à cette liste2.
Une seconde solution, manuelle, est également possible. Après envoi de votre newsletter, vous pouvez revenir dans le menu E-Mails de MailPoet et obtenir le lien de celle-ci sous "Aperçu" :
Le lien de la newsletter sera celui de votre navigateur dans la barre d'adresse située en haut de votre écran.
Documentation complémentaire
En complément à notre documentation, vous pouvez également vous référer à la base de connaissances de MailPoet.
Multilinguisme facile avec TranslatePress
TranslatePress est un plugin de multilinguisme pour Wordpress, à l'instar de WPML. Il se démarque des autres extensions du genre en proposant une interface de traduction visuelle facile à prendre en main, et une configuration légère. TranslatePress permet de traduire n'importe quelle chaîne de texte visible sur votre site, y compris celles des menus, du thème, des autres extensions, ainsi que des shortcodes.
Si TranslatePress est facile à utiliser, il est aussi plus limité en fonctionnalités que WPML. Ainsi, TranslatePress est généralement préférable pour les projets de traduction simples (site entièrement traduit), et WPML pour les cas complexes (site partiellement traduit). Notre équipe peut également vous conseiller quant à la solution qui conviendrait le mieux à votre projet spécifique.
Contrairement à WPML, TranslatePress n'offre pas d'outils avancés pour la gestion des traductions, et ne permet pas de vérifier l'état global de la traduction (les chaînes de texte ou pages qu'il reste à traduire). Ces outils sont particulièrement utiles sur les sites avec beaucoup de contenu à traduire, dans quel cas WPML peut demeurer l'option à préférer.
Si vous recherchez en revanche la simplicité et la facilité d'utilisation et de mise en place, TranslatePress se présente comme la meilleure solution pour les cas courants.
Des informations complémentaires sont disponibles dans la documentation officielle de l'extension (en anglais seulement).
Installation & configuration
Afin de pouvoir utiliser TranslatePress sur votre site, il est nécessaire d'en faire la demande à helpdesk@unil.ch.
Une fois l'extension activée par notre équipe, vous pourrez accéder aux réglages de TranslatePress, sous Réglages > TranslatePress afin de définir les langues de votre site.
- Pour commencer, définissez le langage par défaut de votre site (généralement français).
- Choisissez les autres langues dans lesquelles vous souhaitez traduire votre site.
Message d'erreur
Il est à noter qu'un message d'erreur peut s'afficher dans les réglages de Translatepress:
Ce message n'a aucune importance, et l'extension continuera de fonctionner normalement.
L'apparition de cette notification est indépendante de notre volonté, et est liée à la configuration particulière de l'extension avec nos serveurs multi-sites, mais toutes les fonctionnalités premium restent activées.
Traduction
Avec cette extension, la traduction se fait depuis sur les pages de votre site, et non depuis une interface séparée. Vous pouvez y accéder depuis la barre d'administration, depuis le tableau de bord (dashboard), qui vous emmènera sur la page d'accueil, ou directement depuis la page que vous souhaitez traduire.
Interface
- Ce champ permet de sélectionner la langue depuis laquelle vous allez traduire.
- Sélectionnez la chaîne à traduire. Pour cela, vous pouvez soit survoler votre page avec la souris et cliquer sur l'icône de crayon bleu, soit à l'aide des boutons "suivant" et "précédent", ou du menu déroulant.
- La traduction se fait dans cette boîte, qui vous montre la chaîne sélectionnée dans la langue de départ (choisie au point 1), et vous permet de remplir les champs correspondants pour les autres langues.
Avertissement: modification du texte original
Attention: à cause du fonctionnement de TranslatePress, si le texte original est modifié, les traductions des paragraphes affectés ne seront plus affichées (puisqu'elles ne correspondent plus à la chaîne de caractères originale). Elles seront remplacées par le nouveau texte dans la langue d'origine.
Il est alors nécessaire de récupérer les anciennes traductions via la mémoire de traduction, puis de leur ajouter les modifications souhaitées. Ce fonctionnement est la grande faiblesse de TranslatePress, il est donc primordial de le connaître, afin de s'éviter du travail supplémentaire. Nous conseillons de n'entreprendre la traduction du contenu qu'une fois que celui-ci est terminé et corrigé dans sa langue d'origine. Modifier plusieurs fois un texte qui aurait été déjà traduit peut prendre beaucoup de temps.
Traduction des extraits d'articles
N'oubliez pas de traduire également les extraits d'articles qui pourraient s'afficher de manière automatique sur la page "blog" de votre site, ou dans un bloc "Boucle de requêtes" !
Ceci est dû au fonctionnement de TranslatePress, qui considère que le texte original (1) et l'extrait (2) sont des chaînes de caractères différentes. Si le début du texte original est modifié, l'extrait généré automatiquement le sera aussi, et les traductions de l'extrait ne seront plus affichées, et devront être révisées.
Cas spécial
Dans le cas où des indices ou exposants se trouveraient dans le texte à traduire, TranslatePress considère par défaut que ces indices et exposants sont des chaînes à traduire séparément. Ce comportement est problèmatique par exemple dans le cas de 1er, 2e, 3e, 4e etc. Pour TranslatePress, ces trois "e" sont une seule et même chaine, et serait traduite vers l'anglais en p.ex. 1st, 2th, 3th, 4th, ce qui n'est pas idéal. Pour pouvoir traduire chaque exposant séparément, vous pouvez cliquer sur l'icône de flèche verte qui s'affiche en survolant la chaîne de texte en question, qui permet de traduire le bloc de texte en entier.
Sélecteur de langage
Par défaut, le sélecteur de langage de TranslatePress se présente comme un menu flottant. Vous pouvez choisir l'apparence ou changer le sélecteur, dans les réglages de TranslatePress (voir la documentation officielle du sélecteur de langage pour plus de détails).
Un cas d'utilisation courant est la présentation du sélecteur de langues comme un élément de menu.
TranslatePress permet de réaliser ce type de présentation. Pour ce faire, l'extension ajoute un élément "Language Switcher" dans le constructeur de menu Wordpress (Apparence > Menus). L'exemple ci-dessous permet d'obtenir un sélecteur de langage qui affiche la langue actuelle, et les autres langues dans un menu déroulant:
- Ajouter toutes les langues, y compris "Langue actuelle", élément de menu qui affiche la langue actuellement sélectionnée dans le menu.
- Organiser les éléments de menus ajoutés de telle façon que toutes les langues soient des sous-éléments du menu "Langue actuelle".
Questions fréquentes sur l'édition WordPress
Quelques questions ou problèmes courants que vous rencontrerez peut-être lors de l'édition de votre site WordPress UNIL.
1. Editer un site WordPress hors du réseau UNIL: le VPN UNIL est nécessaire
Pour des raisons de sécurité, l’édition des sites web WordPress UNIL doit 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 (qui s'appelait autrefois Pulse Secure).
Important:
L’installation de l’application client Ivanti Secure Access est requise, le simple accès à la passerelle web crypto.unil.ch sans avoir installé Ivanti ne donne pas accès à toutes les fonctionnalités d’édition de WordPress.
2. Se connecter pour éditer
- aller à l'adresse de connexion: ajouter /wp-admin à l'adresse de la page d'accueil du site, sur le modèle https://adresse_du_site/wp-admin (exmple fictif: https://wp.unil.ch/xyz/wp-admin )
- s'identifier avec votre compte edu-ID , que vous devez auparavant avoir lié avec votre compte UNIL si cela n'a pas déjà été fait
3. Ajouter des droits d'édition
Pour ajouter des droits d'édition à une personne qui doit pouvoir éditer votre site, merci d'utiliser cette marche à suivre: Gestion des droits d'édition dans WordPress.
4. Problèmes temporaires (seront corrigés prochainement ou dans une future version)
Galeries d'images "en colonnes"
Dans certaines galeries d'images créées avant le passage à WordPress 6.1 (=avant mi-novembre 2022), les images précédemment affichées côte à côte sont maintenant affichées sous forme d'une colonne verticale.
Pour rectifier ceci, il faut aller dans les CSS personnalisées et ajouter ce correctif:
/* WP 6.1 Gallery Bugfix */
body .is-layout-flex {
display: flex;
flex-wrap: wrap;
padding-bottom: 10px;
}
Bonnes pratiques pour la gestion des médias dans Wordpress
Une gestion rigoureuse des fichiers médias permet d’améliorer les performances de votre site, de réduire l’espace disque utilisé et de limiter l’impact environnemental du Web. Ce guide présente les bonnes pratiques à adopter lors de l’importation et de la gestion d’images sur un site WordPress.
TL;DR: Une image individuelle sur le Web ne devrait généralement pas dépasser une taille de 200ko.
Pourquoi optimiser les images ?
Les images sont l’un des principaux facteurs de poids d’un site web. Lorsqu’elles sont mal optimisées (fichiers trop lourds, formats inadaptés, dimensions excessives), elles peuvent :
-
Ralentir le chargement des pages, ce qui a un impact sur le référencement par les moteurs de recherche
-
Dégrader l’expérience utilisateur, en particulier sur mobile
-
Occuper inutilement l’espace disque du serveur
-
Alourdir les sauvegardes et les migrations
Bonnes pratiques générales pour les images
Pour simplifier ces optimisations, nous recommandons l’outil Squoosh : une application web gratuite, simple d’utilisation, qui permet de compresser, redimensionner et convertir les images dans des formats plus adaptés au Web. Même avec les réglages par défaut, Squoosh permet généralement de réduire considérablement le poids des images sans perte visible de qualité. Il constitue donc une excellente solution tout-en-un pour préparer vos images avant de les importer dans WordPress.
Choisir un format adapté
-
JPEG : recommandé pour les photographies. Il permet une bonne compression avec un rendu visuel de qualité.
-
WEBP : format moderne existant depuis 2010, plus efficace que JPEG, pris en charge par la majorité des navigateurs et compatible avec les installations WordPress UNIL. Si possible, préférez ce format à JPG et PNG.
-
PNG : à réserver aux cas spécifiques (transparence, schémas simples avec peu de couleurs). À éviter pour les photos.
- SVG : idéal pour les logos, icônes et schémas vectoriels. Léger, redimensionnable sans perte de qualité, et préférable au PNG si le visuel s’y prête. Attention : on ne peut pas convertir une photo ou une image bitmap en SVG de manière directe ou utile.
Compresser les images
Avant d’importer une image dans la médiathèque, il est recommandé de la compresser.
-
Format recommandé : WEBP ou JPEG
-
Taux de compression conseillé : entre 70 % et 75 %
-
Exemple : une image PNG de 3 Mo peut généralement être réduite à moins de 150 Ko sans perte visible de qualité
Redimensionner les images
-
Importer des images à la taille réellement nécessaire à l’affichage sur le site
-
Par exemple, inutile de téléverser une image de 3000 pixels de large si elle est affichée en 600 pixels
- 1200px de largeur est largement suffisant pour l'utilisation d'une image sur le Web.
Fonctionnement de WordPress et implications
Multiplication des versions d’images
Lorsqu’une image est téléversée, WordPress en génère automatiquement plusieurs versions à différentes tailles (miniatures, moyennes, grandes, etc.). Certains thèmes ou plugins peuvent ajouter d’autres formats personnalisés.
-
Chaque image téléversée peut donc être dupliquée 5 à 10 fois
-
Si l’image d’origine est lourde, ces copies peuvent représenter un poids considérable sur le serveur
Images dans la corbeille
-
Les images supprimées via la médiathèque ne sont pas immédiatement effacées : elles sont déplacées dans la corbeille
-
Elles continuent à occuper de l’espace disque pendant 30 jours, jusqu’à suppression automatique
-
Il est conseillé de vider manuellement la corbeille pour libérer rapidement de l’espace :
-
Accéder à Médias > Médiathèque
-
Filtrer par "Corbeille"
-
Cliquer sur "Vider la corbeille"
-
Recommandations concrètes
Avant de demander une extension de l'espace à disposition pour votre site, nous vous recommandons de :
-
Supprimer les fichiers volumineux inutiles ou mal optimisés
-
Vider la corbeille de la médiathèque
-
Optimiser les images conservées : compression, conversion au format WEBP, redimensionnement
-
Suivre ces bonnes pratiques pour les prochaines importations
Des plugins comme Media Cleaner (nettoyage des fichiers non utilisés) et Media Deduper (suppression des doublons) peuvent aider à faire le tri, mais doivent être utilisés avec précaution. Ces plugins peuvent être activés sur votre site sur demande au helpdesk.