HTML code element

The HTML code element puts your own HTML into a page, exactly as you write it. Use it for things Aedify has no element for, such as:

• An embed code from another service: a booking widget, a newsletter sign-up form, a social feed, a podcast player.
• A table or a layout you've written in HTML.
• A small script you trust, from a service you use.

It's in the Elements group of the palette. New to the builder? Start with Using the builder.

Adding HTML

1. Drag HTML code onto the canvas, or select a column and click it in the palette.
2. Type or paste your code in the box on the canvas, which reads <p>Your HTML</p> while it's empty. You can also edit it in the element's Settings, in a larger HTML box.
3. Save the page, and open it on your store to see the result.

The element has the usual Style and Advanced settings, so you can add margins, a background or an Anchor ID around your code.

Scripts run on your storefront

Only paste code that you understand, or that comes from a service you trust, from that service's own documentation or dashboard. Be careful with code sent to you by email or chat, or copied from a forum.

A few rules that keep you safe:

• Never paste code that asks you to sign in or enter keys, or that you were told to paste "to fix" something.
• Prefer the service's Shopify app or theme block when it offers one. It's easier to update and to remove.
• Keep a note of what each HTML code element is for, so the next person editing the page knows. A comment works: <!-- Booking widget from Example Co, added May 2026 -->.
• Limit who can use Aedify. Anyone who can open Aedify can add HTML code. In Shopify, staff permissions let you choose which apps each staff member can use.

Scripts don't run in the builder

To keep your admin safe, scripts don't run on the canvas or in Preview. The canvas shows your code's HTML, without what a script would add. To see a widget working, save the page and open it on your store.

When to use another element

HTML code is the last resort, because Aedify can't help with what's inside: the accessibility check doesn't look inside it, and it doesn't follow your theme's styles the way other elements do.

Content made outside Aedify

When you open a page, blog post or description that was made in Shopify's editor or another app, Aedify turns its headings, text, images and videos into elements. Anything it doesn't recognise, such as a form or an embed, goes into an HTML code element, so nothing is lost.

If you'd rather keep the whole page exactly as it was, choose Keep as one HTML block in the notice at the top of the builder. Everything then sits in a single HTML code element. Convert to elements switches back. Nothing changes in Shopify until you save. Using the builder covers the notices.

Troubleshooting

The widget doesn't show on my store. Check that the page is visible and that the code came complete (embed codes often have two parts: one for the page, one for the theme's <head>). The <head> part can't go in a page; add it in your theme, or use the service's Shopify app.

My layout looks broken after adding code. An unclosed tag, such as a <div> without its </div>, can affect everything after it. Check the code in the HTML box, or remove the element and save to confirm it's the cause.

The widget shows twice, or a script runs twice. When the Aedify content block is on the template, your theme still prints its own copy of the page content, hidden. The HTML is then on the page twice, so a script in it can run twice, and IDs in it exist twice. Remove your theme's own Content block from the template if your theme allows it. Otherwise, use the service's option to target a class instead of an ID, if it has one.