Openli (formerly Legal Monster)

A Webflow site ships with no consent banner, so analytics and ad scripts you add can set cookies on page load. The default Always track visitors setting in Webflow Analyze does not wait for consent either.

Pasting the Openli cookie widget snippet into Footer code puts Openli's consent banner on every page. Openli then scans the site for cookies, and the scripts you tag wait until a visitor accepts. By default, Openli stores the IP address and browser user agent with each consent as evidence. The same legal.js library also adds consent collection to forms and embeds your published policies.

Openli, formerly Legal Monster, now sits in the Cerivo group after Triple acquired Openli. Openli's pricing page lists Privacy Hub plans and no cookie consent plan, while its sign-up flow still opens with a cookie scan. Ask Openli which subscription includes the cookie widget before you build on it.

Agencies and developers who build Webflow sites for EU and Nordic clients get a banner that holds back tagged scripts until a visitor accepts. Marketing ops teams can gate pixels and collect newsletter consent they can later withdraw on request. Data protection officers (DPOs) may already keep vendor records and records of processing activities (RoPA) in Openli's Privacy Hub. A Privacy Badge or a synced sub-processor page puts that work on the Webflow site.

How to integrate Openli (formerly Legal Monster) with Webflow

No Openli or Legal Monster app exists in the Webflow Apps Marketplace, so the cookie widget snippet is the install path. Openli's current install guide says the snippet must go immediately before the closing body tag of your site's main template, and on Webflow that is Footer code. Openli also keeps a Webflow-specific guide under "Legacy integrations" and marks it as no longer actively tested, though it may still work. Its steps match the current guide, so treat it as a legacy reference rather than the main path. The snippet still loads legal.js from widgets.legalmonster.com, and Zapier still lists the app under the Legal Monster name.

Each part of the integration runs through a different route:

• Cookie widget snippet: The legal.js snippet in Footer code shows the banner and releases tagged scripts after consent, with no server of your own.
• Code Embed widgets: The same library renders policy embeds, the Privacy Badge and the signup consent widget inside Webflow pages.
• Zapier: Zapier's Legal Monster app can save a consent from a Webflow form submission or withdraw email-marketing consent.
• APIs: The Webflow Data API and Openli's REST API handle consent webhooks, sub-processor sync and script deployment, and each of those patterns needs a server you host.

Most sites need only the snippet, and the other routes add to it. Custom code requires a Core, Growth, Agency or Freelancer Workspace, or an active Site plan. Openli requires you to remove any existing cookie blocker or banner before the first scan.

Paste the snippet in Footer code

The banner displays once the snippet is live and a cookie policy is published. After you add your domain, Openli scans it on a regular basis and assigns cookies it recognizes to a category, which you should still check. Visitors can then accept or reject analytics and marketing cookies separately.

1. In the Openli dashboard, select the correct project (bottom left), then open Cookies > Manage Domains and add your domain.
2. Wait for the scan, then review the results and categorize any unknown cookies by hand.
3. Create a cookie policy under Agreements and click Publish now!, as Openli's quickstart describes.
4. Open Widgets, select the cookie widget and copy the code.
5. In Webflow, go to Site settings > Custom code > Footer code, paste the snippet and click Save changes.
6. Click Publish. The pasted code initializes the banner with a call like legal.widget({ type: "cookie", widgetPublicKey: "..." }). The loader also exposes window.legal for the methods used in the next sub-sections. Custom code does not run in expand canvas view and is not live until you publish. Check the banner on the published URL rather than inside Webflow. Head code and Footer code each accept 50,000 characters.

Block scripts and embeds until consent

The banner alone does not stop cookies, because any script you leave untagged still runs on page load. Openli's quickstart states that "You must make changes to your HTML to enable blocking". Every analytics or marketing script needs a type change and a category attribute, in site-level and page-level custom code alike. Necessary cookies need no tag and stay enabled.

