{"id":8135,"date":"2026-10-07T12:44:20","date_gmt":"2026-10-07T10:44:20","guid":{"rendered":"https:\/\/helpdesk.kontainer.com\/article\/integratiegids-voor-storyblok\/"},"modified":"2026-10-07T14:06:39","modified_gmt":"2026-10-07T12:06:39","slug":"integratiegids-voor-storyblok","status":"publish","type":"article","link":"https:\/\/helpdesk.kontainer.com\/nl\/article\/integratiegids-voor-storyblok\/","title":{"rendered":"Integratiegids voor Storyblok"},"content":{"rendered":"<p>Met de Storyblok-integratie van Kontainer kiezen je redacteuren afbeeldingen, video&#8217;s en bestanden rechtstreeks uit je DAM, zonder bestanden naar Storyblok te uploaden. Storyblok slaat alleen een verwijzing naar het bestand op; het eigenlijke bestand blijft in Kontainer en wordt via een CDN geleverd.<\/p>\n<p>Op de <a href=\"https:\/\/kontainer.com\/nl\/integrations\" target=\"_blank\" rel=\"noopener\">integratiepagina<\/a> van Kontainer leest je meer over toepassingen, voordelen en meer.<\/p>\n<h2>Vereisten<\/h2>\n<ul>\n<li>Een Storyblok-space en <strong>beheerdersrechten<\/strong> daarop \u2013 zonder die rechten kan de extensie niet worden ge\u00efnstalleerd<\/li>\n<li>Een Kontainer-account (https:\/\/jouwbedrijf.kontainer.com)<\/li>\n<li>De Storyblok-integratie ingeschakeld voor je Kontainer-account \u2013 controleer bij je accountmanager of die bij je abonnement is inbegrepen<\/li>\n<\/ul>\n<h2>Wat wordt waar opgeslagen?<\/h2>\n<p>Je bestanden blijven in Kontainer. Er wordt niets ge\u00fcpload naar de bestandsbibliotheek van Storyblok. Storyblok slaat een standaardwaarde voor een bestand op die naar het Kontainer-CDN verwijst, met daarnaast de Kontainer-referentie:<\/p>\n<ul>\n<li><code>filename<\/code> \u2013 de CDN-URL, inclusief het downloadsjabloon dat je hebt gekozen<\/li>\n<li><code>alt, title<\/code> \u2013 overgenomen uit de beschrijving van het bestand in Kontainer<\/li>\n<li><code>focus<\/code> \u2013 het brandpunt dat je in Kontainer hebt ingesteld, in het eigen formaat van Storyblok<\/li>\n<li><code>meta_data.kontainer_file_id, kontainer_folder_id, kontainer_url<\/code> \u2013 identificatiegegevens om het bestand op te halen<\/li>\n<li><code>meta_data.kontainer_thumbnail_url, kontainer_extension, kontainer_type<\/code><\/li>\n<\/ul>\n<p>Omdat de alt-tekst en het brandpunt met de verwijzing meereizen, hoeven redacteuren metadata niet opnieuw in te typen in Storyblok, en wordt een bestand dat je in Kontainer vervangt overal bijgewerkt waar het wordt gebruikt.<\/p>\n<h2>Aan de slag<\/h2>\n<h3>1. De integratie in Kontainer inschakelen<\/h3>\n<p>Vraag je accountmanager om de Storyblok-integratie voor je Kontainer-account in te schakelen. Daarmee kan Storyblok de Kontainer-bestandskiezer insluiten, en dat is vereist voordat de kiezer opent.<\/p>\n<h3>2. De extensie in Storyblok installeren<\/h3>\n<p>Open de installatielink, kies de space waarin je wilt installeren en bevestig:<\/p>\n<pre><code>https:\/\/app.storyblok.com\/#\/install\/kontainer@asset-picker<\/code><\/pre>\n<p>Je hebt beheerdersrechten nodig voor de doelspace. Installeer de extensie \u00e9\u00e9n keer per space.<\/p>\n<h3>3. Het Kontainer-veld aan een blok toevoegen<\/h3>\n<p>Ga in je space naar de <strong>Block Library<\/strong>, open het blok waarin je de kiezer wilt hebben en voeg een nieuw veld toe. Stel het type in op <strong>Plugin<\/strong> en kies <code>kontainer<\/code> uit de lijst.<\/p>\n<h3>4. Het veld naar je Kontainer laten verwijzen<\/h3>\n<p>Voeg bij het geselecteerde veld de optie <code>kontainerHost<\/code> toe en stel die in op je Kontainer-domein, bijvoorbeeld <code>jouwbedrijf.kontainer.com<\/code> (met of zonder <code>https:\/\/<\/code>).<\/p>\n<p>Storyblok slaat plug-inopties per veld op, dus herhaal dit bij elk veld dat de kiezer gebruikt. Storyblok neemt optiewaarden niet over tussen spaces, dus elke space configureert je afzonderlijk.<\/p>\n<h3>5. Bestanden kiezen<\/h3>\n<p>Open een story die het blok gebruikt en klik bij het veld op <strong>Select from Kontainer<\/strong>. Log de eerste keer in met je gewone Kontainer-gebruikersnaam en -wachtwoord. Blader, zoek en filter in je bibliotheek zoals gewoonlijk, pas eventueel een downloadsjabloon toe (bijsnijden, formaat wijzigen, bestandsformaat) en kies het bestand.<\/p>\n<p>Het veld toont daarna een voorbeeld en de bestandsnaam. Met <strong>Replace asset<\/strong> kies je een ander bestand en met <strong>Remove asset<\/strong> maak je het veld leeg. Bestanden die geen afbeelding zijn, zoals pdf&#8217;s en video&#8217;s, tonen in plaats van een voorbeeldafbeelding een bestandskaart met het bestandstype.<\/p>\n<h2>Veldopties<\/h2>\n<table>\n<tr>\n<th>Optie<\/th>\n<th>Vereist<\/th>\n<th>Waarde<\/th>\n<\/tr>\n<tr>\n<td><code>kontainerHost<\/code><\/td>\n<td>Ja<\/td>\n<td>Je Kontainer-domein, bijvoorbeeld <code>jouwbedrijf.kontainer.com<\/code><\/td>\n<\/tr>\n<tr>\n<td><code>mode<\/code><\/td>\n<td>Nee<\/td>\n<td><code>external<\/code> (standaard) koppelt het bestand in Kontainer. <code>import<\/code> kopieert het naar de bestandsbibliotheek van Storyblok.<\/td>\n<\/tr>\n<tr>\n<td><code>storyblokRegion<\/code><\/td>\n<td>Alleen bij importeren<\/td>\n<td><code>eu<\/code> (standaard), <code>us<\/code>, <code>ca<\/code>, <code>ap<\/code> of <code>cn<\/code><\/td>\n<\/tr>\n<tr>\n<td><code>storyblokManagementToken<\/code><\/td>\n<td>Alleen bij importeren<\/td>\n<td>Een persoonlijk toegangstoken van Storyblok met schrijftoegang tot bestanden<\/td>\n<\/tr>\n<tr>\n<td><code>maxImportMb<\/code><\/td>\n<td>Nee<\/td>\n<td>Het grootste bestand dat de import accepteert, standaard <code>50<\/code><\/td>\n<\/tr>\n<\/table>\n<h2>Optioneel: bestanden in Storyblok importeren<\/h2>\n<p>Sommige teams eisen dat elk bestand door Storyblok zelf wordt gehost. Stelt je <code>mode<\/code> in op <code>import<\/code>, dan wordt het bestand naar de eigen bestandsbibliotheek van de space gekopieerd in plaats van gekoppeld. Het bestand is dan een gewoon Storyblok-bestand, en de afbeeldingsservice van Storyblok kan het bewerken.<\/p>\n<p>Twee dingen om rekening mee te houden voordat je een veld op importmodus zet:<\/p>\n<ul>\n<li>De kopie wordt niet meer bijgewerkt wanneer het bestand in Kontainer verandert.<\/li>\n<li>Het managementtoken is een veldoptie, wat betekent dat het wordt geleverd aan de browser van elke redacteur die dat veld gebruikt. Maak daarvoor een <strong>beperkt<\/strong> token: geef het in Storyblok alleen de scope voor bestanden, beperkt tot de ene space die het nodig heeft. Gebruik geen token dat toegang heeft tot je hele account.<\/li>\n<\/ul>\n<h2>Het bestand in je frontend gebruiken<\/h2>\n<p>Het veld retourneert een standaard Storyblok-bestandsobject en gedraagt zich dus als elk ander bestandsveld:<\/p>\n<pre><code>const { filename, alt, focus } = story.content.hero;<\/code><\/pre>\n<p>Vraag het bestand op via <code>filename<\/code> \u2013 het wordt geleverd vanuit het CDN van Kontainer.<\/p>\n<p>De afbeeldingsservice van Storyblok schaalt of snijdt een externe URL niet bij. Gebruik dus de eigen transformatieparameters van Kontainer, of een downloadsjabloon dat je bij het kiezen selecteert, om de geleverde grootte en het formaat te bepalen. Het brandpunt is beschikbaar als Storyblok-waarde <code>focus<\/code> en als ruwe pixelco\u00f6rdinaten in <code>meta_data<\/code>.<\/p>\n<h2>Support<\/h2>\n<p>Heb je hulp nodig bij het instellen of configureren van de Storyblok-plug-in? Ons supportteam helpt je graag.<\/p>\n<p>Neem contact op via: <a href=\"mailto:support@kontainer.com\">support@kontainer.com<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Met de Storyblok-integratie van Kontainer voegen je redacteuren afbeeldingen, video&#8217;s en bestanden rechtstreeks uit je DAM in de Visual Editor van Storyblok in \u2013 zonder ze te downloaden en opnieuw te uploaden.<\/p>\n","protected":false},"author":16,"featured_media":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","article-category":[174,177],"article-tag":[181,186,188],"class_list":["post-8135","article","type-article","status-publish","hentry","article-category-beheerinstellingen","article-category-integraties-plug-ins","article-tag-add-onfunctie","article-tag-premium-abonnementen","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\/nl\/wp-json\/wp\/v2\/article\/8135","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/helpdesk.kontainer.com\/nl\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/helpdesk.kontainer.com\/nl\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/helpdesk.kontainer.com\/nl\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/helpdesk.kontainer.com\/nl\/wp-json\/wp\/v2\/comments?post=8135"}],"version-history":[{"count":1,"href":"https:\/\/helpdesk.kontainer.com\/nl\/wp-json\/wp\/v2\/article\/8135\/revisions"}],"predecessor-version":[{"id":8197,"href":"https:\/\/helpdesk.kontainer.com\/nl\/wp-json\/wp\/v2\/article\/8135\/revisions\/8197"}],"wp:attachment":[{"href":"https:\/\/helpdesk.kontainer.com\/nl\/wp-json\/wp\/v2\/media?parent=8135"}],"wp:term":[{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/helpdesk.kontainer.com\/nl\/wp-json\/wp\/v2\/article-category?post=8135"},{"taxonomy":"article-tag","embeddable":true,"href":"https:\/\/helpdesk.kontainer.com\/nl\/wp-json\/wp\/v2\/article-tag?post=8135"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}