Refonte WordPress/Elementor et développement d'une API HubSpot sur-mesure

Étude de cas · Développement web fullstack · WordPress · Elementor · PHP · API HubSpot

Sauver un site qui cassait à chaque mise à jour

EasyPartner est un cabinet de recrutement qui publie en continu des offres d'emploi sur son site, reçoit des candidatures et coopte des profils via son réseau. Le site reposait sur un thème WordPress sur-mesure, plus maintenu, dont le code PHP n'était plus compatible avec les versions récentes de PHP ni de WordPress : chaque mise à jour de sécurité risquait de casser une partie du site, obligeant à geler les versions et à repousser indéfiniment les correctifs.

Cette dette technique n'était plus tenable pour un site qui sert d'outil commercial au quotidien : chaque offre publiée, chaque candidature reçue et chaque cooptation enregistrée transitent par lui. Ce projet m'a été confié comme mission de refonte fullstack complète : reconstruire le site sur une base pérenne et redévelopper de zéro l'intégration avec HubSpot, le CRM utilisé par les équipes de recrutement.

Les besoins du client : repartir sur une base saine sans perdre les fonctionnalités métier

Le site legacy n'était pas qu'une question de design : il embarquait une couche métier complète (gestion des offres, candidatures, cooptation, synchronisation avec l'ancien CRM Bullhorn) codée en dur dans le thème, sans documentation à jour. La refonte devait donc reconstruire cette logique métier sur une architecture découplée du thème, pour ne plus jamais dépendre d'un thème fragile.

Plusieurs exigences structurantes sont ressorties du cadrage :

• Un thème maintenable : abandonner le thème sur-mesure figé au profit d'une base standard (Hello Elementor) et d'un thème enfant, pour bénéficier des mises à jour de sécurité sans casse.
• Autonomie éditoriale : permettre aux équipes non-techniques de composer et modifier les pages elles-mêmes via Elementor, sans dépendre d'un développeur pour chaque changement de contenu.
• Migration du CRM : basculer de Bullhorn (obsolète) vers HubSpot comme CRM de référence, avec une synchronisation bidirectionnelle des offres d'emploi et des candidatures.
• Continuité fonctionnelle : conserver l'intégralité des parcours existants (recherche d'offres, candidature à une offre, candidature spontanée, cooptation d'un profil) sans régression pour l'utilisateur final.
• Zéro rupture de données : les 17 champs personnalisés existants sur les offres d'emploi devaient être audités un par un pour décider ce qui se conserve, se renomme ou se supprime, sans perdre de données de production.
• Un référencement à reconstruire : l'audit SEO préalable a révélé un site sans maillage interne structuré et une forte cannibalisation entre pages proches (offres, métiers, contenus), deux problèmes qui diluaient la position du site sur ses mots-clés stratégiques et nécessitaient une refonte de l'architecture SEO en parallèle de la refonte technique.

La difficulté n'était pas de refaire une jolie page d'accueil, mais de désimbriquer une logique métier critique (candidatures, CRM, notifications) d'un thème condamné, sans interrompre le flux de recrutement de l'entreprise pendant la bascule.

Les fonctionnalités du produit : un site vitrine piloté par une couche métier indépendante

La refonte sépare strictement deux couches : l'affichage, entièrement piloté par Elementor et son thème enfant, et la logique métier, portée par un ensemble de MU-plugins WordPress autonomes qui survivent à n'importe quel changement de thème futur.

Offres d'emploi synchronisées depuis HubSpot

Les offres d'emploi ne sont plus saisies manuellement dans WordPress : elles sont synchronisées automatiquement depuis les deals HubSpot du pipeline recrutement, avec un filtrage sur la propriété métier « à publier sur le site ». La synchronisation tourne en tâche de fond toutes les 48h, peut être déclenchée à la demande via un endpoint REST, ou en temps réel via un webhook HubSpot dès qu'un deal est modifié.

Candidature en ligne et candidature spontanée

Chaque offre dispose d'un formulaire de candidature qui crée ou met à jour le contact dans HubSpot, l'associe au bon deal, dépose le CV dans HubSpot Files et génère une note de candidature, sans aucune ressaisie côté équipe recrutement. Un parcours de candidature spontanée en plusieurs étapes (« On trouve pour vous ») complète l'offre pour les profils qui ne visent pas un poste précis.

Cooptation

Un système de cooptation dédié permet à un collaborateur de recommander un profil de son réseau. Chaque cooptation est tracée via un token sécurisé (HMAC), enregistrée dans un post type dédié et peut être suivie côté administration WordPress.

Recherche et filtrage des offres

Un filtrage AJAX des offres (métier, ville, type de contrat) avec autocomplétion des villes permet aux visiteurs de trouver rapidement une offre pertinente, sans rechargement de page.

Enrichissement automatique des données recruteur

Chaque offre affiche le recruteur en charge : prénom, nom et photo sont récupérés automatiquement depuis l'API Owners de HubSpot au moment de la synchronisation, sans double saisie côté WordPress.

Données prêtes à l'affichage

Les fourchettes de salaire et de TJM (pour les missions en prestation) sont calculées côté serveur au moment de la synchronisation, plutôt qu'en front, et stockées sous forme de champs déjà formatés (ex. « 42K€ à 48K€ »), pour un affichage instantané sans logique de calcul côté thème.

Le process : découpler la logique métier du thème avant de reconstruire l'affichage

Refondre un site en production, sans période de coupure acceptable pour l'activité commerciale, impose de traiter la migration comme un projet d'architecture avant d'être un projet de design.

1. Audit du legacy et cartographie des champs métier

La première étape a consisté à extraire du thème legacy tout ce qui n'était pas de l'affichage : les 17 champs personnalisés existants sur les offres d'emploi, les actions AJAX, les hooks d'envoi d'email. Chaque champ a été reclassé (conservé à l'identique, renommé, ou supprimé, notamment les champs liés à l'ancien CRM Bullhorn) dans un tableau de correspondance servant de référence à toute l'équipe pendant la bascule.

2. Extraction de la logique métier en MU-plugins

Toute la logique fonctionnelle, des types de contenus (offres, membres, témoignages, partenaires) aux taxonomies, candidatures, cooptation, filtrage et synchronisation HubSpot, a été réécrite dans des MU-plugins indépendants du thème. Ce choix garantit que le site continuera de fonctionner même si le thème est de nouveau changé un jour : la donnée et les parcours métier ne dépendent plus jamais de l'affichage.

3. Reconstruction de l'affichage sous Elementor

Le thème parent Hello Elementor, minimaliste et maintenu par l'éditeur d'Elementor lui-même, sert de socle à un thème enfant sur-mesure. Les pages (offres, blog, contact, calculateur de salaire) sont reconstruites avec Elementor et connectées aux données via des requêtes personnalisées, sans templates PHP figés, ce qui rend les équipes autonomes sur le contenu.

4. Développement de l'API HubSpot

L'intégration HubSpot a été redéveloppée de zéro : synchronisation des offres, gestion des candidatures (création de contact, association au deal, upload de CV, création d'un objet personnalisé « candidatures » avec son propre pipeline), et endpoints webhook pour les mises à jour en temps réel. Chaque scope de l'application privée HubSpot a été limité au strict nécessaire (lecture/écriture contacts, deals, notes, fichiers, associations).

