Aperçu

Ensuite, vous pouvez vérifier ci-dessous si les labels apparaissent sur votre fiche produit.

1. Ouvrir le modèleDans WordPress, allez dans Apparence → Éditeur → Modèles et ouvrez le modèle « Produit unique ». Avec un thème classique, passez directement à l’étape 4.
2. Insérer un blocSous le bloc d’ajout au panier, insérez un bloc « HTML personnalisé ».
3. Coller le codeCollez le code du widget et enregistrez le modèle. Il s’applique alors à toutes les fiches produit.
4. Thème classiqueSans éditeur de blocs, affichez le code dans le thème enfant via le hook woocommerce_single_product_summary avec la priorité 35, ou avec une extension de snippets.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Ouvrir la mise en pageDans l’administration, sous « Inhalte → Erlebniswelten » (en anglais : Content → Shopping Experiences), ouvrez la mise en page de vos fiches produit ou créez-en une de type « Produktseite » (Product page).
2. Insérer l’emplacementSous la zone d’achat, insérez un bloc avec un élément de texte, passez en vue code source et collez <div data-garantielabel></div>.
3. Charger le scriptIntégrez la ligne contenant widget.js via le thème (par exemple dans base.html.twig) ou une extension pour scripts personnalisés, puis enregistrez la mise en page et attribuez-la aux produits.
4. Variante dans le thèmeLes développeurs étendent dans leur propre thème le modèle de la zone d’achat (buy-widget.html.twig) avec l’emplacement et intègrent le script dans l’en-tête du modèle.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Ouvrir la page produitDans l’éditeur Wix, ouvrez la page produit de Wix Stores. Les modifications s’y appliquent à tous les produits.
2. Ajouter l’élémentCliquez sur « Ajouter des éléments », puis « Code d’intégration », et choisissez l’élément « HTML intégré ».
3. Coller le codeCollez le code du widget, faites glisser l’élément sous le bouton d’ajout au panier et agrandissez-le pour que le graphique entier soit visible.
4. PublierPubliez le site et vérifiez sur une page produit.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel data-darstellung="voll" data-sprache="fr"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Ouvrir le modèle de produitDans le Designer, sous Pages, ouvrez le modèle « Products Template ».
2. Insérer un Code EmbedDepuis le panneau Add, faites glisser l’élément « Code Embed » sous le bouton Add to Cart.
3. Coller le codeCollez le code du widget et enregistrez.
4. PublierPubliez le site. Dans le Designer lui-même, les scripts intégrés ne s’exécutent pas.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Utiliser un modèle enfantLes modifications vont dans un modèle enfant (pour NOVA : NOVAChild), afin que les mises à jour ne les écrasent pas.
2. Étendre le modèleDans le modèle enfant, étendez le modèle de la page de détail de l’article et placez le code du widget sous le bouton d’ajout au panier. Il s’applique alors à tous les articles.
3. Article isoléPour un seul article : dans l’OnPage Composer, faites glisser un portlet de texte sous le bouton d’ajout au panier et collez le code en vue code source. L’OnPage Composer modifie chaque page séparément.
4. VérifierVidez le cache ou publiez le brouillon, puis vérifiez sur un article.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Ouvrir le produitDans la section Commerce ou sur la page de la boutique, modifiez le produit.
2. Insérer un Bloc CodeDans la zone des informations supplémentaires, ajoutez un Bloc Code.
3. Coller le codeCollez le code du widget, laissez l’option « Afficher la source » désactivée et enregistrez.
4. Charger le script une seule foisVous pouvez aussi charger une seule fois la ligne contenant widget.js via l’Injection de code de la page boutique. L’emplacement doit néanmoins figurer dans chaque produit.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel data-darstellung="voll"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Créer un bloc CMSSous Content → Blocks, créez un nouveau bloc et collez le code du widget. À partir de la version 2.4.3, le Page Builder s’ouvre : utilisez-y l’élément « HTML Code ».
2. Créer le widgetSous Content → Elements → Widgets, créez un widget de type « CMS Static Block » pour votre thème.
3. PlacerComme mise à jour de mise en page, choisissez « All Product Types » et indiquez le conteneur « Product View Extra Hint ». Il se trouve sous le bouton d’ajout au panier.
4. Vider le cacheEnregistrez, videz le cache et vérifiez sur une fiche produit.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Vérifier la versionÀ partir de Gambio 26.09.0, vous activez les deux labels dans les paramètres de la boutique, au besoin par groupe de clients. Pour les versions plus anciennes à partir de 4.6, Gambio indique proposer un module. Vous n’avez alors pas besoin du widget.
2. Intégrer le scriptPour le widget, sous « Einstellungen → Suchmaschinenoptimierung → Tracking-Codes » (intitulé allemand), collez la ligne contenant widget.js dans la zone « Body ». Elle est alors chargée sur toutes les pages de la boutique.
3. Placer l’emplacementDans la description de l’article, ouvrez la vue code source de l’éditeur et collez l’emplacement <div data-garantielabel></div> à l’endroit voulu.
4. VérifierAprès l’enregistrement, rouvrez la vue code source. Si l’emplacement y figure encore, le label apparaît sur la fiche produit.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Utiliser un thème enfantLes modifications du thème vont dans un thème enfant, afin que les mises à jour ne les écrasent pas.
2. Choisir l’emplacementDans templates/catalog/product.tpl, repérez la zone située sous le bouton d’ajout au panier.
3. Coller le codeCollez-y le code du widget. Autre possibilité : un module de bloc HTML de la place de marché PrestaShop Addons, branché sur le hook displayProductAdditionalInfo.
4. Vider le cacheSous Paramètres avancés → Performances, cliquez sur « Vider le cache » et vérifiez.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Module ou thème enfantL’extension va dans un petit module ou un thème enfant (dans theme.php avec 'parentTheme' => 'apex'), afin que les mises à jour du thème APEX ne l’écrasent pas. Vous l’activez sous « Erweiterungen → Module » ou « Erweiterungen → Themes » (intitulé allemand). Il faut pour cela un accès aux fichiers ; c’est souvent votre agence qui s’en charge.
2. Étendre le blocÉtendez le modèle page/details/inc/productmain.html.twig et, dans le bloc details_productmain_tobasket, placez le code du widget après {{ parent() }}. Avec parent(), le bouton d’ajout au panier reste inchangé.
3. Label GARAN par articlePour vos propres labels GARAN, créez deux attributs sous « Artikel verwalten → Attribute » (intitulé allemand), par exemple « GARAN complet » et « GARAN imbriqué », puis saisissez sur l’article, sous « Auswahl → Attribute zuordnen », les adresses des deux fichiers. Dans le modèle, affichez les valeurs dans data-garan-voll et data-garan-klein.
4. Vider le cacheVidez le cache des modèles avec vendor/bin/oe-console oe:cache:clear et vérifiez la page article, y compris avec des déclinaisons.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Vérifier la versionÀ partir de plentyShop LTS 5.0.83, le ShopBuilder propose les widgets « Gewährleistungsrecht » et « Haltbarkeitsgarantie » (intitulé allemand). La garantie de durabilité affiche le label GARAN si le fabricant, le modèle et la garantie commerciale de durabilité sont renseignés sur l’article.
2. Ouvrir le ShopBuilderSous « Shop → ShopBuilder », ouvrez le contenu de la page article (type de contenu Article).
3. Insérer le widget CodePour la notice directement sur la page article, faites glisser le widget « Code » sous le widget « In den Warenkorb » (intitulé allemand) et collez le code ci-dessus, avec <script2> au lieu de <script>.
4. Enregistrer et vérifierEnregistrez et vérifiez la page article dans la boutique en ligne, y compris en changeant de déclinaison. Après une mise à jour de plentyShop, régénérez les contenus sous « Shop → ShopBuilder ».

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script2 src="https://www.garantielabel.app/widget.js" async></script2>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Vérifier la versionLes étapes s’appliquent à ePages Base, l’ancienne version. Si vous avez ePages Now, utilisez les fonctions intégrées décrites ci-dessus.
2. Intégrer le scriptSous « Einstellungen → Allgemeine Einstellungen → Erweiterte Einstellungen » (intitulé allemand), collez la ligne contenant widget.js dans le champ « HTML-Head-Bereich » et enregistrez. Elle s’applique alors à toutes les pages.
3. Emplacement dans le produitSous « Produkte → Produkte », ouvrez l’article ; dans la « Erweiterte Beschreibung » (description détaillée), collez via « Quellcode » l’emplacement <div data-garantielabel></div>, validez et enregistrez.
4. VérifierActualisez le cache des pages via « Ihre Seite anzeigen » et vérifiez la fiche produit. Rouvrez ensuite la vue code source : si l’emplacement y figure encore, l’éditeur ne l’a pas supprimé.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. Creator ou créateur de sites ?Si l’adresse de l’éditeur commence par cms.e.jimdo.com, vous utilisez Jimdo Creator. Le créateur de sites (builder.e.jimdo.com) ne permet pas d’insérer de code personnalisé.
2. Insérer l’élémentSur la page du produit, sous le produit de la boutique, choisissez « Inhalt hinzufügen » → « Weitere Inhalte und Add-ons » → « Widget/HTML » (intitulé allemand).
3. Coller le codeCollez le code du widget, pour un label GARAN avec les adresses dans data-garan-voll et data-garan-klein, puis enregistrez.
4. Charger le script une seule foisSi vous le souhaitez, déposez une seule fois la ligne contenant widget.js sous « Einstellungen » → « Head bearbeiten » (intitulé allemand). L’élément de chaque produit ne contient alors plus que l’emplacement.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

1. EmplacementPlacez le code sur la fiche produit, juste sous la zone d’achat. Le label apparaît exactement à cet endroit.
2. Enregistrer et publierRechargez ensuite la fiche produit et vérifiez ci-dessous.

Code du widget pour la notice sur la garantie légale

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

<div data-garantielabel
  data-garan-voll="https://…/GARAN-Marque-Modele.svg"
  data-garan-klein="https://…/GARAN-Marque-Modele-imbrique.svg"></div>
<script src="https://www.garantielabel.app/widget.js" async></script>