Mise en production : Les Vergers Boirons partout dans le monde avec Drupal 8

Jeudi 26 Septembre 2019

Ces dernières semaines ont été mouvementées avec plusieurs mises en production de sites réalisés avec Drupal 8, dont le site my-vb.com pour la société Boiron Frères. Retour sur cette refonte...

Mise en production vergers boiron Drupal 8

Le projet  

Notre équipe a été chargée de la refonte du site www.my-vb.com, de la société Les Vergers Boirons, référence mondiale des purées et coulis de fruits et légumes surgelés avec plus de 15.000 tonnes de produits vendus chaque année dans 80 pays (essentiellement à destination des restaurants, professionnels de la gastronomie et patissiers artistes !)

Le projet concernait la refonte technique du site avec Drupal 8. Le webdesign a été réalisé en amont par une agence tierce. Nous avons pris la direction et la responsabilité de :

  • La prise en main des maquettes, de l'audit UX et des recommandations ; 
  • Le développement avec Drupal 8 ; 
  • L’intégration front-end avec Foundation 6 incluant la déclinaison du responsive design ; 
  • La migration des types de contenus vers le nouveau site (à partir d'un développement sur-mesure) ;
  • L’hébergement ; 
  • La formation de l’équipe des Vergers Boirons à la saisie des contenus. 

Tout au long de cet effort de refonte, il a fallu sans cesse concentrer les équipes sur les objectifs principaux du projet : 

  • Disposer d’un nouveau socle technique plus robuste, performant et sécurisé ; 
  • Initier et intensifier une démarche user centric en proposant notamment une ergonomie et des fonctionnalités plus intuitives ; 
  • Proposer des fonctionnalités de gestion de contenu pour une administration plus simple et efficace ; 
  • Optimiser le référencement naturel pour générer plus de trafic et accentuer la démarche d’acquisition par le web, notamment pour les outils de marketing automation des Vergers Boiron. 

Principales fonctionnalités du site 

Le projet a impliqué le développement de plusieurs fonctionnalités, principalement : 

  • Multilinguisme avancé : nous avons mis en place un site multi-pays (France, Angleterre, Allemagne, Espace, États-Unis). Chaque site pays dispose de son propre répertoire pour une meilleure optimisation SEO. Le site est également multilingue (français, anglais, allemand et espagnol) et permet une détection de la langue en fonction du pays. 
  • Moteur de recherche : le site propose un important volume de contenus accessibles notamment via le moteur de recherche. Nous avons choisi de mettre en place un moteur de recherche robuste permettant une recherche plain text avec autocomplétion sur l’ensemble des ressources du site (documents compris). 

  • Filtres de recherche : en plus de la saisie libre avec autocomplétion, le site dispose d’un système de recherche avancée par filtres. Les résultats sont alors triés et affinés grâce aux facettes. 
  • Taxonomies : le site propose plusieurs types de contenu et profilte des fonctionnalités de gestion de taxonomies avancée pour catégoriser les contenus, afin d’optimiser la recherche.
  • Fonctionnalités communautaires : le site propose des boutons de partage de contenus sur les réseaux sociaux. Par ailleurs, les liens vers les pages de la marque sont regroupés dans des blocs Drupal modifiables en back-office. Seul le bloc correspondant à la combinaison pays / langue de l’utilisateur est affiché. 

Cadre technique Drupal 8 

Nous avons développé la plateforme avec Drupal 8, en utilisant principalement les fonctionnalités du core et des modules contribués dont notamment : 

  • Domain Access : le site des Vergers Boirons s’adresse à un public international. Le projet a impliqué la mise en place d’une architecture multi-domaines avec la suite Domain Access afin de proposer un site par pays tout en centralisant la gestion du CMS en un backoffice unique. Cette architecture permet de déployer facilement un nouveau site pour une langue en bénéficiant de toute la configuration Drupal déjà prête. 
  • Paragraphs : ce module est indispensable pour une plus grande liberté d’édition dans la création des types de contenu exigeant un affichage complexe. Ce dernier a été utilisé pour organiser et réutiliser certains groupes de champs récurrents dans plusieurs types de contenus. 
  • Search API Solr : ce dernier permet de disposer d’un puissant moteur de recherche. Nous avons combiné ce module avec Facets pour disposer d’une recherche avancée par filtres.
  • Field Group : ce module orienté "expérience utilisateur", propose de simplifier l’interface d’ajout de contenu en regroupant les éléments d’une même zone de l'interface en des champs groupés et clairs dans l'espace d'administration. Ainsi, l’utilisateur n’aura pas à remplir une cinquantaine de champs éparpillés pour ajouter ou modifier un contenu, ce qui lui confère un gain de temps considérable. 

Autres particularités techniques 

  • Connecteurs applications tierces : certaines fonctionnalités du site sollicitent la connexion à des API's, notamment : 
    • Hubspot : la newsletter et la demande de produits sont basées sur cette API. 
    • Google Tag Manager : cette solution permet une analyse avancée des statistiques du trafic. Il a fallu implémenter la solution de manière à prendre en compte chaque clic, recherche, ouverture de page, etc. 
  • SEO : un effort supplémentaire a été réalisé pour optimiser l’indexage de la nouvelle plateforme sur les moteurs de recherche. En plus de la mise en place d’une structure HTML stricte et la configuration des modules SEO, le travail a impliqué la création d’un sitemap qui a été laborieux. En effet, le module contribué Simple XML Sitemap permet la création d’un sitemap pour un site simple (déployé avec un seul domaine). Pour ce projet, l’architecture en multi-domaines dont chaque site propose plusieurs langues, n’a pas permis d’utiliser ce module en l’état (et d’ailleurs nous n’avons trouvé aucun module contribué permettant cela). Cette contrainte nous a mené à réécrire et modifier une grande partie du module. 
  • Import contenus : une migration de 4 types de contenus par le biais de scripts d’import basés sur la suite du module Migrate, a été nécessaire pour récupérer les contenus de l’ancien site. Compte tenu du volume important des contenus à migrer, l’import a été complexe en raison des requêtes qui changeaient régulièrement. Ceci nous a conduit à changer les scripts à plusieurs reprises. 

Et la suite ? 

Nous assurons actuellement la maintenance préventive, corrective et évolutive. 

Pour aller plus loin :
Le site : www.my-vb.com
Mise en production : 31/05/2019.
Consulter l'étude de cas.