Embed your booking page

Visitors can fill in your form and choose a time without leaving your website.

Copy the code from Scheduler

1. Open Scheduler and find your scheduler.
2. Open Embed and choose your website platform.
3. Copy the code into your site's custom HTML or embed block, where you want the scheduler to appear.
4. Publish the page and check it on desktop and mobile.

Install the code once per scheduler. Do not add a second embed or a separate loading placeholder over it.

For a plain HTML site:

<div
  data-aura-scheduler
  data-url="https://app.aura-app.ai/your-org/your-link"
  data-mode="inline"
></div>
<script src="https://app.aura-app.ai/embed/aura.js" async></script>

Use the booking URL from Scheduler. A /b/ confirmation link shows an existing booking; it is not the URL for taking new bookings.

For React, Framer, Webflow, GoHighLevel or WordPress, use the matching code in the Embed dialog. Copy Code at the top of the dialog copies the same code as the Code tab. The code carries the dialog's light or dark choice and, if you pick one under Attribute to, the setter who gets credit for the bookings.

Some builders only run custom scripts on the published site. If the script does not run, visitors see a Book a time link to your booking page instead of the scheduler, so no booking is lost. To show the scheduler itself, use the builder's supported custom-code area or the iframe (for builders that block scripts) option.

Size and layout

Your organization chooses Classic or Scheduler 2.0 in Aura. The same embed code works for both, and each one sizes itself to suit its layout:

If you switch between Classic and Scheduler 2.0 later, you do not need to change the code on your site.

Avoid extra height limits or clipping on the surrounding container, whichever scheduler you use.

To set your own height, add data-height="820" to the scheduler div. Aura keeps that height for both schedulers and reduces it on shorter screens. With Classic, a set height means visitors scroll inside the frame to reach the end of the form. Use data-height="auto" if you want the frame to always grow with the form instead.

The iframe (for builders that block scripts) option grows with the form wherever the script runs. Where it does not, the scheduler shows at a fixed height and visitors scroll inside it. Do not apply these settings to it.

With the iframe (for builders that block scripts) option, if a sticky header covers the form after it scrolls into view, your developer can set data-aura-scroll-offset="80" on the iframe. Change 80 to the space your header needs, in pixels.

More than one scheduler on a page

You can place several schedulers on one page. Each one sizes itself, even while another one scrolls your page to bring its calendar into view. If two ask to scroll at once, the most recent one wins.

A page can also carry code installed before the Embed dialog moved to embed/aura.js, which loads aura-embed.js, for example a booking confirmation in your site's footer. Each scheduler is run by one script only, so it loads once. A booking made in one scheduler still appears in a booking confirmation on the same page. Keep the aura-embed.js line on every page that still has that older code, and remove it once none is left.

Open the scheduler in a popup

To open the scheduler over your page from your own link or button, add two attributes to it and include the script once on the page:

<a
  href="https://app.aura-app.ai/your-org/your-link"
  data-aura-scheduler
  data-mode="popup"
>Book a call</a>
<script src="https://app.aura-app.ai/embed/aura.js" async></script>

For a button, add your booking URL as data-url:

<button
  type="button"
  data-aura-scheduler
  data-url="https://app.aura-app.ai/your-org/your-link"
  data-mode="popup"
>Book a call</button>

• Visitors close the popup with its Close button, the Escape key, or a click outside it. What they typed is still there when they open it again.
• While the popup is open, the Tab key stays inside it. When it closes, keyboard and screen reader users are back on your link or button.
• Use a link where you can. If the script can't load, the link still opens your booking page. A button does nothing until the script has loaded.
• If your site's security settings stop the scheduler from showing, visitors go to your booking page instead. If your developer sets a Content Security Policy, allow https://app.aura-app.ai in both script-src and frame-src so the popup can open and show the scheduler.
• Put the attributes on the link or button itself. On an empty div, or on a section that holds other content, nothing opens.

Ad tracking and cookie banners

The installation code adds the scheduler. It does not automatically connect your site's cookie banner to Aura.

If you use ad tracking, ask the person who manages your website to connect the visitor's advertising choice. A consent-management platform, or CMP, is the tool behind many cookie banners. Aura supports Cookiebot, OneTrust, Didomi and a custom connection for other tools.

Visitors can book without agreeing to ad tracking. Loading a Meta pixel on the landing page does not tell Aura that the visitor agreed. Booking terms and SMS permission are separate choices.

Whatever the visitor chooses, Aura records where they came from: the address of your page and the campaign details in it. Their choice decides whether ad cookies are used and whether Aura shares the booking with your ad partners, such as Meta or Hyros.

Aura saves advertising permission separately from the booking itself. If Aura cannot save the advertising choice, ad tracking stays off while the visitor can continue booking. Essential booking features do not depend on advertising permission.

Cookiebot, OneTrust or Didomi

Your developer can initialize the scheduler with a CMP option after the loader is ready. Use an ordinary div for a manual installation, without data-aura-scheduler, to avoid initializing it twice.

<div id="scheduler"></div>

window.AuraScheduler.init({
  element: "#scheduler",
  url: "https://app.aura-app.ai/your-org/your-link",
  cmp: { provider: "cookiebot" },
});

Wait for window.__AURA_SCHEDULER_READY__ === true or the aura:scheduler:loader-ready event before calling init.

Do not copy category or partner IDs from another website. TCF or GPP signals alone do not give Aura advertising permission.

Another tool or a custom banner

Use advertisingConsentResolver to read the current choice and forward changes:

