kitful.aiKitful
Integrations

Framer

Connect Kitful to a Framer project, create managed CMS collections, and sync articles into Framer.

Use the Framer integration when you want Kitful articles to land in a Framer CMS collection through the Kitful plugin.

In the current release, the Framer flow is collection-based:

  • connect a Framer project to a Kitful workspace
  • create a managed collection from Framer canvas
  • prepare that collection from Framer CMS
  • sync Kitful articles into that collection on demand

Automatic publishing and scheduled background sync are not part of this release yet.

What you need

  • a Framer project
  • access to Framer plugins
  • a Kitful workspace with articles ready to sync

Install the plugin

Until the marketplace listing is approved, use Framer's development plugin flow for internal testing.

Once the marketplace listing is live:

  1. Open the Framer marketplace.
  2. Install the Kitful plugin.
  3. Open the plugin inside your Framer project.

How the Framer flow works

The plugin has two jobs:

  • canvas mode is where you connect a workspace and create a managed collection
  • managed collection mode is where you prepare that collection and run sync

Each managed collection stores its own Kitful workspace link. That means one Framer project can have more than one Kitful-backed collection, and different collections can be linked to different Kitful workspaces.

The plugin also remembers previously connected workspaces locally, so you can switch between saved workspaces quickly when creating another collection.

Connect Framer to Kitful

  1. Open the Kitful plugin in Framer canvas.
  2. Click Connect to Kitful.
  3. Sign in to Kitful if needed.
  4. Choose the workspace you want to connect.
  5. Return to Framer after Kitful confirms the connection.

After the first successful connection, that workspace is saved locally in the Framer plugin environment on your device.

Create a managed collection

  1. Open the plugin in Framer canvas.
  2. Enter a collection name.
  3. Click Create.
  4. If you already connected more than one workspace before, choose the active workspace from the workspace switcher first.

The plugin creates a Framer managed collection and then you can finish setup from Framer CMS.

Prepare the collection

  1. Open the plugin from that managed collection in Framer CMS.
  2. Review the linked workspace.
  3. Click Prepare.

The plugin prepares the managed collection with Kitful's schema and stores the collection's Kitful link in Framer plugin data.

Sync articles

  1. Open the plugin from the managed collection in Framer CMS.
  2. Click Sync Articles.
  3. Wait for sync to finish.

The sync is a full snapshot sync:

  • new Kitful articles are added
  • existing synced articles are updated
  • Kitful articles no longer returned by the sync are removed from the managed collection

What fields are added to the collection

Kitful prepares these fields in the managed collection:

  • Title
  • Excerpt
  • Content
  • Featured Image
  • Meta Title
  • Meta Description
  • Canonical URL
  • Language
  • Created At
  • Updated At
  • Status

Kitful is the source of truth for these fields in this release.

Switching workspaces

If you already authenticated more than one Kitful workspace in the same Framer project:

  1. Open the plugin in canvas mode.
  2. Use the workspace switcher in the create-collection card.
  3. Create the next collection under that workspace.

The switcher only works for workspaces that were already connected on that device. If you want a brand new workspace, use Connect Another Workspace.

Disconnecting a collection

If you want to relink an existing managed collection to another workspace:

  1. Open the plugin from that collection in Framer CMS.
  2. Click Disconnect This Collection.
  3. Switch to the workspace you want, if needed.
  4. Click Prepare again.

This disconnects only that collection. It does not remove your other saved Kitful workspaces from the project.

What gets synced

  • article title
  • excerpt
  • HTML content
  • featured image URL
  • meta title
  • meta description
  • canonical URL
  • language
  • created at
  • updated at
  • article status

Storage and security

The plugin stores:

  • saved workspace connections locally in the Framer plugin environment on your device
  • collection-specific link data inside the managed collection's plugin data

Sensitive connection secrets are not stored in public CMS fields.

Limitations in the current release

  • no auto-publish from Kitful directly into Framer
  • no Autoblog destination support for Framer yet
  • no custom field mapping
  • no sync into arbitrary existing user-managed Framer collections
  • saved workspace switching only works for workspaces already authenticated on that device

Troubleshooting

The plugin asks me to reconnect

  • reconnect if the local saved workspace data was cleared on this device
  • reconnect if the Kitful integration was removed or disabled
  • reconnect if you are trying to use a workspace that was never authenticated in this Framer plugin before

My collection is connected to the wrong workspace

  • open that managed collection in Framer CMS
  • click Disconnect This Collection
  • switch workspace if needed
  • click Prepare again

Sync does not finish

  • reopen the plugin from the managed collection flow and run sync again
  • confirm the linked workspace is the one you expect
  • confirm the Framer integration is still enabled in Integrations inside Kitful

I do not see a public marketplace listing yet

The docs may be live before the Framer marketplace listing is approved. During that period, use the development plugin flow for internal testing only.

On this page