Framer Integration

Sync Lovarank articles with your Framer CMS. Content appears in your CMS collection, ready to display on your site.

What You'll Need

  • A Framer site with CMS enabled
  • A CMS Collection for blog posts
  • Admin access to your Framer project

How Framer Integration Works

Framer's integration works differently from other platforms. Instead of pushing content directly:

  1. You connect Lovarank to Framer
  2. Content syncs to your Framer CMS collection
  3. You sync from within Framer to pull the latest articles

This approach gives you full control over when content appears on your live site.

Setting Up the Integration

Step 1: Add Framer Integration

  1. Navigate to Integrations in the Lovarank sidebar
  2. Click Create Integration
  3. Select Framer from the options

Step 2: Authorize Access

  1. You'll be redirected to authorize with Framer
  2. Select the project you want to connect
  3. Grant Lovarank access to your CMS

Step 3: Configure Field Mapping

Map Lovarank fields to your Framer CMS:

Lovarank FieldMap To
TitleYour title field
ContentA Rich Text field
Featured ImageAn image field
Meta DescriptionA text field
SlugYour slug field

Setting Up Your Framer CMS

If you don't have a blog collection:

  1. Open your Framer project
  2. Go to CMS in the left panel
  3. Create a new collection (e.g., "Blog Posts")
  4. Add fields for:
    • Title (Text)
    • Content (Rich Text)
    • Featured Image (Image)
    • Meta Description (Text)
    • Slug (Slug)
  5. Connect the collection to your blog template

Publishing to Framer

The process for Framer:

  1. Open any generated article in Lovarank
  2. Scroll to the Integrations section
  3. Find your Framer integration
  4. Click Publish (or Sync)

This sends your article to Framer's CMS.

Syncing in Framer

After publishing from Lovarank:

  1. Open your Framer project
  2. Navigate to your CMS collection
  3. Click the Sync button
  4. New articles appear in your collection
  5. Publish your Framer site to make changes live

Updating Content

To update an existing article:

  1. Edit the article in Lovarank
  2. Save your changes
  3. Click Sync on the Framer integration
  4. In Framer, sync your CMS collection
  5. Republish your Framer site

Troubleshooting

Connection Failed

  • Verify you have admin access to the Framer project
  • Check that CMS is enabled on your Framer plan
  • Try disconnecting and reconnecting

Articles Not Appearing

  • Ensure you've synced in Framer after publishing from Lovarank
  • Check your CMS collection is correctly connected to your template
  • Verify field mapping is complete

Images Missing

  • Confirm your field mapping includes the image field
  • Check the image field type in Framer is "Image"
  • Try re-syncing the CMS collection

Formatting Issues

  • Ensure you're mapping to a Rich Text field
  • Check your Framer template styles blog content correctly

Frequently Asked Questions

Why do I need to sync in Framer? Framer's architecture requires syncing to pull content into your project. This gives you control over when content appears.

Can I publish to multiple Framer projects? Create a separate integration for each project.

Do changes sync automatically? No. You need to sync in Framer to pull updates from Lovarank.

Can I schedule content? You can publish to Lovarank on a schedule, but syncing in Framer must be done manually.

What Framer plan do I need? You need a plan that includes CMS functionality.

Can I edit articles in Framer? Yes, but changes won't sync back to Lovarank. We recommend editing in Lovarank for consistency.

Was this page helpful?