Go live: Les Vergers Boirons worldwide with Drupal 8

These past few weeks have been eventful with several site launches developed with Drupal 8, including the my-vb.com website for the company Boiron Frères. Here’s a look back at this redesign...

The project

Our team was tasked with redesigning the website www.my-vb.com for the company Les Vergers Boirons, a global leader in frozen fruit and vegetable purées and coulis, with over 15,000 tons of products sold each year in 80 countries (mainly for restaurants, gastronomy professionals, and pastry artists!)

The project involved the technical overhaul of the website using Drupal 8. The web design was done upstream by a third-party agency. We took the lead and responsibility for:

Taking charge of mockups, UX audit, and recommendations;
Development using Drupal 8;
Front-end integration with Foundation 6, including the rollout of responsive design;
Migration of content types to the new site (from custom development);
Hosting;
Training the Vergers Boirons team on content entry.

Throughout this redesign effort, it was necessary to constantly refocus the teams on the main objectives of the project:

Provide a new, more robust, high-performance, and secure technical foundation;
Start and intensify a user-centric approach, notably offering more intuitive usability and features;
Offer content management features for simpler and more efficient administration;
Optimize SEO to generate more traffic and drive web-based lead acquisition, especially for Vergers Boiron's marketing automation tools.

Main site features

The project involved the development of several features, mainly:

Advanced multilingual capability: We set up a multi-country site (France, England, Germany, Spain, United States). Each country's site has its own directory for better SEO optimization. The site is also multilingual (French, English, German, and Spanish) and enables language detection based on the country.
Search engine: The site offers a large volume of accessible content, notably via the search engine. We chose to implement a robust search engine allowing plain text search with autocomplete across all site resources (including documents).

Search filters: In addition to free text with autocomplete, the site has an advanced search filter system. Results are then sorted and refined using facets.
Taxonomies: The site offers several content types and benefits from advanced taxonomy management features to categorize content for optimized search.
Community features: The site offers sharing buttons for social networks. In addition, links to brand pages are grouped into Drupal blocks that can be edited in the back office. Only the block matching the user's country/language combination is displayed.

Drupal 8 technical framework

We developed the platform with Drupal 8, mainly using core features and contributed modules, including:

Domain Access: The Vergers Boirons site targets an international audience. The project required an architecture with multiple domains using the Domain Access suite to deliver a site per country while centralizing CMS management with a single back office. This architecture makes it easy to deploy a new language site while taking advantage of all existing Drupal configuration.
Paragraphs: This module is essential for greater editing freedom when creating content types that require complex display. It was used to organize and reuse certain recurring field groups in several content types.
Search API Solr: This provides a powerful search engine. We combined this module with Facets to offer advanced filtered search.
Field Group: This "user experience" oriented module simplifies the content addition interface by grouping elements from the same area together as clear, grouped fields in the administration space. Thus, the user does not have to fill in some fifty scattered fields to add or edit content, resulting in considerable time savings.

Other technical features

Third-party application connectors: Some site features require connection to APIs, notably:
- Hubspot: The newsletter and product request features are based on this API.
- Google Tag Manager: This solution enables advanced traffic analytics. The implementation had to take into account every click, search, page view, etc.
SEO: Additional effort was spent optimizing the indexing of the new platform with search engines. Besides implementing a strict HTML structure and configuring SEO modules, the work involved creating a sitemap, which was a challenge. The contributed module Simple XML Sitemap lets you create a sitemap for a simple, single-domain site. For this project, the multi-domain architecture where each site offers several languages did not allow us to use this module as is (and in fact, we found no contributed module to do this). This constraint led us to rewrite and modify much of the module.
Content import: Four content types were migrated using import scripts based on the Migrate module suite, to recover content from the old site. Given the high volume of content to migrate, the import was complex because the requests changed regularly. As a result, we had to change the scripts multiple times.