How to swap i18n content in Storyblok using their field type translations feature


Did you create a beautiful website with a lot of content and then someone came along with a request to change the default language? If the answer is yes, then don’t worry, it’s pretty easy to swap translated content using Management API of Storyblok.

Detailed Case Description

Yes, we also experienced this situation at Wondrous LTD. As we set up the project, we already knew that the page would have to be multilingual and would require at least 2 language versions of content for go live. Storyblok offers you 3 different solutions of internationalization - Single tree and field level translation, Multiple trees and Mixed approach. We choose option no. 1 - Single tree and field level translation. This means that you have one default language version and you can add as many additional language versions as you want through settings. We added German as a secondary language and set up the whole NuxtJS project with English as the default language in mind.

After some time and “go live” we were kindly asked if it would be possible to make the German translation default and English secondary. After that, an editor would see “Default” and “English” listed in dropdown. Basically, you have two options how to do it:

  • You can do it manually and copy&paste all content
  • You can use the Management API of Storyblok and write a short script, which will do it for you.

I believe, you would choose the second option.

See the implementation

You want to know how Wondrous LTD solved that using our Management API? Read more details and see the source at: WeAreWondrous - How to swap i18n content within Storyblok

WeAreWondrous - How to swap i18n content within Storyblok

Samuel Snopko


Samuel Snopko

Samuel is the Head of Developer Relations at Storyblok with a passion for JAMStack and beautiful web. Co-creator of DX Meetup Basel and co-organizer of Frontend Meetup Freiburg. Recently fell in love with Vue.js, Nuxt.js, and Storyblok.