1. Change the script's type and add a category, for example <script type="text/plain" data-cookieconsent="analytics">, following the blocking cookies reference. Use "marketing" for ad pixels.
2. For YouTube or other iframes, wrap the embed markup in a <script type="text/plain" data-cookieconsent="marketing">. That script writes the iframe into a .legalmonster-embed-container div, as shown in the embedded media guide.
3. For code that needs to react to consent, register listeners before the legal.widget(...) call. For example, use window.addEventListener("legalmonster.cookie.analytics.accepted", handler, { once: true }). The consent state API also exposes window.legal.getCookieConsentState(), which returns { analytics: true|false, marketing: true|false }. Openli's consent events can fire more than once, so handlers that load a script should guard against double execution.

Webflow's own tracking features need separate handling:

• Webflow Analyze and Optimize: Set the tracking default to Don’t track by default, which waits for consent before tracking begins, per the compliance article. Webflow says that option needs a consent management solution.
• Webflow consent APIs: Webflow's consent management APIs apply only to Analyze and Optimize. Inside wf.ready(), an Openli legalmonster.cookie.analytics.accepted listener can call wf.allowUserTracking(), and the matching rejected event can call wf.denyUserTracking(). Openli does not document this pairing.
• Meta Pixel: With Delay for cookie consent on, Webflow's Meta Pixel guide releases the pixel when a script calls fbq('consent', 'grant'). An Openli legalmonster.cookie.marketing.accepted listener can make that call, though Openli does not document it.
• Google Analytics: Openli holds back only scripts you tag, and the Measurement ID field in Site settings adds a Google tag you cannot edit. Webflow's Google Analytics guide says to add the GA4 tag in one place only, so we recommend leaving that field empty and adding the tag to Head code as a tagged script.

Webflow's consent tooling reaches only its own features, so every third-party script depends on the Openli tags you add.

Embed policies and the Privacy Badge with Code Embed

Openli can render your published cookie policy or another agreement inside a Webflow page. A Privacy Badge links to an agreement you pick in Openli, typically your privacy policy. Both go into a Code Embed element on the relevant page, and both must run after the cookie widget snippet has loaded.

1. In Webflow, open the Add panel, drag a Code Embed onto the page and add a container such as <div id="cookie-policy-container"></div> or <div id="privacy-badge"></div>.
2. For a policy, add a script calling legal.document("#cookie-policy-container", "policy-public-key"); with the agreement's public key, per the embed policies guide.
3. For a badge, call legal.widget with type: "privacy-badge-v1", the agreementPublicKey and targetElementSelector: "#privacy-badge", per the Privacy Badge install guide.
4. Save the embed, then click Publish. A Code Embed sits in the page body, so it can run before the Footer code snippet. Wrap the legal.document(...) or badge call in window.addEventListener("load", ...) so it runs after the snippet. Script tags inside a Code Embed show a placeholder on the canvas; check them on the published site. Each embed accepts up to 50,000 characters. If a page should carry the legal text without showing the banner, follow Openli's guide to embedding agreements without a widget. It loads a dummy widget with legal.load(...) before legal.document(...). Every Openli agreement, DPAs included, has its own Public Key, and the embed shows the latest published version.

Add the signup consent widget to Webflow forms

Forms collect names and emails. Openli's signup widget adds consent to an existing form and records it against the visitor's email. For email-marketing consent, Openli's Universal Consent guide says that feature requires an Openli Website Compliance subscription.

1. Give the Webflow form, its email input and its name input stable IDs or classes. The targetElementSelector must match exactly one element.
2. Call legal.widget({ type: "signup", widgetPublicKey, targetElementSelector, nameInputSelector, emailInputSelector }), per the signup consent reference. The target element must sit inside the form. Place the call in page-level custom code (Pages panel > Page settings > Custom code > Before </body> tag) or in a Code Embed below the form, and wrap it in window.addEventListener("load", ...) so the Footer code snippet has run first.
3. Set submitButtonSelectors to restrict which submit buttons Openli watches; by default it watches all of them.
4. Click Publish and submit a test entry, then confirm the consent appears in the Openli dashboard. Openli's reference says to check on your server that the input named openli-consent has the value on, unless you renamed it with validationFieldName. That field should appear in the data object of the form submission payload. Confirm this with a test submission before a webhook handler relies on it. The Universal Consent guide also lets you set a form's audience to business users or consumers. It documents a dashboard webhook for email_marketing_consent_created, which the webhooks section below returns to.

