Bynder

La plateforme de gestion des ressources numériques de Bynder, optimisée par l’IA, permet aux équipes de gérer efficacement la prolifération des contenus, des points de contact et des relations. Elle unifie et transforme la création et le partage des ressources média de la marque.

Après avoir installé l’application Bynder, les éditeurs peuvent sélectionner des ressources média à partir de leur compte Bynder directement dans Contentful, ce qui permet aux équipes de conception et de marketing d’accéder facilement à leurs ressources média les plus récentes et de les lier.

Apps Bynder dialog updated

Aperçu

L’application Bynder est un widget qui permet aux éditeurs de sélectionner des ressources média à partir de leur compte Bynder. Cliquez sur Sélectionner un fichier sur Bynder et sélectionnez les ressources média que vous souhaitez référencer à partir de votre entrée. Les données de ressources de Bynder sont stockées directement dans votre entrée de contenu en tant que champ JSON, que vos développeurs peuvent référencer directement à partir des API de diffusion de Contentful.

Les identifiants des ressources média sélectionnées sont ensuite stockés dans Contentful. Dans votre application client, vous récupérez ensuite le contenu de Contentful et résolvez tous les détails nécessaires sur les médias en utilisant les identifiants pour récupérer des binaires ou des métadonnées de l’API de Bynder.

Conditions

Pour utiliser cette application, vous aurez besoin de :

  • L’URL de votre compte Bynder.

  • Un type de contenu avec un champ de type objet JSON pour stocker les références de ressources média Bynder.

  • L’identifiant client et la clé secrète client Bynder configurés dans les paramètres de l’application.

  • Identifiants OAuth2 ’Client credentials’ de Bynder avec des privilèges d’accès à l’API.

Autorisations

Les autorisations et scopes suivants doivent être activés :

  • Possibilité de visualiser les ressources média et les informations du portail.

  • grant_type : Client Credentials.

  • scopes :

    • asset.read

    • asset.usage:read

    • asset.usage:write

Utilisation

Étape 1 : Sélectionner le mode

L’application offre deux modes de sélection des ressources média :

Mode MultiSelect

  • Mode par défaut.

  • Permet aux créateurs de contenu de sélectionner plusieurs ressources média à la fois.

  • Ne prend pas en charge la sélection de dérivés ou les transformations.

  • Recommandé pour la plupart des utilisateurs.

Votre frontend doit s’appuyer sur le paramètre src ou des champs d’URL Bynder similaires.

Mode SingleSelectFile

  • Permet de sélectionner un fichier à la fois.

  • Prend en charge la sélection d’images dérivées et les transformations dans l’application (si CX Omnichannel est activé).

  • Fournit un attribut selectedFile dans les réponses de l’API.

Votre frontend doit s’appuyer sur le paramètre selectedFile.url pour afficher l’image finale. Si des transformations sont appliquées, cette URL pointera vers la ressource média transformée.

Étape 2 : Mode de préremplissage des ressources média sélectionnées

Sur l’écran de configuration, vous pouvez choisir si les nouvelles sélections de ressources média s’ajoutent ou remplacent les ressources média existantes dans votre entrée.

Par défaut (« Préremplir les ressources média sélectionnées » = Non)

  • Les ressources média sélectionnées sont ajoutées au champ.

  • Les ressources média peuvent être ajoutées plusieurs fois.

  • Les ressources média enregistrées ne sont pas présélectionnées lors de la réouverture du sélecteur.

Mode de préremplissage (« Préremplir les ressources média sélectionnées » = Oui)

  • Les ressources média nouvellement sélectionnées remplacent toutes les ressources média existantes.

  • Les ressources média ne peuvent pas être enregistrées plus d’une fois.

  • Les ressources média précédemment enregistrées sont présélectionnées dans le sélecteur.

Étape 3 : Installer et configurer

  1. Sous Configuration, indiquez l’URL de votre compte Bynder.

  2. Attribuez des champs de type objet JSON à l’application.

  3. Choisissez votre mode de sélection (MultiSelect ou SingleSelectFile).

  4. Choisissez votre comportement de pré-remplissage (« Oui » ou « Non »).

  5. Configurez vos informations d’identification Bynder OAuth2 (identifiant client et clé secrète client).

Si le mode SingleSelectFile et TransformBaseURL sont utilisés, les réponses de l’API incluront des paramètres de transformation tels que la hauteur, la largeur et le point d’ancrage pour le dérivé sélectionné.

Apps Bynder installation screen

Cliquez sur Installer pour terminer l’installation et enregistrer la configuration.

Étape 4 : Utiliser l’application

Mode de sélection multiple

Apps Bynder select file on Bynder

Pour référencer une ressource média sur Bynder à partir de votre entrée :

  1. Cliquez sur Sélectionner un fichier sur Bynder.

  2. Sélectionnez les ressources média dans Bynder à l’aide de la boîte de dialogue.

  3. Cliquez sur Ajouter une ressource média.

Apps Bynder dialog updated

Vos développeurs frontend recevront une charge utile JSON contenant un paramètre similaire à "original": "https://BRAND.getbynder.com/~/file.jpg". Il est recommandé qu’ils utilisent les champs original ou src pour extraire les ressources média. Les champs spécifiques disponibles dans cette réponse peuvent différer en fonction de votre configuration et de votre package Bynder spécifiques.

Apps Bynder selected assets in field location

Les aperçus de vos ressources média apparaîtront désormais dans votre entrée. Vous pouvez également cliquer sur « Plus de détails » pour voir le nom et l’identifiant de la ressource média.

