# Product Integration (OnPage)

{% hint style="info" %}
No app, API token, or client credentials required. The only installation step is adding the Sizebay embed script to your store theme.
{% endhint %}

### Fields Summary

<table data-header-hidden><thead><tr><th valign="middle"></th><th valign="middle"></th><th valign="middle"></th><th valign="middle"></th></tr></thead><tbody><tr><td valign="middle"><strong>Field</strong></td><td valign="middle"><strong>How It's Read</strong></td><td valign="middle"><strong>HTML Source</strong></td><td valign="middle"><strong>Notes</strong></td></tr><tr><td valign="middle">Product Name</td><td valign="middle">Automatic</td><td valign="middle">page &#x3C;title> / H1</td><td valign="middle">—</td></tr><tr><td valign="middle">Product Image</td><td valign="middle">Automatic</td><td valign="middle">First image rendered</td><td valign="middle">Ensure main image is correct</td></tr><tr><td valign="middle">URL / Permalink</td><td valign="middle">Automatic</td><td valign="middle">Current page URL</td><td valign="middle">URL changes create a new record</td></tr><tr><td valign="middle">Sizes</td><td valign="middle">Automatic</td><td valign="middle">Size selector (HTML)</td><td valign="middle">Must be in initial HTML, not async</td></tr><tr><td valign="middle">Gender</td><td valign="middle">Client input</td><td valign="middle">meta tag / data-attr / breadcrumb</td><td valign="middle">Inform Sizebay team of source</td></tr><tr><td valign="middle">Category</td><td valign="middle">Client input</td><td valign="middle">meta tag / data-attr / breadcrumb</td><td valign="middle">Must be mapped to Sizebay categories</td></tr><tr><td valign="middle">Age Group</td><td valign="middle">Client input</td><td valign="middle">meta tag / data-attr / breadcrumb</td><td valign="middle">Only required if selling kids and products</td></tr></tbody></table>

### Field Notes

1. **Sizes**

The script reads size options from the size selector rendered on the product page. Sizes must be present in the initial HTML response — if loaded asynchronously after page render, they may not be captured.

{% hint style="warning" %}
Confirm with your theme developer that size options are in the initial HTML, not injected via JavaScript after page load.
{% endhint %}

2. **Gender**

No standardized field. Sizebay defaults to unisex. Inform the Sizebay team where gender is exposed in your page HTML.

Common sources:

* Meta tag: \<meta name="gender" content="male" />
* data- attribute: data-gender="male"
* Breadcrumb — if navigation separates male and female sections.

{% hint style="warning" %}
If none of the above applies, share a sample product page URL and the Sizebay team will inspect the HTML to find the best extraction point.
{% endhint %}

3. **Category**

Used to link products to size charts and to segment usage reports. Same extraction approaches as Gender (meta tag, data- attribute, breadcrumb).

All store categories must be mapped to a Sizebay category. Example: "Dresses" → Full Body. Provide your full category list and the team will configure the mappings.

<table data-header-hidden><thead><tr><th valign="middle"></th><th valign="middle"></th></tr></thead><tbody><tr><td valign="middle">Sizebay Category</td><td valign="middle">Common Store Examples</td></tr><tr><td valign="middle">Top</td><td valign="middle">T-shirts, shirts, jackets, blouses, sweaters, hoodies</td></tr><tr><td valign="middle">Bottom</td><td valign="middle">Pants, shorts, skirts, leggings</td></tr><tr><td valign="middle">Full Body</td><td valign="middle">Dresses, jumpsuits, overalls, rompers</td></tr><tr><td valign="middle">Top Underwear</td><td valign="middle">Bras, bralettes, crop tops (underwear)</td></tr><tr><td valign="middle">Bottom Underwear</td><td valign="middle">Briefs, boxers, panties, thongs</td></tr><tr><td valign="middle">Shoe</td><td valign="middle">Sneakers, boots, sandals, heels, flats</td></tr></tbody></table>

{% hint style="danger" %}
Correct mapping directly impacts automated size chart coverage.
{% endhint %}

4. **Age Group**

Defaults to adult. Only required if your store sells children's products. \
\
Common sources:

* Meta tag: \<meta name="age-group" content="kids" />
* data- attribute: data-age-group="adult"
* Breadcrumb — if navigation separates adult and kids sections.

{% hint style="info" %}
Questions? Contact your onboarding manager — we’re happy to help.
{% endhint %}


---

# Agent Instructions: 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:

```
GET https://docs.sizebay.com/size-and-fit-data-integration/product-integration-onpage.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.