Connect your app to Contentful

Connect your app to Contentful to fetch and display published content from your headless CMS, including entries, assets, and rich text.

Contentful is a headless CMS that separates content management from how content is presented. The Contentful connector lets your Lovable app fetch published content from your Contentful space using the Content Delivery API (CDA). Your app can then render content driven pages, product catalogs, blogs, or documentation powered by the content stored in Contentful.

Contentful is available as an app + chat connector: one shared connection that works in the chat while you build and in your published apps.

With Contentful, your app can:

• Fetch published entries, assets, and content types from your space
• Deliver content through Contentful’s CDN backed Content Delivery API
• Build dynamic pages and layouts powered by your CMS content
• Filter and paginate entries by content type, locale, or field values
• Render rich text fields in your app UI

The Contentful connector is read only. It does not support creating, updating, or deleting content. All content management happens in the Contentful web app or through the Contentful Management API.

Common use cases and example apps

Example app	Example prompt	Description
Marketing and landing page sites	Use Contentful and build a marketing site where the homepage and feature pages are loaded from Contentful.	Build marketing pages powered by CMS content. The app fetches page entries from Contentful and renders them as components so editors can update text and images without changing code.
Product catalog apps	Use Contentful and build a product catalog that shows products stored in my Contentful space with category filters.	Display product listings managed in Contentful. The app fetches product entries, renders product cards, and supports filtering and pagination based on fields stored in the CMS.
Blog and editorial platforms	Use Contentful and build a blog that loads articles from Contentful and renders rich text and images.	Create a blog backed by Contentful content. The app fetches article entries, resolves linked assets, and renders rich text fields as formatted content.
Documentation sites	Use Contentful and build a documentation site where each doc page is stored as an entry in Contentful.	Build documentation driven by CMS content. The app fetches documentation entries and generates navigation and pages from the content structure in Contentful.
Multilingual content apps	Use Contentful and build an app that loads content in the user’s language using Contentful locales.	Serve localized content from Contentful. The app fetches entries in the requested locale and renders translated content based on the user’s language.
Event and announcement pages	Use Contentful and build an event listing page that loads upcoming events from Contentful and sorts them by date.	Display event listings managed in Contentful. The app fetches event entries, sorts them by date fields, and renders upcoming events that editors maintain in the CMS.

How to connect Contentful

Workspace admins and owners can connect Contentful.

You can create multiple Contentful connections using different API keys or different spaces. This can be useful for separating development and production environments or connecting multiple Contentful spaces.

When the connection is created, Contentful becomes available across all projects in the workspace.

Prerequisites

Before connecting Contentful, make sure you have:

• A Contentful account with a space that contains published content
• A Content Delivery API (CDA) access token for that space
• Your Space ID
• Lovable workspace owner or admin role

All API requests made through this connector use your Content Delivery API access token. API usage counts toward your Contentful plan limits and billing is handled directly by Contentful, not Lovable.

Step 1: Find your space ID and create a CDA access token

Your Space ID and CDA access token are both available in the Contentful web app.

To find your Space ID:

1. Log in to app.contentful.com.
2. Open the space you want to connect.
3. Go to Settings → General settings.
4. Copy the Space ID.

See Contentful documentation for detailed instructions: Find space ID

To create a Content Delivery API access token:

1. In the same space, go to Settings → API keys.
2. Click Add API key or open an existing key.
3. Give the key a name such as Lovable integration.
4. Copy the Content Delivery API access token.

See Contentful documentation for detailed instructions: Authentication

Your access token functions like a password. Keep it secure and never share it publicly. You’ll need both the Space ID and the access token in the next step.

Step 2: Connect Contentful to Lovable

1. Open Connectors and select Contentful.
2. Click Add connection.
3. Enter a Display name, for example Contentful Prod.
4. Enter your Space ID.
5. Enter your Content Delivery API access token.
6. Click Connect.

When connected, your Lovable apps can start fetching content from your Contentful space.

Manage your connection

Connections are managed from Connectors: select , then open the connection.

• Unlink projects to remove access from specific projects while keeping the connection available for others. See Unlink projects from a connection for the steps.
• Delete the connection to remove it from the workspace entirely. Deleting is permanent. It removes the credentials from all linked projects, and app features that use stop working until a new connection is added. See Delete a connection for the steps and who can delete.