Pensil

A Webflow site can pair marketing pages with Webflow CMS content and collect form submissions, but it carries no community layer of its own: no discussion threads and no member-only spaces. Webflow User Accounts were disabled on January 29, 2026, so native member gating is no longer an option either. Community features have to come from outside software.

Pensil closes that gap with an embeddable community platform. Copy a short JavaScript snippet from your Pensil dashboard into a Code Embed element and a community loads inside the page: threaded discussions, live sessions, gamification, and paid courses, all on your own domain.

The setup fits course creators running cohort-based programs and coaches hosting live sessions. Startups building customer communities keep members on-site, and agencies use the white-label option to ship community sites under a client's own domain.

How to integrate Pensil with Webflow

What is Pensil? Pensil is a community platform with discussion forums, group chat and direct messaging, live video sessions with audience QnA, and gamification through karma points and badges. It supports paid courses with gated content, white-label branding on a custom domain, custom-branded mobile apps for Android and iOS, and community analytics. SpatialChat has since published an acquisition announcement for Pensil, and the mobile apps now ship as Pensil by SpatialChat.

Teams pair the two platforms to keep community activity on the same domain as the marketing site. A course creator publishes landing pages in Webflow, then runs cohort discussions and live classes in a Pensil community embedded on that same site. Pensil also markets its community content as SEO optimised, so discussions can pick up search traffic next to your Webflow pages. In our experience the domain question is what usually settles this decision: once community threads live on someone else's subdomain, none of that activity compounds on the site you own.

Three routes exist, and they differ mainly in how much code you own. The Code Embed element places Pensil's snippet on individual Webflow pages without writing code, while custom code in head and body tags loads the same script across every page from Site settings. For deeper work, the Webflow Data API with Pensil's SDKs connects form and order events to community actions, though that route needs server-side development. Start with the Code Embed element and add the API route when you need member provisioning or data sync.

Add the Pensil community with Code Embed elements

The embed route drops a Pensil community into an existing Webflow page with no build step. Pensil's own product page puts the requirement at three lines of copy-pasted code. Custom code does need an active paid Site plan or a qualifying paid Workspace plan, so the free Starter plan on its own will not run the snippet.

Embed on a single page

Use a Code Embed element when the community belongs on one specific page, such as /community or a course dashboard.

To set up the embed:

1. Copy the embed snippet from your Pensil dashboard.
2. In Webflow, open the Add panel and place a Code Embed element where the community should appear.
3. Paste the snippet and save the element.
4. Publish the site so the community loads live.

To edit the code later, double-click the element, or select it and choose Open code editor in the Settings panel. What the embed renders depends on which shape of community you point it at:

• The full community: Embed the whole Pensil community so one page carries every space and event, which suits a dedicated /community route.
• A single section feed: Embed one section instead, which fits a product-updates feed or a single cohort sitting on an otherwise marketing-led page.
• Discussion and chat: Threaded posts and group chat render inside the embed, along with direct messaging between members.
• Live sessions: Scheduled sessions and webinars run in the embed with live QnA, and you can publish the recording afterwards.
• Paid course spaces: Gated course content renders for members who have paid, so checkout and coursework stay on the same domain.

A Code Embed element accepts up to 50,000 characters of client-side code, which a three-line snippet never approaches, so length is rarely the constraint here. Server-side languages and wrapper tags such as <html> or <body> are not accepted. Test the embed across breakpoints before publishing, because community interfaces need real viewport width to stay usable.

Load the script site-wide

If the community script should run on every page, add it to the site's head or body code rather than placing an element.

To add the script site-wide:

1. Go to Site settings > Custom code.
2. Paste the snippet into the Head code or Footer code field.
3. Click Save changes, then publish the site.

For one page only, open Page settings and paste the snippet inside the head or before the closing body tag instead. The same character allowance applies to Site settings and Page settings, and nothing changes on the live site until you publish.

Build with the Webflow Data API and Pensil SDKs

The API route connects Webflow events to community actions, such as creating a Pensil member when someone submits a signup form. It needs server-side development and a direct conversation with Pensil, because Pensil publishes no public REST or webhook reference for custom integrations. The Webflow half of this is fully documented and the Pensil half is not, which is the honest trade you are making.

These are the documented pieces you can build against:

• Webflow Data API v2: Manage sites and Collection Items from the base URL https://api.webflow.com/v2 using OAuth 2.0 bearer authentication.
• Form submission history: The same API returns past entries at GET /v2/sites/{site_id}/forms/{form_id}/submissions with the forms:read scope, which is how you backfill members who signed up before the flow existed.
• Webhooks: Webflow webhooks push events such as form_submission, ecomm_new_order, and collection_item_created to an endpoint you host, capped at 75 registrations per trigger type per site.
• Pensil Web SDK: The Pensil Web SDK ships a React UI kit and a service client, but @pensil-inc/web-sdk sits at a beta version last published in 2022, so treat it as unmaintained until Pensil says otherwise.

Pensil has no native Webflow CMS connection, so nothing reads from or writes to your collections on its own and any sync runs in code you host. Confirm which community actions Pensil will expose to you before you commit engineering time to this route.

Provision community members from Webflow form submissions

A signup form on your Webflow site can feed new members into Pensil through a webhook receiver you host.

To implement the flow:

1. Register a webhook with POST https://api.webflow.com/v2/sites/{site_id}/webhooks, setting triggerType to form_submission and url to your receiver endpoint. Registration needs the sites:write scope.
2. Add the optional filter object to target one specific form, which Webflow supports only for the form_submission trigger.
3. In your receiver, read the member's email from the data object inside the webhook payload, which holds the submitted field values.
4. Create or authenticate the member in Pensil through its SDK or its single sign-on, using the credentials Pensil issues you.

The same pattern extends to purchases: an ecomm_new_order payload carries the buyer's email in customerInfo, so a completed order can grant community access. Since Webflow User Accounts were removed, member login itself runs through Pensil's own authentication, a third-party auth tool such as Memberstack or Outseta, or something you build and host.

What you can build with the Pensil Webflow integration

Pairing Pensil with Webflow keeps community activity and paid courses on your own site instead of routing members into a separate Discord server. These are the patterns that come up most often on sites built this way:

• Educational membership sites: Embed gated course spaces and cohort discussions on a Webflow course site, with live classes running where members already bought access.
• Customer portals: Add a support forum and a product update feed to a SaaS marketing site, so customers ask questions and read announcements on your branded domain.
• Creator communities: Pair a Webflow portfolio with discussion boards and scheduled live sessions, then publish the recordings for members who missed them.
• Professional network sites: Run event scheduling and member discussion inside a Webflow site, with karma points and badges surfacing the people who actually turn up.

Member login is the part most teams now get wrong: pick the authentication layer before you build the community pages, not after, because retrofitting it means re-inviting everyone who already joined. For a worked example of that layer, see how to add Auth0 authentication to a Webflow site.