1. Home
  2. Sell tickets on your website
  3. Squarespace
5,000+ organizers trust Hi.Events

Sell tickets on Squarespace
One Code block. No extension.

Squarespace has no built-in ticketing, but it does have a Code block. Paste the Hi.Events widget into one and sell tickets from any page, with checkout opening in a modal over it. Works on the plans that allow JavaScript in Code blocks.

Create your event freeJump to the steps →

Two snippets, one Code block, live the moment you save.

§ 01 · Before you start

What you need

Nothing to install on Squarespace. The widget is two snippets of HTML that Hi.Events generates for you.

  • A Hi.Events event, published, with at least one ticket type on sale
  • Edit access to the Squarespace page
  • A Squarespace plan that allows JavaScript in Code blocks (see below)

Which Squarespace plans can run the widget

Squarespace states that adding JavaScript to Code blocks is available on the Core, Plus, Advanced, Business, Commerce Basic and Commerce Advanced plans. Code injection into the site head is available on Core, Plus, Advanced and some legacy plans. On other plans, link a button to your event page instead.

§ 02 · Steps

How to sell tickets on Squarespace

5 steps, with the exact menu path in Squarespace for each one.

  1. Copy the two snippets from Hi.Events

    Open your event in Hi.Events and click Widget Embed under Integrations. Pick your colors, then copy the Embed Script and the Embed Code. They already contain your event ID.

    Hi.Events > Your event > Integrations > Widget Embed

  2. Add a Code block where tickets should appear

    Edit the page. Hover over the section, click Add block or the + icon, and choose Code from the block menu.

    Edit page > Add block (+) > Code

  3. Paste the Embed Code into the block

    Leave the block set to HTML, clear the placeholder and paste the div snippet. Click outside the block to close it.

  4. Add the Embed Script to your site header

    Open the Code Injection panel in Settings and paste the one-line script into Header. Squarespace injects it into the head of every page. If your plan has Code blocks but not code injection, paste the script into the same Code block above the div; it waits for the page to load before it looks for the widget.

    Settings > Code Injection > Header

  5. Save, then check it logged out

    Squarespace sometimes hides embedded code while you are logged in, even though visitors can see it. Use Preview in Safe Mode, or open the page in a private window, and run a test checkout.

§ 03 · The snippets

The two snippets, and where they go on Squarespace

The Widget Embed page in Hi.Events generates both with your event ID and colors filled in. This is what they look like.

Snippet 1 · Embed Script

Goes in the Header field of the Code Injection panel, so it loads on every page. It can also sit in the same Code block above the div.

<script async src="https://app.hi.events/widget.js"></script>
Snippet 2 · Embed Code

Goes in the Code block, exactly where you want the tickets to show on the page.

<div class="hievents-widget"
data-hievents-id="123"
data-hievents-primary-color="#7b5db8"
data-hievents-background-color="#ffffff">
</div>

123 is a placeholder. Open your event, click Widget Embed under Integrations, and copy the generated snippets: they carry your real event ID and the colors you pick there. The full list of attributes is in the widget docs.

§ 04 · What to expect

What happens once it is live

Checkout opens over your page

When a buyer clicks continue, checkout opens in a full-screen modal on top of your Squarespace page. They never leave your site. To send them to a new tab instead, add data-hievents-checkout="new-tab" to the div.

The block grows to fit

The widget auto-resizes as ticket types expand and collapse, so you do not set a height on the Code block. Prices and availability update on their own; the embed code never needs re-copying for that.

Colors come from the snippet

Button, background and text colors are the data attributes in the div, so the widget matches your Squarespace template without custom CSS. Change them in the block, or copy a fresh snippet from Widget Embed.

If you cannot run scripts on Squarespace

If your Squarespace plan does not allow JavaScript in Code blocks, add a Button block and link it to your Hi.Events event page. Buyers get the same checkout on app.hi.events, in your colors from the Homepage Designer. How the Homepage Designer works

§ 05 · The widget

What the widget sells on your Squarespace page

Whatever you set up in Hi.Events shows in the widget. There is no cut-down embed version.

Paid, free, donation and tiered tickets
Add-ons, sold with a ticket or on their own
Promo codes, including hidden tickets they unlock
Registration questions per ticket type
Tax and fees inside the price or added at checkout
Ticket by email, with a link to the QR code
Checkout in the visitor's own language
Sale windows, capacity and per-order limits
Card, Apple Pay and Google Pay through your Stripe account
§ 06 · FAQ

Selling tickets on Squarespace: questions

Can I sell tickets on Squarespace without a Squarespace extension?
Yes. The Hi.Events widget is two snippets of HTML in a Code block, which is a standard Squarespace block. There is no extension to connect and nothing that touches your Squarespace Commerce settings. Tickets, orders, payments and check-in live in Hi.Events.
Which Squarespace plans allow the widget?
Squarespace says JavaScript in Code blocks is available on the Core, Plus, Advanced, Business, Commerce Basic and Commerce Advanced plans. Code injection into the site head is available on Core, Plus, Advanced and some legacy plans. Check your plan in Settings if you are not sure.
Why can I not see the widget while I am logged in?
Squarespace says that, as a security measure, embedded code sometimes does not appear while you are logged in, even though visitors can see it. Click Preview in Safe Mode, or open the page in a private browser window.
Does the widget slow down my Squarespace site?
The Embed Script loads with the async attribute, so the browser fetches it alongside your page instead of waiting for it. The widget renders inside the Code block once the page is ready.
Can I put the widget on more than one page?
Yes. Add a Code block with the Embed Code on each page. With the Embed Script in the Header field of code injection it loads on every page, so you only add it once.
Does Squarespace take a cut of ticket sales?
No. Payments go through your own Stripe account, connected to Hi.Events, not through Squarespace Commerce. Free tickets are free. Paid tickets carry the Hi.Events platform fee of 1.25% plus a small fixed amount per ticket, which you can pass to the buyer, and Stripe's standard card rate.See pricing →
§ 07 · More

The same widget on other builders

Docs and guides

Put tickets on your Squarespace site today

Create your event, open Widget Embed, paste two snippets. No credit card, no sales call.

Get started free

Free events cost nothing. Paid tickets are 1.25% + $0.60, with no monthly fee and no contract — see the full pricing.