How do I add the support widget to my site without it conflicting with my existing styles or scripts?

Yes — the widget is built so it won't conflict with your existing styles or scripts. It renders inside an isolated Shadow DOM, which acts as a styling boundary: its markup and styles cannot collide with your site's, and it won't inherit or break your own CSS.

Installing it is a single <script> tag. On your dashboard, go to Install -> Embed snippet, click Copy, and paste it just before the closing </body> tag on every page where you want the chat launcher. The snippet is pre-filled with your workspace's public widget key (data-key, always starting with pub_) and board slug (data-board) — copy it exactly, don't retype the key by hand.

<script src="https://deskcrew.io/desk.js" data-key="pub_..." data-board="your-slug"></script>

What keeps it conflict-free:

• Shadow DOM isolation — the widget's CSS can't leak into your page, and your CSS can't break the widget.
• A single script tag loaded asynchronously — it doesn't block your page from rendering.
• A built-in duplicate-load guard (window.DESKCREW) — including the snippet twice does nothing harmful.
• No cookies, no fingerprinting, no reading of your DOM, and nothing runs on your server.

If it isn't appearing or messages won't send, the most common cause is Allowed origins: the page's address must be listed under Dashboard -> Install -> Allowed origins, otherwise the widget won't activate. You can also customize the launcher with optional attributes on the same tag (data-color, data-position, data-greeting).

The full walkthrough — including WordPress (WPCode plugin), Webflow, Shopify, Squarespace, Wix, and React/Next.js — is in the "Add the DeskCrew widget to your website" guide in the help center.