Carrd embeds: which plan allows custom code and what you can embed

Four ways to bring outside content into Carrd

Carrd separates embedded content into a few elements, each with its own plan requirement. Check this table before you buy a plan to run a specific widget or script. [1][2][3][4][5]

Code embeds: inline vs hidden

Carrd's doc says the Code embed accepts "practically anything you'd normally paste into a site's HTML", including style tags with custom CSS and script tags with JavaScript. You add it with Add Element, Embed, then set Type to Code, paste the code, optionally give it a label, and pick a style. [1]

Inline places the code exactly where the element sits on the page, which suits a visible widget such as a booking calendar. Hidden places it in one of three fixed spots: the head, just after the opening body tag, or just before the closing body tag. Hidden embeds suit tracking snippets and scripts that ask to be installed in the head. Because hidden embeds sit outside the layout, Carrd suggests parking them at the end of the site so they stay out of the way. [1]

IFRAME embeds and mobile sizing

The IFRAME type takes a full URL plus optional width and height, and offers three mobile aspect-ratio behaviors. Ignore keeps a fixed height and shrinks the width; Strict scales width and height together; Flexible keeps the proportion but gives the height a little slack. [2]

For a booking or form tool that gives you an iframe link, start with Flexible and check on a phone: Strict can shrink a tall form until the buttons are too small to tap, and Ignore can cut content off at the side. Some sites refuse to be framed by other sites, and Carrd's doc does not cover that, so test the specific tool before relying on it. [2]

Common embeds and their limits

Carrd's analytics setting offers its own cookie-free analytics or built-in connections to third-party tools including Plausible, Fathom, Google Analytics, Matomo and others, so you may not need a code embed for tracking at all. The meta tags doc says default tags take precedence over custom tags with the same name, except a short list such as og:title and viewport. [8][7][4][5]

Avoiding broken third-party scripts

Carrd says the Embed element "will not actually output anything in the builder", so a blank box in the editor is normal and is not a sign the code failed. The only real test is the published site. [1]

• Paste the provider's snippet unchanged; do not retype it from a screenshot.
• Use one embed per script and give each a clear label, so you can switch one off when something breaks.
• Put scripts the provider says belong in the head into a hidden Head embed, not inline.
• Do not load the same library twice (for example two copies of a chat widget); duplicate copies can conflict with each other.
• After publishing, open the browser console on the live page and look for red errors from the embed.

Mobile test checklist

• Open the published URL on a real phone, not only the builder's mobile view.
• Scroll past each embed: nothing should overflow sideways or overlap the next element.
• Complete the embedded action once: book a slot, play the video, open the checkout.
• Rotate the phone and check the IFRAME height still shows the important part.
• Turn on a content blocker or private mode and confirm the page still makes sense if a script is blocked.
• Recheck after any provider update to their snippet, since a changed script affects your live page immediately.

Sources & verification

Product details and prices can change. Check the linked provider before buying.

1. Carrd docs: embedding custom code Accessed 30 Oct 2026
2. Carrd docs: embedding IFRAMEs Accessed 30 Oct 2026
3. Carrd docs: adding widgets Accessed 30 Oct 2026
4. Carrd docs: adding videos Accessed 30 Oct 2026
5. Carrd docs: Pro plans Accessed 30 Oct 2026
6. Carrd docs: Pro features Accessed 30 Oct 2026
7. Carrd docs: adding meta tags Accessed 30 Oct 2026
8. Carrd docs: setting up site analytics Accessed 30 Oct 2026