Adding Seline to your Webflow site

Adding Seline to Webflow is as easy as copying and pasting our script into your project's custom code settings. Works on all pricing plans, including Starter.

<script src="https://cdn.seline.so/seline.js" data-token="PROJECT_TOKEN" async></script>

1. Copy the code snippet provided above.
2. Open your Webflow project and navigate to Site settings, then select Custom code.
3. Paste the copied code into the Head code section.
4. Update the data-token with your project token, which you can find in the general settings at Seline.
5. Click save, and publish your project.

That's it! Now visit your website, click around a bit, and you should see the events appearing at your Seline dashboard.

Custom events

There are two ways you can track custom events with Seline at Webflow.

If you know what you're doing and need some advanced tracking logic, such as tracking onScroll events or other custom events, you can use our seline.track('event name') function at the Footer code of your project's Custom code section or Before </body> tag at your specific pages' settings.

But the simplest way to track buttons, inputs, forms, or other elements clicks is by using html data attributes. We suggest looking at our custom events documentation first to understand how it works.

In the example below, we will add a data-sln-event="button: clicked" attribute to a button element. But the same approach applies to any other element you want to track.

Adding Seline data attributes to Webflow elements

1. Head to your Webflow project and click on a button or any other element you wish to track.

2. On the right side, select Settings and then scroll down to Custom attributes.

3. Add a new attribute with the name data-sln-event and value button: clicked.

Explaining this:

• We're adding a data-sln-event="button: clicked" attribute to selected button, this could be done with any element.
• The part button: clicked is an event name, and you should replace it with any other event name you want to track.
• You can also add additional data attributes like data-sln-event-amount or data-sln-event-period to your elements. amount or period are just examples, you can use any other data attribute you need.

4. Save your changes and publish your project.

Now Seline will automatically track any clicks on the button with data-sln-event="button: clicked" attribute, and you will see these events at your dashboard.