Une boutique de matériel photo nous a confié un besoin précis : les pages produit des boîtiers devaient afficher un comparatif de caractéristiques techniques, tandis que les pages des accessoires restaient simples, sans ce bloc. Avec un thème WooCommerce classique, cela aurait demandé un template PHP conditionnel. Avec le WooCommerce Builder d’Elementor Pro, la même chose se fait avec deux templates et deux jeux de conditions, sans toucher une ligne de PHP.
Le WooCommerce Builder s’appuie sur le même moteur que le Theme Builder classique : des templates réutilisables, assignés par des conditions, mais avec une bibliothèque de widgets spécifiquement connectés aux données produit de WooCommerce.
Les deux types de templates WooCommerce
Dans Templates > Theme Builder, deux nouvelles catégories apparaissent une fois WooCommerce actif :
- Single Product : le gabarit d’une fiche produit individuelle.
- Product Archive : le gabarit de la boutique, des pages catégorie et des résultats de recherche produit.
Chacun s’assigne via les mêmes conditions que les autres templates Theme Builder (Entire Site, catégorie de produit, produit spécifique…), ce qui permet exactement le scénario de notre client photo : un template Single Product pour la catégorie « Boîtiers », un autre pour le reste du catalogue.
Construire une fiche produit
Le widget central est Product Content : il rend d’un bloc l’ensemble de la fiche WooCommerce standard (galerie, titre, prix, bouton d’ajout au panier, description courte, onglets). Pour une personnalisation plus fine, Elementor Pro propose des widgets unitaires équivalents, que l’on peut disposer librement dans un conteneur Flexbox :
- Product Title, Product Price, Product Rating.
- Product Images (galerie), Product Add to Cart.
- Product Meta (SKU, catégories, étiquettes), Product Stock.
- Product Data Tabs pour les onglets description / avis / informations complémentaires.
Pour notre comparatif technique, nous avons simplement ajouté un widget Text Editor alimenté par un champ ACF personnalisé (via un Dynamic Tag), positionné entre Product Price et Product Add to Cart, uniquement sur le template dédié à la catégorie « Boîtiers ».
Construire une page d’archive boutique
Le template Product Archive fonctionne différemment : il ne remplace pas la boucle produit elle-même par défaut, mais l’entoure. Le widget Archive Products affiche la grille de produits filtrée par la requête WooCommerce en cours (catégorie visitée, recherche, tri), pendant que le reste du template — en-tête de boutique, bannière, widgets de filtre — se construit librement autour.
Structure typique d'un template Product Archive :
- Conteneur "En-tête boutique" (titre dynamique, fil d'ariane)
- Widget Archive Products (grille produits, colonnes réglables)
- Widget Archive Description (texte SEO de la catégorie)
Un point de vigilance : les widgets de filtre natifs de WooCommerce (filtre par attribut, par prix) reposent sur les hooks woocommerce_before_shop_loop et woocommerce_sidebar. Si votre thème ou un plugin tiers de filtrage dépend de ces hooks, il faut vérifier qu’ils sont toujours déclenchés quelque part dans le template Elementor, faute de quoi les filtres disparaissent silencieusement.
Conditions et priorités : éviter les conflits
Comme pour tout template Theme Builder, plusieurs templates Single Product peuvent techniquement s’appliquer au même produit si les conditions se chevauchent. Elementor Pro résout ce conflit par un ordre de priorité configurable dans la liste des templates : plus une condition est spécifique (un produit précis bat une catégorie, qui bat Entire Site), plus elle gagne par défaut, mais l’ordre reste ajustable manuellement par glisser-déposer.
| Condition | Spécificité |
|---|---|
| Produit spécifique | La plus haute |
| Catégorie de produit | Intermédiaire |
| Entire Site (Product) | La plus basse, sert de gabarit par défaut |
Toujours conserver un template Single Product en condition « Entire Site » comme filet de sécurité : sans lui, tout nouveau produit créé sans catégorie assignée retombe sur le gabarit WooCommerce natif du thème, souvent incohérent visuellement avec le reste du site.
En résumé
Le WooCommerce Builder transforme la personnalisation des pages produit et boutique en un exercice de composition de widgets plutôt que de développement PHP. Les templates Single Product et Product Archive, combinés aux conditions du Theme Builder, permettent des déclinaisons par catégorie ou par gamme sans dupliquer de code. Le point à ne jamais négliger reste la préservation des hooks WooCommerce attendus par les extensions tierces, en particulier sur les pages d’archive où les filtres en dépendent directement.
