Module Magento 2 Onglets supplémentaires sur la fiche produit (Custom Tabs)
Onglets produit flexibles sans modifier le template
Kowal Custom Tab est un module Magento 2 qui permet d’enrichir rapidement la fiche produit avec des onglets personnalisés et dynamiques. L’administrateur peut créer des sections d’information supplémentaires, les associer aux attributs produit et contrôler leur ordre sans modifier les fichiers du thème.
Le module est particulièrement adapté aux boutiques qui doivent présenter des informations produit supplémentaires de manière structurée : tableaux de tailles, composition, instructions d’utilisation, fichiers techniques, informations de livraison, garantie, certificats ou descriptions détaillées dépendant du produit.
Principales fonctionnalités
- Ajout d’onglets personnalisés sur la fiche produit.
- Récupération du contenu de l’onglet depuis l’attribut produit sélectionné.
- Masquage automatique des onglets lorsque le produit ne contient pas de contenu renseigné dans l’attribut associé.
- Gestion de l’ordre d’affichage des onglets.
- Activation et désactivation des onglets depuis le panel d’administration.
- Prise en charge du contenu HTML et des widgets CMS rendus par le filtre Magento.
- Traduction du nom de l’onglet par Store View conformément au mécanisme de scope Magento.
- Fallback vers la valeur par défaut lorsque le nom n’a pas été remplacé pour le Store View donné.
Avantages pour la boutique
- Meilleure organisation des informations sur la fiche produit.
- Moins de travail de développement lors de l’ajout de sections produit récurrentes.
- Présentation cohérente des données supplémentaires dans plusieurs catégories de produits.
- Possibilité d’adapter les noms des onglets aux différentes versions linguistiques de la boutique.
- Risque réduit d’erreurs dans le template, car la configuration s’effectue depuis le panel d’administration.
Exemples d’utilisation
- Onglet 'Spécification technique' alimenté depuis un attribut produit.
- Onglet 'Tableau des tailles' visible uniquement pour les produits dont le tableau est renseigné.
- Onglet 'Mode d’emploi' pour les produits nécessitant une description supplémentaire.
- Onglet 'Composition et entretien' dans une boutique fashion.
- Onglet 'Données logistiques' dans une boutique B2B.
- Noms d’onglets distincts pour les versions polonaise, anglaise et allemande de la boutique.
À qui s’adresse ce module
Le module est destiné aux boutiques Magento 2 qui souhaitent enrichir la fiche produit avec des informations supplémentaires sans créer de modifications frontend spécifiques pour chaque onglet. Il convient particulièrement aux boutiques multilingues, aux catalogues B2B et aux projets dans lesquels les données produit sont gérées dans les attributs Magento.
Kowal Custom Tab - installation et configuration
Prérequis
- Magento 2.4 ou version ultérieure.
- Accès à Magento CLI.
- Composer configuré pour télécharger les packages privés Kowal.
- Module de base
kowal/baseinstallé. - Droits d’administrateur pour le panel Magento.
Installation via Composer
Ajoutez le dépôt du package :
composer config repositories.custom.tab vcs https://github.com/kowalco/magento-2-custom-tabSi le dépôt nécessite une autorisation, configurez le token :
composer config --global --auth github-oauth.github.com Installez le module :
composer require kowal/module-customtabEffectuez la mise à jour Magento :
php bin/magento setup:upgradeEn environnement de production, effectuez la compilation DI ainsi que le déploiement des ressources statiques conformément au processus du projet :
php bin/magento setup:di:compilephp bin/magento setup:static-content:deployVidez le cache :
php bin/magento cache:flushVérification de l’installation
Vérifiez si le module est actif :
php bin/magento module:status Kowal_CustomTabSi le module est inactif, activez-le :
php bin/magento module:enable Kowal_CustomTabphp bin/magento setup:upgradephp bin/magento cache:flushConfiguration du module
Dans le panel Magento, accédez à :
Stores > Configuration > Kowal > Custom Tab
Définissez l’option Enable module sur Yes, puis enregistrez la configuration et videz le cache si Magento vous le demande.
Gestion des onglets
Dans le panel d’administration, accédez à :
Kowal > Custom Tabs > Custom Tab
Cliquez sur Add new CustomTab pour créer un nouvel onglet.
Renseignez les champs :
Name- nom de l’onglet visible sur le frontend.Field type- type de source du contenu.Attribute code- attribut produit depuis lequel le contenu de l’onglet doit être récupéré.Status- état d’activation de l’onglet.Sort Order- ordre d’affichage de l’onglet.
Enregistrez l’onglet.
Traduction du nom de l’onglet
Le nom par défaut de l’onglet est enregistré pour store_id = 0.
Pour ajouter une traduction pour un Store View spécifique :
- Ouvrez l’onglet existant en mode édition.
- Utilisez le sélecteur Store View dans la partie supérieure droite du formulaire.
- Sélectionnez le Store View pour lequel vous souhaitez modifier le nom.
- Décochez
Use Default Valuepour le champName. - Saisissez le nom de l’onglet pour la version linguistique sélectionnée.
- Enregistrez le formulaire.
Si Use Default Value reste coché, le module utilisera la valeur par défaut de store_id = 0.
Fonctionnement sur le frontend
Le module ajoute des onglets à la section des détails produit. L’onglet apparaît uniquement lorsque le produit possède une valeur renseignée dans l’attribut indiqué dans la configuration de l’onglet.
Pour le nom de l’onglet, le module applique le fallback suivant :
- Nom pour le Store View actuel.
- Nom par défaut de
store_id = 0. - Valeur de la table principale des onglets, conservée pour compatibilité.
Le contenu de l’onglet est filtré par le mécanisme CMS Magento, il peut donc contenir des balises HTML et des widgets pris en charge par Magento.
Mise à jour d’une installation existante
Après la mise à jour du module vers une version prenant en charge plusieurs langues, exécutez :
php bin/magento setup:upgradephp bin/magento cache:flushLa nouvelle table de valeurs par Store View sera ajoutée par le schéma déclaratif Magento. Après le premier enregistrement d’un onglet existant, son nom par défaut sera également conservé comme enregistrement store_id = 0.
Résolution des problèmes
Si l’onglet n’apparaît pas sur le frontend :
- Vérifiez que le module est activé dans la configuration.
- Vérifiez que l’onglet a le
Statusdéfini surYes. - Vérifiez que le produit possède une valeur renseignée dans l’attribut indiqué dans le champ
Attribute code. - Videz le cache Magento.
- Assurez-vous que le layout du thème rend toujours le bloc
product.info.details.
Si la traduction du nom n’apparaît pas sur le frontend :
- Vérifiez que vous modifiez le bon Store View.
- Vérifiez que
Use Default Valueest décoché pour le champName. - Enregistrez l’onglet et videz le cache.



















