Connect your app to Storyblok

1. 1

   Sign in to your Storyblok account and open the space you want to connect.

   You need to access your Storyblok space to get the necessary information for connecting.

2. 2

   If you only want to show content, go to 'Settings' then 'Access Tokens' in Storyblok, generate a new 'Public' or 'Preview' token, and copy it. Also, note your space's region (e.g., EU, US).

   This token is like a key that allows Lovable to read content from your Storyblok space. The region ensures Lovable connects to the correct Storyblok server.

3. 3

   In Lovable, go to 'Connectors' and select 'Storyblok'.

   This is where you start the process of adding a new connection to Storyblok.

4. 4

   Click 'Add connection', then 'App + chat connector'. Give your connection a name.

   This creates a new connection instance in Lovable that you can identify later.

5. 5

   Under 'Configure connection', choose 'CDN API' if you only want to show content, or 'Management API' if you want to create or change content.

   This determines whether your Lovable app will only read content or also be able to write and publish content in Storyblok.

6. 6

   If you chose 'CDN API', paste your Storyblok access token and select the correct space region. If you chose 'Management API', select the space region and review the permissions, then click 'Connect' and sign in to Storyblok to authorize Lovable.

   This provides Lovable with the credentials and permissions needed to interact with your Storyblok space.

7. 7

   Under 'Sharing', decide if you want to keep the connection private or share it with others in your Lovable workspace.

   This controls who else in your team can use this Storyblok connection in their projects.

8. 8

   Click 'Connect' (or 'Connect to Storyblok and authorize' for Management API).

   This finalizes the connection process, allowing Lovable to verify and save your Storyblok connection.

Connect my app to Storyblok. I want to build a marketing site that pulls landing pages, blog posts, and navigation from Storyblok.

Headless CMS

A 'headless content management system' is a way to store and manage all your website or app content (like text, images, videos) separately from how it looks or is displayed. It's like having a brain for your content that can feed information to any 'body' (like your app, a website, or a smart device) without being tied to a specific design.

Content Delivery API

This is a set of rules that allows your app to ask Storyblok for content to display. It's usually 'read-only,' meaning your app can get content but can't change anything in Storyblok.

Management API

This is a set of rules that allows your app to not only get content from Storyblok but also to create, update, or delete content. It gives your app more control over the content stored in Storyblok.

Access Token

An 'access token' is like a secret key or password that proves your app has permission to access specific content or features in Storyblok. You need to keep it secure.

Space

In Storyblok, a 'space' is like a separate container for all your content, settings, and users for a specific project or website. You might have different spaces for different apps or environments (like a test version and a live version).

SEO metadata

This is information about your content (like a page title or description) that helps search engines like Google understand what your page is about. Good SEO metadata can help more people find your app's content online.

Editorial workflows

This refers to the process and steps involved in creating, reviewing, approving, and publishing content, often involving different roles like writers, editors, and publishers.

• Using a 'Public' access token for a preview environment will not show draft content; you need a 'Preview' token for that.
• Sharing your access token publicly or insecurely can compromise your Storyblok content.
• Selecting the wrong region for your Storyblok space will prevent the connection from working.
• Not having the necessary permissions in your Lovable workspace to create connections will block you from setting this up.
• If Storyblok authorization is revoked, your app will stop working with Storyblok until you reconnect it in Lovable.