window.AuraScheduler.init({
  element: "#scheduler",
  url: "https://app.aura-app.ai/your-org/your-link",
  advertisingConsentResolver: {
    resolve: readAdvertisingDecision,
    subscribe: subscribeToAdvertisingDecision,
  },
});

Your developer implements these two functions against your site's consent tool. resolve() returns a decision in this format. subscribe(callback) sends later decisions to the callback and returns a function that stops listening.

{
  status: "unknown",
  source: "configuration",
  decidedAt: null,
  evidence: { provider: "configuration", settled: false }
}

Return unknown until the visitor has made a choice covering the integration. A recorded choice uses granted or denied, its ISO timestamp in decidedAt, and settled: true. Do not set granted for everyone or infer permission from continuing the booking.

Aura keeps a private withdrawal key in the browser's session storage so a visitor can change a saved advertising choice, including after reloading the same tab. If that browser storage is unavailable, advertising tracking stays off. The booking form remains available.

No cookie banner yet

The scheduler's advertising choice applies to its booking flow, not your whole website. Have your website team choose a consent tool for tracking elsewhere on the page. Your privacy notice should explain the data you share and the partners that receive it.

Aura's connection does not manage pixels or other tracking scripts that your landing page loads independently. The advertising resolver also does not configure analytics or dataLayer events.

Hyros browser tracking

Aura does not load Hyros's browser script in the scheduler while we verify that it stops after a visitor withdraws permission. Eligible server-side Hyros events can still be sent when advertising tracking is allowed. This does not disable a Hyros script installed separately on your website, and server delivery alone does not guarantee that Hyros can match a booking to an ad.

An ads-only choice

If ad measurement is your only optional tracking purpose, use one choice: "Allow cookies and data sharing to measure ads?" Give Accept and Reject equal prominence. Both choices must let the visitor continue booking.

Keep a Privacy link available before and after the choice. Explain which contact details and booking activity you share, name the advertising partners, link your privacy policy, and let visitors change their choice. Do not treat opening or closing that information as acceptance.

In Aura, open Settings → Branding → Privacy & consent and set your Privacy policy URL to your business's HTTPS policy page. The scheduler uses this link for its advertising choice. If you leave it blank, the link opens Aura's policy, not a policy describing your business's use of advertising data.

Do not call ad measurement essential to booking. Do not use this choice to enable analytics or other purposes. Aura's optional dataLayer integration requires a separate analytics choice if you enable it. The scheduler's choice does not install a website-wide consent tool or automatically connect an existing one.

Pre-fill fields and pass campaign details

Use the Pre-populate tab in the Embed dialog for supported fields and examples. Use UTM tracking for campaign labels. Do not put sensitive information into public URLs.

Campaign parameters identify where a visitor came from. They do not supply advertising permission or guarantee that Meta will attribute a booking to an ad.

Pass your own tracking value

If another tool gives each visitor an ID, you can send that ID through the scheduler and read it back when the call is booked. That is how you match a booking to the ad or checkout that produced it.

There are three ways, and you only need one.

Your page's own web address. Anything after the ? on your page is passed to the scheduler. A visitor who lands on yoursite.com/book?sub_id=abc123 books with sub_id attached. The booking also keeps the full address of the page they booked from.

Both installation options pass on everything, with two exceptions. Values that look like a password, a key or a sign-in code, such as the code in a password-reset link, stay on your page and are left out of the saved page address too. So do the few settings the scheduler sets for itself, such as which page it is on. The browser console lists the names it left out. To send one of those anyway, add it to the scheduler's web address in the code you copied.

The scheduler's address. Add it to the url you install the scheduler with. Useful when the value comes from your own code rather than the address bar:

<script>
  AuraScheduler.init({
    url: "https://app.aura-app.ai/your-org/your-link?sub_id=" + visitorId,
    element: "#aura-scheduler",
  });
</script>

A cookie, read for you. If you use Whop, Aura reads the _wuid cookie from your page and sends it as am_wuid on its own, when the visitor allows advertising. Nothing to add.

You then read the value back under attribution on the booking, in your webhooks, the API, Zapier, or as a HubSpot field. Booking events keep what the link carried at the time, so editing the lead later does not change it.

Two things to know:

• Values in your page's address are kept whatever the visitor chooses. Cookies are different: Aura reads Meta's and Whop's cookies only when the visitor allows advertising. am_wuid follows the cookie's rule even when you put it in the address, because it is the same value. Declining also stops Aura sending the booking to your ad partners, such as Meta or Hyros.
• Whatever you pass comes back to you. Do not put anything in your schedulers that you would not want in the systems your webhooks feed.

Test before sending traffic

• Open the published HTTPS page on desktop and mobile. Check that the form and booking button are reachable.
• Test before making a consent choice, after accepting, and after rejecting. Check that booking still works when tracking is declined.
• Reload the page in the same tab after accepting, then reject and confirm that Aura reports the changed preference as saved. If the browser blocks session storage, confirm that booking still works and advertising remains off.
• Have your developer check that later preference changes reach Aura. A changed banner alone does not prove that saved or queued events were updated.
• Check Aura's tracking details for the booking. If you use Meta Test Events, confirm the expected events there too. A working browser pixel does not prove that Aura sent the server event.

If the scheduler does not load, check that your site permits https://app.aura-app.ai in its script, frame and connection security rules. Ask your developer to check the browser console and window.__AURA_SCHEDULER_READY__. Website-builder previews, blocked scripts and cached pages can differ from the published page.

For booking-page appearance, see Branding. For extra form fields, see Custom questions.