Widget overview
How the Feedjolt widget works: one async script tag mounts a launcher and lazy-loads a sandboxed iframe on click. Install, what loads, and page isolation.
The widget is a single <script> tag on your page that fetches a small config from your workspace, mounts a launcher button, and lazy-loads an iframe when the user clicks. Until clicked, zero iframe overhead.
Install
<script async src="https://www.feedjolt.com/widget-loader.js"
data-workspace="YOUR_WORKSPACE_SLUG"></script>That's the minimum. Reload the page; you'll see a floating button.
Apply with a coding agent
- Save appearance at Dashboard -> Developers -> Widget.
- Copy the prompt in the right column.
- Paste it into your coding agent so it can add the script to your app.
Manual install steps stay collapsed under Do it yourself.
What gets loaded
widget-loader.js- ~5 KB. Reads yourdata-*attributes, fetches/api/widget/embed/{workspace}/config, mounts a launcher.- The iframe - only loads when the user clicks the launcher. Hosted at
https://www.feedjolt.com/{locale}/portal/{workspace}?mode=widget&.... Until clicked, no iframe load. - Cross-frame
postMessage- used by the iframe to ask the parent to close or resize. No third-party trackers.
How it isolates from your page
The widget runs in an <iframe>, so its CSS, fonts, and JS are sandboxed from yours. Your styles can't break the widget; the widget can't reach into your DOM.
That also means deep style customisation is limited. The launcher button's colour and position come from your per-workspace settings; the iframe's content is themed by the same palette.
Where to next
- Configuration - the five
data-*attributes and the per-workspace dashboard settings. - Customization - what you can tweak today.
- CSP - Content Security Policy directives the widget needs.