Skip to main content

How Do I Connect My Framer Blog

Connect steps

  1. Open Settings -> Integrations -> Framer.
  2. Copy the provided API key and click Connect.
    • If you need the key later, find it in Menu -> Blog Sync Status.
  3. In Framer, install the Jottler Framer plugin.
    • You can install it directly from the Framer marketplace link above.
  4. Framer will prompt you to create a collection. Give the collection a name.
  5. Enter the Jottler API key from step 2 and click Save & Sync.
  6. Create Index and Details pages using the Jottler collection.
  7. Design both the Details and Index pages.
  8. On the Details page, select the Content field layer and apply required CMS styles:
    • Paragraph
    • Headings
    • Link
    • Blockquote
    • Code
    • Spacing
    • Code Block
    • YouTube
    • Image
    • Table
  9. To support table rendering, make sure Table is enabled in CMS Styles.
  10. Finalize your page design, set page routes, and publish changes.

Jottler Framer plugin inside Framer

Can I use the /blog/ route?

If you already have another blog collection using /blog/, use a different route for Jottler content.

This is a Framer platform limitation:

  • Plugins can only manage their own collection connections.
  • You cannot use two CMS collections on the same route.

Use a separate route such as:

  • /insights/
  • /resources/
  • /news/
  • /case-studies/

Common structure examples:

  • /blog/ for your main blog
  • /insights/ for thought leadership
  • /news/ for company updates
  • /resources/ for guides and tutorials