Shopify

Apps Shopify Cover

Aperçu

L’application Shopify permet aux éditeurs de sélectionner des produits à partir de leur compte Shopify et de les référencer à l’intérieur des entrées Contentful.

Lorsque la fonctionnalité Références externes personnalisées est activée, les produits, les variantes de produits et les collections de produits peuvent être récupérés via Contentful GraphQL API.

Prérequis

Pour utiliser Shopify, vous aurez besoin de :

  • Un compte avec Shopify.

  • Un type de contenu avec un champ de type « Texte court » ou « Texte court, liste ».

Utilisation

Étape 1 : Créer une application sur Shopify et générer un jeton d’accès

Dans cette étape, vous devez créer une application sur Shopify et l’installer. Après l’installation, un jeton d’accès Storefront est généré.

REMARQUE : le jeton d’accès Storefront et le point de terminaison de l’API sont nécessaires pour terminer l’étape suivante Installer l’application Shopify dans l’application Web Contentful.

Pour savoir comment créer et installer une application sur Shopify, reportez-vous à la documentation Shopify correspondante.

Important : une fois l’application créée et que vous procédez à la sélection de la portée de l’API, cliquez sur Configurer les portées de l’API Storefront. Ensuite, cochez la case unauthenticated_read_product_ listings et cliquez sur Enregistrer.

Étape 2 : installer l’application Shopify dans l’application Web Contentful

Pour installer l’application Shopify dans l’application Web Contentful :

  1. Connectez-vous à l’application Web Contentful.

  2. Dans le volet supérieur, cliquez sur Applications et sélectionnez Marketplace.

  3. Accédez à l’application Shopify et cliquez dessus. La fenêtre « Détails de l’application » s’affiche.

  4. Cliquez sur Installer. La fenêtre « Gérer l’accès à l’application » s’affiche.

  5. Cliquez sur le champ Environnements et cochez les cases correspondant aux environnements dans lesquels vous souhaitez que l’application soit installée.

  6. Cliquez sur Autoriser l’accès. La fenêtre de configuration s’affiche.

  7. Dans la zone Configuration, saisissez les valeurs dans les champs suivants :

    • Jeton d’accès Storefront: saisissez le jeton d’accès Storefront que vous avez acquis après avoir terminé l’installation d’une application dans Shopify, comme décrit à l’ étape 1.

    • Point de terminaison de l’API - Saisissez l’URL du point de terminaison de l’API. Vous pouvez la trouver en haut à gauche de la fenêtre Paramètres de votre compte Shopify.

  8. Dans la zone Affecter aux champs, sélectionnez un champ (un ou plusieurs) pour lequel vous souhaitez installer l’application Shopify.

    REMARQUE : l’application Shopify ne peut être affectée qu’aux champs de type « Texte court » ou « Texte court, liste ».

  9. Après avoir sélectionné un champ, sélectionnez un type de SKU selon les options suivantes :

    • Produit.

    • Variante de produit.

    • Sélecteur de collection.

  10. Cliquez sur Installer dans les environnements sélectionnés. L’application Shopify est installée dans les environnements et les champs sélectionnés.

Apps Shopify Installation

Étape 3 : Référencez le produit Shopify dans une entrée

Pour référencer des produits, des variantes de produits ou des collections Shopify à partir de vos entrées Contentful :

  1. Connectez-vous à l’application Web Contentful.

  2. Accédez à l’onglet « Contenu ».

  3. Créez une nouvelle entrée du type de contenu pour lequel vous avez installé l’application Shopify ou ouvrez une entrée existante.

  4. Trouvez le champ et cliquez sur Sélectionner un produit (ou Sélectionner une variante de produit, Sélectionner une collection,  selon le type de SKU avec lequel le champ est configuré).

  5. Sélectionnez les SKU que vous souhaitez afficher dans votre entrée Contentful.

  6. Cliquez sur Enregistrer ... produit(s).

Votre sélection est affichée dans l’éditeur d’entrées comme dans l’image ci-dessous :

Apps Shopify Selected Products

Étape 4 : Activer les Références externes personnalisées

Pour fournir les données de Shopify à l’aide de Contentful GraphQL API, vous devez d’abord activer les références externes personnalisées en cochant la case Résoudre le contenu à la diffusion dans l’éditeur de champ du type de contenu souhaité.

Pour activer la case à cocher Résoudre le contenu à la diffusion :

  1. Connectez-vous à l’application Web Contentful.

  2. Accédez à l’onglet « Modèle de contenu » et sélectionnez le type de contenu avec la configuration du champ de l’application Shopify.

  3. Dans le champ utilisé avec l’application Shopify, cliquez sur Modifier. L’éditeur de champs s’affiche.

  4. Dans la section « Apparence », sous « Choisir comment ce champ doit être affiché », sélectionnez Shopify.

  5. Cochez la case Résoudre le contenu à la diffusion.

  6. Cliquez sur Confirmer.

  7. Enregistrez vos modifications.

Le contenu Shopify sera disponible via Contentful GraphQL API via le nom du champ configuré avec l’application Shopify ajouté avec_data :

External references Shopify query

FAQ

Quelle est la différence entre l’installation de l’application pour un champ de type Texte court et Texte court, liste ?

Lorsque l’application est installée pour les champs de type « Texte court », le widget de sélection de SKU vous permet de sélectionner un seul SKU. Pour les champs de type « Texte court, liste », le widget vous permet de sélectionner plusieurs SKU.

Comment puis-je obtenir du contenu localisé de Shopify à l’aide de Références externes personnalisées ?

Pour recevoir du contenu localisé de Shopify, tout en utilisant des Références externes personnalisées, vous devez fournir les paramètres régionaux en utilisant la directive @inContext de Shopify sur votre requête Contentful.

Voici un exemple de requête GraphQL qui récupère les données Shopify dans le paramètre régional allemand :

Shopify GraphQL - External reference localisation

Comment puis-je interroger Shopify Storefront API pour les variantes de produits dont j’ai enregistré les identifiants dans mes entrées Contentful ?

Pour récupérer les données des variantes de produit que vous avez sélectionnées et enregistrées dans vos entrées Contentful, vous devez interroger l’entité ProductVariant de GraphQL Storefront API de Shopify.

Voici un exemple de requête GraphQL qui récupère des données pertinentes pour les identifiants de variantes de produits que vous avez enregistrés sur Contentful :

Shopify GraphQL - Product variants

Remplacez le paramètre productVariantIDs  par les identifiants que vous récupérez depuis Contentful.

Comment puis-je interroger Shopify Storefront API pour les produits dont j’ai enregistré les identifiants dans mes entrées Contentful ?

Pour récupérer les données des produits que vous avez sélectionnés et enregistrés dans vos entrées Contentful, vous devez interroger l’entité Produit deGraphQL Storefront API de Shopify.

Voici un exemple de requête GraphQL qui récupère des données pertinentes pour les identifiants de produits que vous avez enregistrés sur Contentful :

Shopify GraphQL - Products

Remplacez le paramètre  productIDs  par les identifiants que vous récupérez depuis Contentful.

Comment puis-je interroger Shopify Storefront API pour les collections dont j’ai enregistré les identifiants dans mes entrées Contentful ?

Pour récupérer les données des collections que vous avez sélectionnées et enregistrées dans vos entrées Contentful, vous devez interroger l’entité Collection de l’API GraphQL Storefront de Shopify.

Voici un exemple de requête GraphQL qui récupère certaines données pertinentes pour les identifiants de collection que vous avez enregistrés sur Contentful :

Shopify GraphQL - Collections

Remplacez le paramètre collectionIDs par les identifiants que vous récupérez depuis Contentful.