Before you start
Generate your widget code in the bsport back office: Settings → Widgets, choose the widget type, configure your options, then scroll down and copy the code. Every time you change a setting a new code is generated, and you have to paste the new version onto your site for the change to take effect.
Method 1 — Embed element (recommended)
Open the page in the Webflow Designer
Click the Add panel (+) and find Embed under Components
Drag it onto the page where you want the widget
Paste your widget code into the code editor and click Save & Close
Click Publish
⚠️ The widget will not render in the Designer. Webflow shows a grey placeholder there instead. This is normal — publish the site, or use the preview eye icon, to see the real widget.
Two things worth setting on the Embed element itself:
Give its parent container a width of 100% so the widget has room to be responsive
Leave the height on auto rather than fixing it, so the widget can expand with its content
Method 2 — Page or site custom code
Use this when the same widget should appear on every page, or when you need the script to load before the page renders.
One page: Page Settings (the gear icon next to the page name) → Custom Code → Before </body> tag
Whole site: Project Settings → Custom Code → Footer Code
Site-wide code applies to every published page, so prefer the page-level option unless you genuinely need it everywhere.
Troubleshooting
The widget shows in the published site but not in the Designer.
Expected behaviour. Webflow never executes embedded scripts in the Designer canvas.
Changes made in the back office are not showing.
The configuration does not update automatically on your site. Copy the newly generated code and replace the old one entirely, then republish.
The widget looks different from the back-office preview.
Your site's stylesheet may be affecting it. Enable Compatibility Mode in your widget settings, then copy and paste the new code.
The code editor will not accept the code.
Webflow's Embed element has a 50,000 character limit. The bsport widget code is well under this, so if you hit it, check nothing else has been pasted alongside.
The widget is cut off or cramped.
Check the parent container's width and any max-width set on it, and check the mobile breakpoints separately in the Designer.
Nothing appears at all.
Confirm the site has been published since you added the code — Webflow changes are not live until you publish.
Still stuck? Contact our support team with the page URL and a screenshot, and we'll take a look.


