Webflow

The Webflow integration pushes Grandranker articles into a CMS collection on your Webflow site. You connect with a site-scoped API token, pick a site and collection from dropdowns, and Grandranker maps article fields to your collection's fields automatically.

How to Connect

1. In Webflow, open your site → Site Settings → Apps & Integrations → API Access and click Generate API token.
2. Under Data scopes, enable all of the following: CMS: read & write, Sites: read, and Authorized User: read. Generate the token and copy it. You can't view it again.
3. In Grandranker, open Integrations → Add New Integration at app.grandranker.com/integrations/create, pick Webflow, and paste the token into API Token.
4. Click Fetch Sites. Your sites load into the Site dropdown. Pick one (if you have exactly one site, it's selected automatically).
5. Click Fetch Collections and pick the CMS Collection you publish to.
6. Review the Field mapping (auto-detected) panel. It shows which collection field receives the article body, summary, featured image, publish date, and author.
7. Click Test Connection to verify, then Save & Connect.

Don't type the Site ID or Collection ID by hand. Webflow uses 24-character hex IDs that aren't visible in the dashboard URL. The dropdowns find them for you.

Publishing & Verifying

Published articles are written as items into your selected collection, using the detected field mapping. If a mapped field doesn't exist in your collection it is silently skipped. The article still publishes with the remaining fields. The default mapping targets the standard Webflow Blog template slugs: post-body, post-summary, main-image, published-date, and author.

To verify, open your Webflow project's CMS panel and confirm the new item appears in the collection with body content and image in the right fields.

Troubleshooting

"Could not fetch sites"

The token is missing a scope or was pasted incompletely. Regenerate a token with CMS: read & write, Sites: read, and Authorized User: read all enabled, and paste the full value.

No CMS collections on the site

If Fetch Collections reports that the site has no CMS collections, Grandranker offers a one-click fix. Click Create Blog Posts collection and it creates a collection pre-configured with the fields Grandranker writes to, selects it, and detects the mapping. No need to leave Grandranker.

Articles publish but some fields are empty

Check the Field mapping (auto-detected) panel on the integration page against your collection's fields in Webflow. If the detection looks wrong, contact support.

Items appear in the CMS but not on the live site

CMS items only appear on your published site once your Webflow site is published. Check whether your collection page template is bound to the collection and republish the site in Webflow.

Questions? Contact us at [email protected].