Personnalisation du backend de Drupal 8 - Solutions et astuces

Un thème spécifique pour le back-office

Une des spécificités de Drupal est de permettre d'avoir 2 thèmes (templates) séparés, un pour la partie publique et l'autre pour le back-office. Le thème fournit par défaut avec Drupal 8/9 n'est pourtant pas celui que la majorité des utilisateurs préfèrent avoir au quotidien.

Il existe selon nous 3 alternatives intéressantes et un thème à suivre :

• Adminimal ;
• Claro ; 
• Gin.

Adminimal

C'est un thème de back-office très populaire parmi la communauté qui offre une interface au style material design. Voici quelques copies d'écrans :

Quelques fonctionnalités importantes :

• Conception minimaliste axée sur l'expérience utilisateur ;
• Amélioration de la navigation dans le menu grâce au sous-module Adminimal Menu ;
• Boutons colorés pour les tâches courantes afin de faire ressortir les éléments importants au quotidien ;
• Eléments textuels importants mis en avant par une taille plus importante ;
• Mise en forme des tableaux qui aide à se concentrer sur la ligne en cours sur laquelle vous travaillez ;
• Belles icônes qui améliorent l'aspect et la convivialité de l'ensemble, mais aussi la facilité d'utilisation ;
• Messages de notification du back-office retravaillés pour permettre une meilleure compréhension du contenu du message ;
• Basé sur le thème d'administration original de Drupal Seven (surtout utile pour les utilisateurs habitués à Drupal qui ne perdront pas leurs repères).

Claro

Claro est un thème d'administration Drupal propre, accessible et puissant construit dans le cadre de l'initiative de modernisation de l'interface utilisateur. Cette équipe travaille à la modernisation de l'aspect et de la convivialité du back-office. Claro est le futur thème par défaut de Drupal 9 et peut d'ors-et-déjà être installé / testé.

A lire : Nous avons testé Claro, nouveau thème d'admin Drupal 8 et 9 - Samedi 11 Avril 2020

Voici quelques copies d'écrans : 

Gin

A noter également qu'une version officielle basée sur Claro est en cours de finalisation et devrait voir le jour d’ici peu : Gin. Gin pousse encore plus loin l’expérience utilisateur en proposant une interface innovante et très facile d’accès. Ce thème propose également un mode sombre activable automatiquement selon les préférences de votre système d’exploitation.

Voici quelques copies d'écrans : 

Nous regardons régulièrement ce type de thèmes pour voir s'ils sont adéquats.

Notre avis

Claro nous semble à ce stade un meilleur candidat que Adminimal (mais ce dernier va sans doute lui aussi s'améliorer) car il s'inscrit dans une réflexion globale initiée par la communauté Drupal pour améliorer l'expérience des administrateurs et contributeurs de sites. Néanmoins, l'ajout d'un nouveau thème n'est pas une solution miracle ou suffisante. L'aspect du back-office sera moins austère, mais il y aura toujours une marge d'amélioration.

Modules additionnels

Il existe un certain nombre de modules contribués qui peuvent faciliter la tâche des administrateurs.

Field Group

Le module Field Group permet de regrouper les champs du back-office en grandes sections / onglets.

Il pourra être utilisé afin de ne pas avoir systématiquement des formulaires de saisies à rallonge et permette au contributeur d'accéder plus facilement à la section qui l'intéresse.

Entity Browser

Le but de ce module est de fournir un navigateur/sélecteur d'entités génériques. Une entité pouvant être un contenu déjà existant, un bloc, une image, un autre contenu multimédia, etc. Ces fonctionnalités existent déjà par ailleurs, mais ce module offre une interface plus simple et plus pratique à utiliser.

Personnalisation et configuration du back-office

Au delà du choix et d’un thème et de l’ajout de modules qui ne sont pas des solutions miracles dans 100% des cas, la simplification du back-office Drupal est en dernier lieu une affaire de personnalisation et de configuration. Le back-office de Drupal, “nature”, peut intimider mais le CMS n’est pas restrictif sur ce point et permet toute sorte d’aménagements.

Affichage en fonction des droits / rôles utilisateurs

Le principe est que si l’utilisateur n’as pas accès à une rubrique, il ne la verra pas en back-office.

Un contributeur ne verra généralement que la section “Contenu” de l'espace d'administration ou de contribution lui permettant de saisir de nouvelles pages mais pas “Configuration”, “Structure” ou encore “Apparence” qui seront réservées à des administrateurs plus techniques.

De même si un contributeur ne peut intervenir que sur les actualités, il ne verra alors que le menu “Ajouter une actualité” dans son back-office à la section “Ajouter du Contenu”.

Dans un formulaire d’ajout d’un contenu, par exemple, si l’utilisateur n’a pas en parallèle le droit de modifier les métadonnées d’une page, il ne verra pas cette section dans son masque de saisie.

Enfin, l’éditeur WYSIWYG pour les champs textes “longs” est CKeditor par défaut. Là aussi en fonction de ce que peut / doit faire le contributeur, le nombre d’icônes et de fonctionnalités peut être ajusté.
Ex : Juste gras / italique / listes à puces pour les commentaires ou un contributeur de premier niveau → ensemble des fonctionnalités pour un webmaster.

Avec des droits correctement configurés, un contributeur simple ne devrait pas se sentir “écrasé” par une multitude de fonctionnalités inutiles pour lui.

Menus configurables et raccourcis

Au-delà du filtrage des informations en fonction des droits de l’utilisateur, l’arborescence du back-office de Drupal n’est pas figée et peut-être modifiée aussi simplement qu’un menu du site “public”.

Chaque utilisateur du back-office dispose de sa propre barre de raccourcis dans laquelle il peut enregistrer les pages du backend dont il se sert le plus souvent. Des modules tels que shortcuts by role permettent même de pré-remplir vos favoris en fonction de besoins pressentis pour une typologie d’utilisateurs.

Aide à la saisie

Chaque type de contenu, chaque liste, chaque menu, chaque vocabulaire de taxonomie et même chaque champ de saisie dispose a minima d’un champ descriptif permettant à l’utilisateur de comprendre l'édition concernée.

Ces champs ne sont pas obligatoires, mais nous pensons qu’ils sont importants pour la vie du site sur le long terme.

Il n’est pas nécessaire d’avoir un accès au code source pour modifier / ajouter des précisions par la suite en fonction de vos besoins et retours des contributeurs.

Drupal permet aussi de modifier l’ordre des champs de saisie d’un contenu, indépendamment de l’affichage réel, pour regrouper des parties qui font sens pour les administrateurs même si ce n’est pas le cas pour l’affichage.

Comme pour tous les projets, nous cherchons sans cesse à améliorer le confort des contributeurs. Ces aménagements doivent être transigés lors des ateliers de conception, au même titre que l'expérience utilisateur de l'interface publique. Il en va de la réussite de la prise en main du projet.

Ludovic Coullet

Sur bluedrop.fr : Nous avons testé Claro, nouveau thème d'admin Drupal 8 et 9 - Samedi 11 Avril 2020
Sur bluedrop.fr : Drupal 8, améliorations back-end : Configuration, entités, cache, webservices - partie 6 - Mercredi 30 Septembre 2015