> For the complete documentation index, see [llms.txt](https://docs.maker.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.maker.co/maker-greatstore/developer-reference/javascript-api.md).

# JavaScript API

[Install the chat widget](/maker-greatstore/get-started/install-the-widget.md) before using `window.GreatStore`.

## Methods

| Method                                                 | What it does                                                                                                                                            |
| ------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `GreatStore.open()`                                    | Open the chat panel.                                                                                                                                    |
| `GreatStore.close()`                                   | Close the chat panel.                                                                                                                                   |
| `GreatStore.toggle()`                                  | Open if closed, close if open.                                                                                                                          |
| `GreatStore.sendMessage(text)`                         | Open the panel if needed and send a message as if the shopper typed it.                                                                                 |
| `GreatStore.updateModelContext(text)`                  | Give the assistant the shopper's current page state — product, cart, account — as hidden context for the next message. Replaces any context set before. |
| `GreatStore.on(event, handler)`                        | Listen for panel events. Returns a function that removes the listener.                                                                                  |
| `GreatStore.generateStructuredContent(schema, prompt)` | Ask the assistant for JSON matching a schema you provide. Returns a Promise.                                                                            |
| `GreatStore.ready`                                     | A Promise that resolves once the panel has loaded and is ready to open.                                                                                 |

## Common patterns

{% tabs %}
{% tab title="Open from a button" %}

```html
<button onclick="GreatStore.open()">Chat with us</button>
```

{% endtab %}

{% tab title="Ask on the shopper's behalf" %}

```html
<button onclick="GreatStore.sendMessage('What is your return policy?')">
  Returns &amp; exchanges
</button>
```

{% endtab %}

{% tab title="Open with a product question" %}

```javascript
GreatStore.sendMessage('Tell me more about the Aurora Jacket');
```

{% endtab %}

{% tab title="Reveal a button once ready" %}

```javascript
const chatButton = document.querySelector('#chat-button');
chatButton.hidden = true;

window.GreatStore.ready.then(() => {
  chatButton.hidden = false;
});
```

{% endtab %}
{% endtabs %}

## Passing page context

`updateModelContext` is how the assistant knows what the shopper is looking at without them having to say it. Call it on navigation, and on any change worth knowing about — variant selection, cart updates.

```javascript
GreatStore.updateModelContext(
  'Viewing: Aurora Jacket, size M, $189, in stock. Cart: 1 item, $95.'
);
```

{% hint style="info" %}
Context is **replaced**, not appended. Send the full current state each time rather than a diff.
{% endhint %}

## Generating structured content

Need AI-generated data for your own page — a product blurb, an FAQ block, a comparison table? Pass a JSON Schema and a prompt, and get back JSON matching that shape, generated with knowledge of your store.

```javascript
const data = await GreatStore.generateStructuredContent(
  {
    type: "object",
    properties: {
      headline: { type: "string" },
      bullets: { type: "array", items: { type: "string" } },
    },
    required: ["headline", "bullets"],
  },
  "Write a short promo blurb for our best-selling sneakers.",
);

renderPromo(data.headline, data.bullets);
```

This runs entirely in the background — no chat panel, no shopper conversation. Schema objects exposing a `toJSONSchema()` method are converted automatically.

{% hint style="warning" %}
The promise **rejects** if content can't be generated. Wrap the call in `try`/`catch` and keep a static fallback so the page still renders.
{% endhint %}

## Opening the chat from a link

Add `?gs_chat=open` to any inbound link and the panel opens as soon as the page loads — useful in emails, ads, and "ask us" links.

```html
<a href="https://your-store.com/products/aurora-jacket?gs_chat=open">
  Ask about this product
</a>
```

The parameter is stripped from the URL once the panel opens, so a manual reload won't re-open it.

## What's next?

{% content-ref url="/pages/RTlzI1gcpj96yLG3FUes" %}
[MCP access for agents](/maker-greatstore/developer-reference/mcp-access.md)
{% endcontent-ref %}

{% content-ref url="/pages/qSEQriDDbvfZp4sinBqD" %}
[Security](/maker-greatstore/configure/security.md)
{% endcontent-ref %}


---

# 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 dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.maker.co/maker-greatstore/developer-reference/javascript-api.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.