Développer un widget Elementor personnalisé dans DDEV plutôt qu’en recette

ddev start : une seule commande, et un environnement WordPress complet tourne en local, base de données comprise, prêt à recevoir le développement d’un widget Elementor personnalisé. Pour un développeur solo qui travaillait jusque-là en modifiant directement les fichiers sur un serveur de recette partagé, chaque essai imposait un transfert par FTP suivi d’un rechargement de page, une lenteur qui cassait la concentration à chaque itération.

Ce tutoriel installe DDEV pour développer un widget Elementor entièrement en local, avec un cycle de test quasi instantané entre chaque modification du code.

Initialiser le projet DDEV

Une fois DDEV installé sur la machine, la configuration d’un projet WordPress se fait avec une commande dédiée qui détecte le type de projet et prépare les fichiers de configuration nécessaires, avant de démarrer l’ensemble des conteneurs (serveur web, base de données, mail catcher).

mkdir widget-elementor-perso
cd widget-elementor-perso
ddev config --project-type=wordpress --docroot=public
ddev start
ddev wp core download
ddev wp core install --url=widget-elementor-perso.ddev.site \
  --title="Environnement de dev widget" \
  --admin_user=admin --admin_password=admin --admin_email=dev@example.test

Installer Elementor et créer le plugin du widget

Elementor s’installe comme n’importe quelle extension, directement via WP-CLI à travers DDEV, sans passer par l’interface d’administration pour ce premier réglage. Le widget personnalisé, lui, vit dans son propre plugin léger plutôt que dans le thème, ce qui le rend plus facile à réutiliser sur d’autres projets par la suite.

ddev wp plugin install elementor --activate
mkdir -p public/wp-content/plugins/mon-widget-perso

Le fichier principal du plugin déclare le widget via le hook elementor/widgets/register, en s’assurant que la classe du widget hérite bien de \Elementor\Widget_Base et implémente les méthodes attendues (get_name(), get_title(), get_icon(), register_controls(), render()).

Le montage de volume, clé de l’itération rapide

DDEV monte automatiquement le dossier du projet local dans le conteneur du serveur web, ce qui signifie que chaque modification enregistrée dans l’éditeur de code sur la machine locale est immédiatement visible dans le conteneur, sans étape de synchronisation ni de transfert de fichier à déclencher manuellement.

• Une modification du fichier PHP du widget est visible au prochain rechargement de l’éditeur Elementor.
• Aucun FTP, aucun transfert manuel, aucune attente de propagation sur un serveur distant.
• La base de données locale se réinitialise facilement avec ddev import-db si un test tourne mal.

Déboguer directement dans l’environnement local

DDEV active facilement le mode débogage PHP avec Xdebug via une simple commande, ce qui permet de poser des points d’arrêt dans le code du widget et d’inspecter les valeurs des contrôles au moment précis où la méthode render() s’exécute, un confort impossible à obtenir aussi simplement sur un serveur de recette partagé sans configuration additionnelle.

Ce que cet article ne compare pas

Ce tutoriel ne compare pas DDEV à Lando ou à wp-env, deux alternatives également répandues pour le développement local WordPress : chacune a ses propres avantages selon les habitudes de l’équipe et le type de projet, mais ce choix technique dépasse le cadre de ce cas d’usage centré sur un développeur solo qui a opté pour DDEV.

Un réflexe qui économise bien des allers-retours inutiles : toujours activer le mode débogage WordPress natif (WP_DEBUG à true) dans l’environnement DDEV local, jamais sur le serveur de production, pour voir immédiatement les avertissements PHP que le widget en développement pourrait déclencher silencieusement ailleurs.

En résumé

Monter un environnement DDEV local pour développer un widget Elementor personnalisé transforme radicalement le rythme de travail d’un développeur solo, en supprimant l’attente d’un déploiement de recette à chaque essai. Une seule commande de démarrage, un montage de volume automatique et un débogage facilité suffisent à retrouver un cycle d’itération rapide, digne d’un environnement de développement professionnel.