Connect Webflow forms to Openli with Zapier

Zapier still lists Openli under its old name, and its Legal Monster and Webflow pairing page shows two Legal Monster actions. Save Consent to a Document records a consent without the on-page signup widget. It requires a Document and a User Identifier, and its optional fields cover the user's email and name, consent method, consent text, user agent, IP address, language, page URL and form button text. Withdraw Consent to E-Mail Marketing handles opt-outs.

Build one Zap from the Webflow New Form Submission trigger to Save Consent to a Document for signups. Build a second from an unsubscribe form to Withdraw Consent to E-Mail Marketing. Openli's Universal Consent guide takes the other direction, catching Openli's dashboard webhook with Webhooks by Zapier, and it lists a Zapier premium account as a requirement.

Build with the Webflow and Openli APIs

The API route suits teams that need consent events in their own backend, or Openli's vendor data published on the Webflow site automatically. Openli's REST API v1 lives at https://app.openli.com/api/v1/ over HTTPS and authenticates with an x-api-key header, while some public endpoints use project_public_key instead. Every pattern below needs a server or serverless function you host, and four references cover the work:

• Openli REST API: The Openli API reference documents consent withdrawal, services, personal data, sub-processors and webhooks.
• Webflow Data API: Webflow's Data API reads and writes CMS collections and lists form submissions.
• Webflow webhooks: A form_submission webhook sends each Webflow form entry to your server as it arrives.
• Webflow MCP server: An AI agent connected to the Webflow MCP server can manage a site's custom code and registered scripts as well as its CMS items, per the MCP overview.

The three builds below combine these pieces.

Validate Webflow form consent with webhooks

1. A form_submission webhook delivers every Webflow form entry to your server. There you can check the Openli consent field and act on it. Openli's own webhooks then notify you when consent is created or withdrawn, so both directions reach the same handler. Register the Webflow webhook with POST https://api.webflow.com/v2/sites/{site_id}/webhooks and the body {"triggerType": "form_submission", "url": "..."}. It needs the sites:write scope, per the create webhook reference. An optional filter.name restricts it to one form.
2. In your handler, verify the x-webflow-timestamp and x-webflow-signature headers. The signature is a SHA-256 HMAC over timestamp:body, keyed with your site token secret or OAuth client secret. Treat requests older than 5 minutes as possible replays, per working with webhooks.
3. Read name, formId, formElementId, submittedAt and the data object from the form submission event payload. Confirm the Openli consent input is present before writing the contact to your CRM.
4. Register Openli's side with POST /api/v1/webhooks. Pass target_url and a comma-separated events value of consent_created,consent_withdrawn, per the Openli webhooks reference. GET /api/v1/webhooks lists them and DELETE /api/v1/webhooks/:public_key removes one.
5. Handle unsubscribes with POST /api/v1/consents/withdraw_all_email_marketing_consent?email=.... A 200 response means no user was found, and a 204 means consent was withdrawn, per the consents reference. The Universal Consent guide's dashboard webhook uses the event email_marketing_consent_created, while the API reference lists consent_created and consent_withdrawn for webhooks registered through the API. Neither page publishes a payload schema or signing header, so inspect a live delivery before you parse it. Webflow webhook deliveries that fail retry up to 3 more times at 10-minute intervals. Webflow then marks the delivery as failed. For backfills or missed deliveries, use GET /v2/sites/{site_id}/form_submissions. It filters by elementId and pages with offset and a limit of up to 100.

Sync sub-processor lists to a Webflow CMS collection

