Carrd

Add chatbot embed code to Carrd

Use a Carrd Embed element in hidden body end mode to load the widget on a published page.

Carrd

Before you start

Best for

Simple landing pages, creator pages, waitlists, link pages, product teasers, and small service websites.

Install location

Use Add Element, Embed, Type Code, Hidden style, and Body End location.

Carrd snippet

<script
  src="https://your-domain.com/widget.js"
  data-workspace-id="WORKSPACE_ID"
  data-chatbot-id="CHATBOT_ID"
  defer
></script>

Install

1Copy the widget snippetOpen the chatbot Embed page and copy the complete script.
2Add an Embed elementIn Carrd, add an Embed element and set the embed type to Code.
3Use hidden body endSet the style to Hidden, choose Body End, and paste the full widget snippet.
4Publish and testPublish the Carrd site, open the live URL, and confirm the launcher appears.

Access

Add the custom Carrd domain.

Add the carrd.co URL if the public site uses it.

Allow only the published URL hostnames that visitors can open.

Verify

Carrd custom code embeds require a plan that supports Embed elements.

Hidden Body End avoids creating visible layout space for the script.

The widget will not fully render inside the Carrd builder. Test the published page.

Next doc

Install the widget on custom HTML, server rendered, React, Next.js, Astro, Laravel, Rails, Drupal, Joomla, HubSpot CMS, Duda, or similar sites.