5. Refonte du référencement naturel

L'audit SEO préalable a mis en évidence deux faiblesses structurelles héritées du thème legacy : quasiment aucun maillage interne entre les offres, les fiches métiers et les contenus du blog, et une cannibalisation forte entre pages traitant des sujets proches, plusieurs URLs se disputant les mêmes mots-clés sans qu'aucune ne ressorte clairement dans les résultats de recherche. La refonte du site a été l'occasion de reconstruire l'architecture SEO en parallèle : redéfinition d'une hiérarchie claire entre pages piliers et pages satellites, dédoublonnage des contenus concurrents entre eux, et mise en place d'un maillage interne systématique entre offres, métiers et contenus éditoriaux, en profitant du passage à Elementor pour intégrer ces liens directement dans les templates plutôt qu'au cas par cas.

6. Documentation et checklist de mise en production

Le projet livre deux documents de référence : un guide de configuration exhaustif (constantes wp-config, plugins requis, champs ACF, propriétés HubSpot, scopes du token) et une checklist de mise en production, pour que la bascule finale, et toute réinstallation future, soit reproductible sans connaissance implicite du projet.

La stack technique

Le choix des technologies a privilégié la stabilité et la maintenabilité à long terme : un socle WordPress standard plutôt qu'un thème sur-mesure fragile, et une intégration HubSpot développée en interne pour un contrôle total sur la logique métier, plutôt qu'un connecteur générique du marché.

CMS et affichage

• WordPress avec le thème Hello Elementor comme socle, minimaliste et activement maintenu
• Thème enfant sur-mesure (hello-elementor-child) pour les personnalisations propres à EasyPartner
• Elementor Pro comme constructeur de pages, pour l'autonomie éditoriale des équipes
• Advanced Custom Fields (ACF) pour les champs personnalisés (offres, membres, options globales)
• JavaScript sur-mesure pour les interactions front (filtrage, infinite scroll, formulaires multi-étapes, effets de défilement)

Backend et intégration

• PHP en MU-plugins, indépendants du thème, pour toute la logique métier (CPT, taxonomies, candidatures, cooptation)
• API HubSpot (CRM, Deals, Contacts, Owners, Files, objets personnalisés) via une application privée dédiée avec scopes restreints
• REST API WordPress pour les endpoints de synchronisation et de webhook
• WP-Cron pour la synchronisation périodique automatique des offres
• HMAC pour la sécurisation des tokens de cooptation

Exploitation

• Checklist de mise en production et guide de configuration versionnés avec le code
• Endpoints de diagnostic et de resynchronisation manuelle accessibles aux administrateurs
• Journalisation dédiée des événements HubSpot (synchronisation, webhooks, erreurs de mapping)

Le résultat : un site vitrine qui ne dépend plus d'un thème fragile

Sauver ce site en production d'une dette technique critique n'a pas consisté à repartir de zéro, mais à séparer soigneusement ce qui devait être reconstruit (l'affichage, désormais sous Elementor, et l'architecture SEO du site) de ce qui devait être préservé et sécurisé (la donnée métier et les parcours de candidature), tout en migrant vers un nouveau CRM au passage.

EasyPartner dispose aujourd'hui d'un site que les équipes peuvent mettre à jour en toute sécurité, dont les offres d'emploi restent synchronisées avec HubSpot sans ressaisie manuelle, dont les candidatures (en ligne, spontanées ou par cooptation) alimentent directement le pipeline de recrutement de l'entreprise, et dont l'architecture SEO ne cannibalise plus ses propres pages sur les mots-clés stratégiques.

Cette mission de sauvetage technique a couvert tout le cycle : audit d'un legacy critique, extraction de la logique métier, migration CRM, développement d'une API sur-mesure et documentation de mise en production, sur un site qui ne pouvait pas se permettre de temps d'arrêt.

Développeur fullstack · refonte WordPress et intégrations CRM sur-mesure