With Kontainer's Storyblok integration, your editors can select images, videos, and files directly from your DAM without uploading files to Storyblok. Storyblok only stores a reference to the file; the actual asset stays in Kontainer and is delivered via CDN.

Go to the Kontainer integration page to learn more about use cases, benefits and more.

Requirements

A Storyblok space, and admin rights on it — the extension cannot be installed without them
A Kontainer account (https://yourcompany.kontainer.com)
The Storyblok integration enabled on your Kontainer account — confirm with your account manager that it is included in your plan

What Gets Stored Where?

Your files stay in Kontainer. Nothing is uploaded to Storyblok's asset library. Storyblok stores a standard asset value that points at the Kontainer CDN, with the Kontainer reference kept alongside it:

filename - the CDN URL, including the download template you picked
alt, title - taken from the file's description in Kontainer
focus - the focal point you set in Kontainer, in Storyblok's own format
meta_data.kontainer_file_id, kontainer_folder_id, kontainer_url - identifiers for retrieving the asset
meta_data.kontainer_thumbnail_url, kontainer_extension, kontainer_type

Because the alt text and the focal point travel with the reference, editors do not retype metadata in Storyblok, and replacing a file in Kontainer updates it everywhere it is used.

Getting started

1. Enable the integration in Kontainer

Ask your account manager to switch on the Storyblok integration for your Kontainer account. This allows Storyblok to embed the Kontainer file picker and is required before the picker will open.

2. Install the extension in Storyblok

Open the install link, pick the space you want to install into, and confirm:

https://app.storyblok.com/#/install/kontainer@asset-picker

You need admin rights on the target space. Install it once per space.

3. Add the Kontainer field to a block

In your space, go to Block Library, open the block you want the picker in, and add a new field. Set its type to Plugin and choose kontainer from the list.

4. Point the field at your Kontainer

With the field selected, add the option kontainerHost and set it to your Kontainer domain, for example yourcompany.kontainer.com (with or without https://).

Storyblok stores plugin options per field, so repeat this on every field that uses the picker. Storyblok does not carry option values across spaces, so each space is configured separately.

5. Select assets

Open a story that uses the block and click Select from Kontainer on the field. Log in with your regular Kontainer username and password the first time. Browse, search and filter your library as usual, optionally apply a download template (crop, resize, format), and select the file.

The field then shows a preview and the file name. Replace asset picks a different file and Remove asset clears the field. Non-image files such as PDFs and video show a file card with the file type instead of a preview image.

Field options

Option	Required	Value
`kontainerHost`	Yes	Your Kontainer domain, e.g. `yourcompany.kontainer.com`
`mode`	No	`external` (default) links the file in Kontainer. `import` copies it into Storyblok's asset library.
`storyblokRegion`	Import only	`eu` (default), `us`, `ca`, `ap` or `cn`
`storyblokManagementToken`	Import only	A Storyblok personal access token with asset write access
`maxImportMb`	No	Largest file the import will accept, default `50`

Optional: importing files into Storyblok

Some teams require every asset to be hosted by Storyblok itself. Setting mode to import copies the file into the space's own asset library instead of linking it. The file is then a normal Storyblok asset, and Storyblok's image service can transform it.

Two things to keep in mind before you switch a field to import mode:

The copy no longer updates when the file changes in Kontainer.
The management token is a field option, which means it is delivered to the browser of every editor who uses that field. Create a scoped token for it: in Storyblok, give it the Assets scope only, restricted to the one space that needs it. Do not reuse a token that has access to your whole account.

Using the asset in your frontend

The field returns a standard Storyblok asset object, so it behaves like any other asset field:

const { filename, alt, focus } = story.content.hero;

Request the asset from filename - it is served from Kontainer's CDN.

Storyblok's image service does not resize or crop an external URL, so use Kontainer's own transformation parameters, or a download template chosen at selection time, to control the delivered size and format. The focal point is available both as Storyblok's focus value and as raw pixel coordinates in meta_data.

Support

If you need help setting up or configuring the Storyblok plugin, our support team is happy to assist.

Please contact: support@kontainer.com