meta_data.kontainer_thumbnail_url, kontainer_extension, kontainer_type<\/code><\/li>\n<\/ul>\nComme le texte alternatif et le point focal accompagnent la r\u00e9f\u00e9rence, les \u00e9diteurs n’ont pas \u00e0 ressaisir les m\u00e9tadonn\u00e9es dans Storyblok, et le remplacement d’un fichier dans Kontainer le met \u00e0 jour partout o\u00f9 il est utilis\u00e9.<\/p>\n
Pour commencer<\/h2>\n1. Activer l’int\u00e9gration dans Kontainer<\/h3>\n
Demandez \u00e0 votre responsable de compte d’activer l’int\u00e9gration de Storyblok pour votre compte Kontainer. Cela permet \u00e0 Storyblok d’int\u00e9grer le s\u00e9lecteur de fichiers de Kontainer, et c’est indispensable pour que le s\u00e9lecteur s’ouvre.<\/p>\n
2. Installer l’extension dans Storyblok<\/h3>\n
Ouvrez le lien d’installation, choisissez l’espace dans lequel vous souhaitez l’installer et confirmez :<\/p>\n
https:\/\/app.storyblok.com\/#\/install\/kontainer@asset-picker<\/code><\/pre>\nVous devez disposer de droits d’administrateur sur l’espace cible. L’installation se fait une seule fois par espace.<\/p>\n
3. Ajouter le champ Kontainer \u00e0 un bloc<\/h3>\n
Dans votre espace, rendez-vous dans Block Library<\/strong>, ouvrez le bloc dans lequel vous souhaitez le s\u00e9lecteur et ajoutez un nouveau champ. D\u00e9finissez son type sur Plugin<\/strong> et choisissez kontainer<\/code> dans la liste.<\/p>\n4. Faire pointer le champ vers votre Kontainer<\/h3>\n
Le champ \u00e9tant s\u00e9lectionn\u00e9, ajoutez l’option kontainerHost<\/code> et d\u00e9finissez-la sur le domaine de votre Kontainer, par exemple votreentreprise.kontainer.com<\/code> (avec ou sans https:\/\/<\/code>).<\/p>\nStoryblok enregistre les options de plugin champ par champ : r\u00e9p\u00e9tez donc cette \u00e9tape pour chaque champ qui utilise le s\u00e9lecteur. Storyblok ne reporte pas les valeurs d’options d’un espace \u00e0 l’autre : chaque espace se configure s\u00e9par\u00e9ment.<\/p>\n
5. S\u00e9lectionner des fichiers<\/h3>\n
Ouvrez une story qui utilise le bloc et cliquez sur Select from Kontainer<\/strong> dans le champ. Lors de la premi\u00e8re utilisation, connectez-vous avec votre nom d’utilisateur et votre mot de passe Kontainer habituels. Parcourez, recherchez et filtrez votre biblioth\u00e8que comme d’habitude, appliquez si besoin un mod\u00e8le de t\u00e9l\u00e9chargement (recadrage, redimensionnement, format), puis s\u00e9lectionnez le fichier.<\/p>\nLe champ affiche alors un aper\u00e7u et le nom du fichier. Replace asset<\/strong> permet de choisir un autre fichier et Remove asset<\/strong> vide le champ. Les fichiers qui ne sont pas des images, comme les PDF et les vid\u00e9os, affichent une carte avec le type de fichier \u00e0 la place d’un aper\u00e7u.<\/p>\nOptions du champ<\/h2>\n
\n\n| Option<\/th>\n | Obligatoire<\/th>\n | Valeur<\/th>\n<\/tr>\n |
\nkontainerHost<\/code><\/td>\n| Oui<\/td>\n | Le domaine de votre Kontainer, par exemple votreentreprise.kontainer.com<\/code><\/td>\n<\/tr>\n\nmode<\/code><\/td>\n| Non<\/td>\n | external<\/code> (par d\u00e9faut) relie le fichier dans Kontainer. import<\/code> le copie dans la biblioth\u00e8que de fichiers de Storyblok.<\/td>\n<\/tr>\n\nstoryblokRegion<\/code><\/td>\n| Import uniquement<\/td>\n | eu<\/code> (par d\u00e9faut), us<\/code>, ca<\/code>, ap<\/code> ou cn<\/code><\/td>\n<\/tr>\n\nstoryblokManagementToken<\/code><\/td>\n| Import uniquement<\/td>\n | Un jeton d’acc\u00e8s personnel Storyblok avec acc\u00e8s en \u00e9criture aux fichiers<\/td>\n<\/tr>\n | \nmaxImportMb<\/code><\/td>\n| Non<\/td>\n | Taille maximale d’un fichier accept\u00e9 par l’import, 50<\/code> par d\u00e9faut<\/td>\n<\/tr>\n<\/table>\nFacultatif : importer des fichiers dans Storyblok<\/h2>\nCertaines \u00e9quipes exigent que tous les fichiers soient h\u00e9berg\u00e9s par Storyblok lui-m\u00eame. En d\u00e9finissant mode<\/code> sur import<\/code>, le fichier est copi\u00e9 dans la biblioth\u00e8que de fichiers de l’espace au lieu d’\u00eatre reli\u00e9. Il devient alors un fichier Storyblok ordinaire, que le service d’images de Storyblok peut transformer.<\/p>\nDeux points \u00e0 garder \u00e0 l’esprit avant de passer un champ en mode import :<\/p>\n \n- La copie n’est plus mise \u00e0 jour lorsque le fichier change dans Kontainer.<\/li>\n
- Le jeton de gestion est une option de champ : il est donc transmis au navigateur de chaque \u00e9diteur qui utilise ce champ. Cr\u00e9ez-en un jeton restreint<\/strong> : dans Storyblok, accordez-lui uniquement le p\u00e9rim\u00e8tre Assets, limit\u00e9 \u00e0 l’unique espace concern\u00e9. Ne r\u00e9utilisez pas un jeton qui a acc\u00e8s \u00e0 l’ensemble de votre compte.<\/li>\n<\/ul>\n
Utiliser le fichier dans votre frontend<\/h2>\nLe champ renvoie un objet de fichier Storyblok standard : il se comporte comme n’importe quel autre champ de fichier :<\/p>\n const { filename, alt, focus } = story.content.hero;<\/code><\/pre>\nAppelez le fichier \u00e0 partir de filename<\/code> : il est servi depuis le CDN de Kontainer.<\/p>\nLe service d’images de Storyblok ne redimensionne ni ne recadre une URL externe : utilisez donc les param\u00e8tres de transformation propres \u00e0 Kontainer, ou un mod\u00e8le de t\u00e9l\u00e9chargement choisi lors de la s\u00e9lection, pour contr\u00f4ler la taille et le format livr\u00e9s. Le point focal est disponible \u00e0 la fois sous la forme de la valeur focus<\/code> de Storyblok et sous la forme de coordonn\u00e9es brutes en pixels dans meta_data<\/code>.<\/p>\nSupport<\/h2>\nSi vous avez besoin d’aide pour installer ou configurer le plugin Storyblok, notre \u00e9quipe de support se fera un plaisir de vous aider.<\/p>\n Contactez : support@kontainer.com<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"Avec l’int\u00e9gration de Kontainer \u00e0 Storyblok, vos \u00e9diteurs peuvent ins\u00e9rer des images, des vid\u00e9os et des fichiers directement depuis votre DAM dans le Visual Editor de Storyblok, sans les t\u00e9l\u00e9charger puis les t\u00e9l\u00e9verser de nouveau.<\/p>\n","protected":false},"author":16,"featured_media":0,"menu_order":0,"comment_status":"","ping_status":"closed","template":"","article-category":[191,194],"article-tag":[198,203,205],"class_list":["post-8312","article","type-article","status-publish","hentry","article-category-parametres-dadministration","article-category-integrations-et-plugins","article-tag-fonctionnalite-complementaire","article-tag-offres-premium","article-tag-dam"],"translations":{"da":{"id":8010,"title":"Integrationsguide til Storyblok","url":"https:\/\/helpdesk.kontainer.com\/da\/article\/integrationsguide-til-storyblok\/"},"de":{"id":7755,"title":"Storyblok-Integrationsleitfaden","url":"https:\/\/helpdesk.kontainer.com\/de\/article\/storyblok-integrationsleitfaden\/"},"en":{"id":7754,"title":"Storyblok Integration Guide","url":"https:\/\/helpdesk.kontainer.com\/article\/storyblok-integration-guide\/"},"es":{"id":8434,"title":"Gu\u00eda de integraci\u00f3n con Storyblok","url":"https:\/\/helpdesk.kontainer.com\/es\/article\/guia-de-integracion-con-storyblok\/"},"fr":{"id":8312,"title":"Guide d\u2019int\u00e9gration de Storyblok","url":"https:\/\/helpdesk.kontainer.com\/fr\/article\/guide-dintegration-storyblok\/"},"nl":{"id":8135,"title":"Integratiegids voor Storyblok","url":"https:\/\/helpdesk.kontainer.com\/nl\/article\/integratiegids-voor-storyblok\/"},"sv":{"id":7857,"title":"Integrationsguide f\u00f6r Storyblok","url":"https:\/\/helpdesk.kontainer.com\/sv\/article\/integrationsguide-for-storyblok\/"}},"_links":{"self":[{"href":"https:\/\/helpdesk.kontainer.com\/fr\/wp-json\/wp\/v2\/article\/8312","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/helpdesk.kontainer.com\/fr\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/helpdesk.kontainer.com\/fr\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/helpdesk.kontainer.com\/fr\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/helpdesk.kontainer.com\/fr\/wp-json\/wp\/v2\/comments?post=8312"}],"version-history":[{"count":0,"href":"https:\/\/helpdesk.kontainer.com\/fr\/wp-json\/wp\/v2\/article\/8312\/revisions"}],"wp:attachment":[{"href":"https:\/\/helpdesk.kontainer.com\/fr\/wp-json\/wp\/v2\/media?parent=8312"}],"wp:term":[{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/helpdesk.kontainer.com\/fr\/wp-json\/wp\/v2\/article-category?post=8312"},{"taxonomy":"article-tag","embeddable":true,"href":"https:\/\/helpdesk.kontainer.com\/fr\/wp-json\/wp\/v2\/article-tag?post=8312"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
| | | | | | | | |