Framer
Publish SEO-optimized articles to your Framer CMS
Connect your Framer site and publish articles directly to your CMS collection. Smart content formatting automatically converts tables to lists, decodes HTML entities, and cleans unsupported tags for a polished result every time.
Features
Direct CMS Publishing
Articles are pushed directly to your Framer CMS collection automatically. No manual copy-pasting required.
Smart Content Formatting
Tables are converted to lists, HTML entities are decoded, and unsupported tags are cleaned for perfect Framer compatibility.
Auto Site Deploy
Your Framer site is automatically published and deployed after each new article is added.
Field Mapping
Map your title, body, and summary to the exact CMS fields in your Framer collection.
Duplicate Prevention
Existing articles are updated cleanly. No duplicate slugs or duplicate entries in your collection.
SEO Link Injection
Internal and external links are automatically added to your articles to boost search engine rankings.
How to Connect
Open your Framer project
Open the Framer project you want to publish articles to in the Framer editor.
Generate an API key
Go to Site Settings → General → API Keys and generate a new API key. Copy and save it somewhere safe.
Connect in Cited
In your Cited dashboard, go to Integrations and click "Framer". Paste your Project URL and API Key, then click Test Connection.
Select collection and map fields
Choose your blog CMS collection, then map the Title, Body (formattedText), and Summary fields.
Save and verify
Click Save & Continue. Your first article will be published to your Framer collection automatically.
Style your links (one-time setup)
In your Framer editor, go to Assets → Styles and create a Link Style with a distinct color (e.g. blue) and underline. Select the text component on your blog detail page and apply the Link Style. This ensures all links in your articles are visible and clickable for readers.
Requirements
- A Framer site with at least one CMS collection
- A CMS collection with a formattedText field for article body
- An API key from Site Settings
- A text component on your blog detail page connected to the CMS body field
Style Your Blog
One-time setup to make your published articles look polished and professional.
Style your links
Go to Assets → Styles, create a Link Style with a visible color (blue) and underline, apply it to your blog text component.
Set content width
Select your blog text component and set max-width to 680–720px, centered. This keeps lines at a readable length.
Style your headings
In your blog detail page, style H2 (24–28px, bold) and H3 (20–22px, semi-bold) with spacing above (32px) and below (16px).
Set body text size
Set body text to 16–18px with 1.6–1.75 line height and a neutral dark color for comfortable reading.
Size your images
Set images to 100% width of the content area with rounded corners (8px) and some vertical margin (24px).
Ready to connect Framer?
Start publishing AI-generated content to your site in minutes.
Analyze My Site