Embed checklists 💻

Getting Started

Embedding a checklist using "Interact List" is a breeze. Once you have styled and saved your checklist, click the "Share/Embed"  button. This will reveal a popover that provides you with two options.

Click the "Copy Snippet"  button to open the modal where you can choose height options.

"Full Height" will render the checklist without a scroll-bar and it will consume as much vertical height as it needs. If you want your checklist to always show as a full list, without requiring the user to scroll vertically, then this is the option you need to select to save you a lot of time 📏.

"Fixed height" allows you to enter how much height you want your embedded checklist to consume (in pixels). If you choose a height smaller than what the checklist needs (vertically) then a vertical scroll-bar will be visible.

Once you've made your selection, click the Copy Snippet button, and the snippet will be added to your clipboard. The snippet is now ready for you to paste into your website.

The code snippet consists of two items:

•  A script, this is mandatory if you want to track checklist progress when embedding. It tackles all the heavy lifting of writing and reading progress from the browsers data storage.

• An iframe that loads your checklist into your own website

** Both pieces of the code snippet are required for the embedded checklist to load correctly, track progress, and size itself accordingly.

Embedding content is not an easy process, so if you require further assistance then please don't hesitate to contact support