Overview
Manual transfer of blog content from Notion to Webflow is tedious and error-prone, especially managing slugs and formatting. This workflow automates syncing pages marked for sync, converts Notion blocks into Webflow-ready HTML, guarantees unique slugs, and publishes content as drafts, streamlining your editorial pipeline and cutting repetitive work.
The Impact
- Eliminate manual copy-paste. Sync blog posts directly from Notion to Webflow as drafts.
- Guarantee slug uniqueness. Auto-append suffixes to duplicate slugs to avoid URL conflicts.
- Preserve content formatting. Convert Notion blocks into clean HTML suitable for Webflow CMS.
- Notify teams instantly. Send Slack alerts on sync completion for transparency and tracking.
Who This Is For
- Content Editors who want to publish Notion-written blogs to Webflow without manual hassle.
- Multi-author Teams needing automatic slug conflict resolution in shared Notion databases.
- Web Developers migrating or mirroring Notion content into Webflow CMS collections.
- Marketing Managers seeking streamlined, consistent content workflows across platforms.
How It Works
- Fetch Data
- Retrieve blog pages from Notion and existing items from Webflow CMS for comparison.
- Process Slugs
- Calculate and ensure slug uniqueness by appending suffixes to duplicates before syncing.
- Convert Content
- Extract page fields and convert Notion blocks into clean HTML for Webflow’s rich text fields.
- Sync Decision
- Compare slugs against Webflow items to decide whether to create new or update existing entries.
- Execute Sync & Notify
- Write content to Webflow as drafts, update Notion slugs, and send Slack notifications upon completion.
What You'll Need
Before using this template, make sure you have:
- Notion database with blog posts including title, blocks, cover, sync checkbox, and slug field.
- Webflow CMS collection configured to accept title, slug, rich text content, and cover/thumbnail images.
- Authorized Notion API credentials to access and update the database.
- Authorized Webflow API credentials to read and write CMS collection items.
- Slack credentials and a channel ID for receiving sync completion notifications.
How to Use
- Step 1. Prepare Notion and Webflow
- Step 2. Configure Credentials
- Step 3. Fill Parameters
- Step 4. Trigger Sync
- Step 5. Verify Results
Set up your Notion database and Webflow CMS collection with the required fields and structure.
Provide valid API credentials for Notion, Webflow, and Slack within the workflow settings.
Enter NotionDatabaseId, WebflowCollectionId, and SlackChannelId as per your environment.
Run the workflow to start syncing checked blog posts from Notion to Webflow as drafts.
Check the Webflow CMS for synced drafts and confirm Slack notification for successful sync.