1. Openli's Privacy Hub holds the vendor and sub-processor records your DPA promises to disclose. The Services API exposes them as JSON. A scheduled job can mirror that data into a Webflow CMS collection. Your privacy page then lists current sub-processors without anyone editing HTML. Openli's webhooks fire only on consent_created and consent_withdrawn, so the job runs on a timer or on demand. Call GET https://app.openli.com/api/v1/services with your x-api-key to receive each service's name and public_key, per the services reference.
2. For each service, call GET /api/v1/services/:service_public_key/subprocessors. The sub-processors reference returns subprocessor_name, subprocessor_description, vendor_name, vendor_address and usage_description. It also returns a data_processing_locations[] array with country_name and country_code. The personal data endpoint adds category, purpose and nature_of_processing if the page should show them.
3. Fetch existing items with GET /v2/collections/{collection_id}/items and diff them against the Openli response.
4. Create new items with POST /v2/collections/{collection_id}/items, where fieldData requires at least name and slug, per the create item reference. Map subprocessor_name to name and derive the slug yourself; no documented field mapping exists.
5. Update changed items with PATCH /v2/collections/{collection_id}/items. Then publish them with POST /v2/collections/{collection_id}/items/publish and an itemIds array, per the publish item reference.
6. Render the collection on the privacy page with a Collection List showing vendor, purpose and processing location. The /items/live variants create or update published items directly. They skip the separate publish call when the page should update immediately. For sites with multiple locales, pass cmsLocaleId on each item to target a locale.

Deploy the widget script with the custom code API

Agencies that run many Webflow sites can apply the Openli snippet to each site by script instead of pasting it by hand. Openli does not document this route. The custom code endpoints accept only OAuth tokens from a Webflow App, not site or Workspace tokens, per Webflow's custom code guide.

1. Register the snippet's JavaScript, without its <script> tags, as one inline script with POST /v2/sites/{site_id}/registered_scripts/inline. The body takes sourceCode, a version and a displayName, and the register inline reference caps inline scripts at 2,000 characters. Openli's snippet, loader and legal.widget(...) call together, fits under that cap. Registering legal.js itself as a hosted script is a weaker option: the hosted script reference requires an integrityHash, and a fixed hash stops the file loading whenever Openli changes widgets.legalmonster.com/v1/legal.js.
2. Apply it with PUT /v2/sites/{site_id}/custom_code, per the upsert custom code reference. Pass the script id in the scripts[] array with a location of footer, its version and any attributes. The call replaces the site's applied scripts, so include every script the site should keep.
3. Publish with POST /v2/sites/{site_id}/publish, which accepts an optional pageId, per the publish reference. API-applied code only takes effect after the publish. The GET /v2/sites/{site_id}/custom_code/blocks endpoint lists what is currently applied. Use it to audit which client sites already carry the Openli snippet.

What you can build with the Openli Webflow integration

These builds combine the snippet, the Code Embed widgets and the APIs on a real Webflow site.

• Consent-gated analytics and pixels: Tag every GA4 and Meta Pixel script on a marketing site with type="text/plain" and a data-cookieconsent category. Set Analyze to Don’t track by default. Write the YouTube hero video iframe only after a marketing accept.
• Newsletter signup with provable consent: Add the Openli signup widget to a footer form. After a test submission confirms that the Openli consent input appears in the form_submission payload, check it before adding the contact to your email tool. Wire withdraw_all_email_marketing_consent to an unsubscribe form.
• Self-updating sub-processor page: Feed a /legal/sub-processors Collection List with a scheduled job using GET /api/v1/services/:service_public_key/subprocessors, so the public list matches the DPA.
• Embedded legal center with a Privacy Badge: Render the cookie and privacy policies on a /legal page with Code Embed elements and legal.document(...). Add a privacy-badge-v1 widget that links to your privacy policy. Publish a new version of an embedded policy in Openli, and the page shows it on the next load.

Read our guide to the Webflow CMS API before you build the sub-processor sync.