Apps Bynder selected assets more details

Mode de sélection de fichier unique

Pour référencer une ressource média sur Bynder à partir de votre entrée :

  1. Cliquez sur Sélectionner un fichier sur Bynder.

  2. Sélectionnez les ressources média dans Bynder à l’aide de la boîte de dialogue.

  3. Sélectionnez une URL de base dérivée ou de transformation, et effectuez les transformations nécessaires.

  4. Cliquez sur Ajouter une ressource média.

Bynder Single File Select

Vos développeurs frontend recevront l’une des deux charges utiles JSON contenant un attribut selectedFile. Dans les deux cas, vos développeurs doivent extraire le paramètre « url » sous le paramètre « selectedFile » pour obtenir l’image transformée avec précision.

Si le mode SingleSelectFile et TransformBaseURL sont sélectionnés avec une transformation personnalisée, la réponse inclura des paramètres sur l’URL de transformation qui fournissent la hauteur, la largeur, le type de transformation et la gravité demandés. Si le mode SingleSelectFile et TransformBaseURL sont sélectionnés sans transformation personnalisée, vous recevrez des paramètres pour la hauteur, la largeur et la taille du fichier en tant qu’attributs distincts.

Les aperçus de vos ressources média apparaîtront désormais dans votre entrée.

Asset Tracker

L’Asset Tracker synchronise automatiquement l’utilisation des ressources Bynder avec les entrées Contentful à l’aide de Contentful App Events.

Comment cela fonctionne-t-il ?

  • Crée des enregistrements d’utilisation lorsque les entrées sont publiées.

  • Met à jour les enregistrements lorsque les entrées sont republiées.

  • Supprime les enregistrements d’utilisation lorsque les entrées ne sont pas publiées, supprimées ou archivées.

  • Suit les ressources média uniquement dans l’environnement principal.

Étapes de configuration

  1. Assurez-vous que l’identifiant client et la clé secrète Bynder avec les privilèges corrects sont configurés.

  2. Implémentez la fonction Contentful functions/asset-tracker.ts fournie en tant que gestionnaire back-end App Event.

  3. Configurez les événements d’application dans Contentful pour déclencher la fonction de publication, de dépublier, de suppression et d’archivage des événements.

  4. Vérifiez que les identifiants OAuth2 Bynder disposent des scopes nécessaires pour l’Asset Usage API.

Remarque : le suivi des ressources média nécessite des informations d’identification Bynder OAuth2 correctement configurées avec les champs d’application nécessaires (asset.read, asset.usage:read, asset.usage:write) pour fonctionner correctement.

FAQ

Il n’y a pas de types de contenu avec le champ objet JSON, à l’aide !

Bynder enregistre les données dans une entrée Contentful à l’aide de données JSON. Si vous souhaitez associer des ressources média Bynder à un type de contenu spécifique, vous devez mettre à jour ce type de contenu pour inclure un nouveau champ de type objet JSON. Pour en savoir plus sur le type de champ objet JSON, consultez notre documentation sur les concepts.

Que faire si l’éditeur d’entrées affiche l’avertissement La valeur du champ est incompatible ?

Le champ « objet JSON » de cette entrée contient déjà des données qui n’ont pas été générées par l’application Bynder. Veuillez vous assurer que vous avez sélectionné le bon champ dans la configuration de l’application à utiliser avec Bynder et que vous n’avez plus besoin des données précédemment saisies. Sélectionnez ensuite Je souhaite remplacer la valeur à l’aide de l’application, ce qui initialisera le champ avec une sélection vide. Vous pouvez maintenant commencer à ajouter des médias à votre entrée.

Pour accéder à la valeur du champ sous-jacent, désélectionnez le champ dans la configuration de l’application Bynder. Cela réinitialisera l’éditeur à l’affichage json par défaut pour les champs d’objet.

Comment accéder à l’URL de la ressource média d’origine ?

La disponibilité de l’URL de la ressource média d’origine dans la charge utile JSON dépend de la publication d’une ressource média dans le portail Bynder. Pour rendre une ressource média publique, vous devez accéder à la section « Modifier » de votre portail Bynder, puis sous Droits avancés, vous devez sélectionner l’option Marquer comme public. Dès que le paramètre est enregistré, la charge utile JSON inclura la propriété originale pointant vers une ressource média non modifiée.

Je remarque un comportement étrange lorsque je passe de la sélection unique à la sélection multiple (ou inversement) !

Si vous sélectionnez Sélection unique ou Sélection multiple dans la définition de l’application Bynder, vous pouvez remarquer un comportement imprévisible lorsque vous changez ce choix plus tard. L’option Sélection unique fournit un paramètre supplémentaire pour les images que vous sélectionnez (selectedFile) qui n’est pas disponible avec l’option Sélection multiple. Si vous vous fiez à ce paramètre pour une partie de votre site, vous verrez un comportement imprévisible sur les entrées existantes si vous modifiez les sélections.

Nous vous recommandons de choisir et de conserver exclusivement la sélection unique ou multiple.

Comment afficher des détails supplémentaires sur les ressources média sélectionnées ?

Vous pouvez voir des aperçus des ressources média sélectionnées dans l’éditeur de champ Bynder. Vous pouvez également cliquer sur « Plus de détails » pour afficher le nom et l’identifiant de la ressource média. Les données supplémentaires pour chaque ressource média sont enregistrées dans JSON dans le champ et sont accessibles via nos API.