> For the complete documentation index, see [llms.txt](https://docs.elitebundleapp.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.elitebundleapp.com/developer-sdk/getting-started.md).

# Getting started with the SDK

Enable SDK access in Elite Bundle Builder, wait for the elite:byob:ready event, and read your first bundle state from window\.eliteBundle.sdk.byob.

## 1. Enable SDK access

SDK access is off by default.

{% stepper %}
{% step %}
Open the Elite Bundle Builder app in your Shopify admin.
{% endstep %}

{% step %}
Go to **Settings → Developer SDK**.
{% endstep %}

{% step %}
Click **Enable SDK access**, enter your developer email, and confirm.
{% endstep %}
{% endstepper %}

The SDK is immediately active. The team may also reach out with setup guidance.

## 2. Verify the global is present

Open any bundle product page in your browser, open DevTools, and run:

```js
window.eliteBundle
```

You should see an object like:

```js
{
  version: "1.0.0",
  app: {
    shopDomain: "your-store.myshopify.com",
    moneyFormat: "${{amount}}",
    currencyCode: "USD",
    currencyRate: 1,
    countryCode: "US",
    locale: "en",
    storefrontAccessToken: "...",
    sdkEnabled: true
    // plus internal setup fields
  },
  byob: { bundleConfig: {...}, shopifyVariantId: 123, productId: "789" },
  sdk: {
    byob: { steps: [...], cart: [...], addToCart: fn, selectOne: fn, checkout: fn, ... }
  },
  on: fn,
  off: fn
}
```

`byob` holds the bundle on this page whichever type it is — build-your-own or multi-option. Both use the same `sdk.byob`.

{% hint style="info" %}
`sdk` is only present when `sdkEnabled` is `true`. If it is missing, either SDK access has not been enabled in the app settings, or the deferred bundle script has not run yet. See step 4.
{% endhint %}

## 3. Wait for the ready event

`sdk.byob` is populated once the bundle has fetched its products and rendered. Wait for the ready event before reading it:

```js
document.addEventListener('elite:byob:ready', (event) => {
  const { steps, formatPrice } = window.eliteBundle.sdk.byob;
  console.log(`Bundle loaded with ${steps.length} steps`);
  steps.forEach(step => {
    console.log(step.products.map(p => p.title));
  });
});
```

A multi-option bundle fires the same event; its options arrive as `steps`.

## 4. Check if the SDK is available

{% hint style="warning" %}
`window.eliteBundle` is written by the theme app embed in `<head>`, but `sdk` is added later by the deferred bundle script. **Do not gate on `sdk` existing.** Theme code that runs early would bail out permanently even on stores where the SDK is enabled. Listen on `document` and check the SDK inside the handler.
{% endhint %}

```js
function onBundleReady(callback) {
  const ready = () => {
    const sdk = window.eliteBundle?.sdk?.byob;
    if (sdk) callback(sdk);   // absent means SDK access is off
  };

  // Handle the event having already fired before your script ran
  const sdk = window.eliteBundle?.sdk?.byob;
  if (sdk && !sdk.isLoading && !sdk.error) ready();
  else document.addEventListener('elite:byob:ready', ready, { once: true });
}

onBundleReady((sdk) => {
  console.log(sdk.steps.length);
});
```

## 5. Read shop and bundle basics

`app` is written by the theme app embed, so it is available synchronously:

```js
const { moneyFormat, currencyCode, locale, storefrontAccessToken } = window.eliteBundle.app;
```

So is `byob` — but only on a page that actually has a bundle, so guard it:

```js
const bundle = window.eliteBundle.byob;
if (bundle) console.log(bundle.productId);   // Shopify product ID
```

Its `bundleConfig` is an internal encoded form and is not a public API. For anything you want to read or render, use `sdk.byob` — see the [Bundle SDK](/reference/sdk.md).


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.elitebundleapp.com/developer-sdk/getting-started.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
