Skip to main content
This guide provides a short, structured instruction set for integrating your Claimr widget into a static HTML website.
1

Open your HTML file

Start by opening the HTML file for your website. You should have a basic site structure already in place, including <html>, <head>, and <body> sections, along with any existing content elements.
2

Add a container for the widget

Create an HTML element where your Claimr widget will be embedded. This element will serve as the widget’s container.
  • You can use any suitable HTML element, typically a <div>.
  • Assign a unique id to this container.
Example:
3

Insert the Claimr script

Next, you will add the Claimr embed script into your HTML file.
  1. Go to your Claimr account to copy the embed script for your campaign.
  2. Paste this <script> tag into your HTML file.
Placement options:
  • In the <head> section.
  • At the end of the <body> section, before the closing </body> tag. This is a common practice for library scripts as it allows the page content to load before the script executes.
Ensure the script includes all the necessary data- attributes:
  • src: The URL of the Claimr widget script, https://widgets.claimr.io/claimr.min.js.
  • id: Must be exactly claimr-script. The script reads its settings from the element with this ID.
  • data-organization: Your organization ID.
  • data-campaign: Your campaign ID.
  • data-autoresize: true to resize the container to fit the widget. To turn resizing off, remove the attribute: any value, including false, turns it on.
  • data-container: This ID should match the ID you gave to your container element in the previous step.
Example of the HTML structure with the script and container:

​
Finalize integration

After making these changes:
  • Save your HTML file.
  • Refresh your web page.
The Claimr widget will now be successfully connected and displayed on your site.