Guide d'Intégration des Showcases Produits Fairly Made®

Comment récupérer l’URL du widget ?

Depuis votre tableau de bord (https://app.fairlymade.com/products), téléchargez le fichier CSV "Product" qui contient la colonne showcaseLink pour chacun de vos produits et qui est prêt à être intégré sur votre site web.

Vous pouvez trouver plus d’informations dans notre article principal sur votre passeport digital produit Fairly Made®. 

Qu’est-ce qu’un iFrame ?

Selon la documentation MDN : L’élément HTML  représente un contexte de navigation imbriqué, intégrant une autre page HTML dans la page en cours.

Fairly Made® vous permet d’intégrer son widget/vitrine avec un iFrame sur votre page produit en utilisant un lien de référence.

Intégration de la vitrine en utilisant iFrame

Ces quelques étapes vous guideront pour le faire, en utilisant les deux systèmes de gestion de contenu les plus populaires (Shopify et Wordpress) :

1. Tout d’abord, allez dans l’interface d’administration pour modifier votre site web.

2. Ensuite, accédez à la section d’édition pour votre page web spécifique.

• Shopify

  Cliquez sur l’onglet “Pages” dans le panneau de gauche, puis sélectionnez la page dans laquelle le contenu Fairly Made® doit être inséré.

  

• Wordpress

  Dans le panneau de gauche, cliquez sur l’onglet “Pages” et sélectionnez la page dans laquelle le contenu Fairly Made® doit être inséré.

  

• Google Tag Manager

  Custom Tags

3. Dans cette section d’édition, sélectionnez le mode code HTML.

• Shopify

  La boîte de contenu contient le contenu formaté de votre page. Pour accéder à l’onglet code, cliquez sur le bouton <> dans le coin supérieur gauche de la boîte d’édition.

• Wordpress

  

• Alternativement, le code HTML de la page entière peut être édité comme montré ci-dessous :

  

  (source : https://www.wpbeginner.com/wp-tutorials/how-to-edit-html-in-wordpress-code-editor-beginners-guide)

• Google Tag Manager

  Custom Tags

4. Une fois en mode édition HTML, collez le code suivant :

<iframe src="YOUR_FAIRLY_MADE_PRODUCT_SHOWCASE_URL" style="width:100%;min-height:800px;"></iframe>

YOUR_FAIRLY_MADE_PRODUCT_SHOWCASE_URL doit être remplacé par le lien URL de la page vitrine du produit Fairly Made®. Vous pouvez ajuster le paramètre height selon vos besoins.

⚠️ Nous recommandons de ne pas précharger notre Showcase (ce qui signifie que vous chargez l’iFrame en même temps que votre page produit e-commerce, en arrière-plan). Malgré cela, si vous décidez de précharger, nous désactiverons les analyses de suivi web et ne pourrons pas vous fournir de statistiques sur les visites de nos showcases.

Paramètres de requête

Vous pouvez ajouter un paramètre de requête au lien (par exemple, https://link.fairlymade.com/:linkRef?lang=en)