Skip to main content
Webflow lets you add third-party scripts without touching code, so installing the Sleekplan widget takes just a couple of minutes. You paste your snippet into the project’s custom code area and republish.
First grab your snippet from Settings → Widget and click Copy snippet. See Install the Sleekplan widget for the basics.

​
Add the widget to every page

1

Open your project's custom code

In the Webflow Designer, open Project settings, then go to the Custom code tab. You will see two boxes: Head code and Footer code.
2

Paste the Sleekplan snippet

Paste your snippet into the Footer code box (just before the closing body tag). This keeps it out of the critical rendering path so it does not slow the page down.
<script type="text/javascript">window.$sleek=[];window.SLEEK_PRODUCT_ID=YOUR_PRODUCT_ID;(function(){d=document;s=d.createElement("script");s.src="https://client.sleekplan.com/sdk/e.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();</script>
Adding it here loads the widget on every page of your site. Click Save changes.
3

Publish your site

Custom code only takes effect on the published site, not in the Designer preview. Click Publish and select your domain. Once it is live, open your site and look for the Sleekplan launcher button in the bottom-right corner.
To show the widget on only one page rather than the whole site, open that page’s settings (the gear icon next to the page name), and paste the snippet into the page’s Before </body> tag custom code box instead of the project-wide footer.

​
Custom code plan requirement

Adding custom code to a Webflow site requires a paid Site plan (or a paid Workspace plan). On the free Webflow plan the custom code fields are disabled, so the snippet cannot run. This is a Webflow limitation, not a Sleekplan one.

​
Next steps

Back to install overview

The snippet, user identification, and other platforms.

Customize the widget

Match the launcher and colors to your Webflow site’s branding.