This section lets you add custom styling (CSS) and custom behavior (JavaScript) for the widget.Custom CSS#
What it’s for#
Use CSS to adjust widget spacing, fonts, borders, or visibility of specific elements.Where to write it#
Recommended approach#
Target widget-specific classes to avoid affecting your whole site
Start small, change one rule at a time, and verify in preview
Example (safe starting point):Custom JavaScript#
What it’s for#
Use JavaScript to extend widget behavior or connect it to other scripts on your site.Where to write it#
Custom JavaScript → JS Code
The editor includes an example pattern like:Best practices#
Avoid blocking operations (large loops, heavy DOM scans)
Test in a staging site if possible
Steps#
1.
Open Advanced Settings → Custom CSS and JS
2.
Add your CSS rules in CSS Code
3.
Add your JS logic in JS Code
Verify#
Confirm visual changes reflect in the widget preview
If using JS, trigger the behavior you added (for example, send a message if you’re listening to message events)
Troubleshooting#
Remove the latest CSS block you added
Re-add changes gradually and test after each save
Remove recent JS changes and retest
Avoid frequent timers and heavy event handlers
CSS changes don’t reflect#
Hard refresh the page where the widget loads
Modified at 2026-02-19 09:49:50