BuildMyOnlineStore Docs
BMOS buy buttons

Install human checkout and AI Agent Checkout with one snippet.

Use .bmos-buy to render a human Buy Now button, a visible AI Agent Checkout button, and machine-readable product metadata.

Quick Start

Use .bmos-buy for new product pages, landing pages, and product sections.

1. Add the script once per page

<script src="https://app.buildmyonlinestore.com/embed.js"></script>

2. Add a buy button where the product should appear

<div class="bmos-buy"
     data-store="STOREFRONT_UUID"
     data-product-id="PRODUCT_SKU"
     data-mode="human,agent"
     data-design="split"></div>
SKU rule: Use a sellable standalone SKU or child variant SKU for data-product-id. Do not use a parent family SKU as a direct button unless the page has a separate variant selector.

Attributes

Attribute Required Purpose
class="bmos-buy" Yes Marks the element for BMOS auto-rendering.
data-store Yes The BMOS storefront UUID.
data-product-id Yes The sellable product SKU or child variant SKU.
data-mode No human,agent, human, or agent. Defaults to human,agent.
data-design No Visual preset. Defaults to split.

Design Presets

Choose the preset that fits the merchant page. The merchant can also style the surrounding layout with site CSS.

Value Best Use
split Balanced default with human and agent buttons side by side.
stacked Full-width hero sections and landing pages.
compact Dense product grids, sidebars, and tight layouts.
outline Custom branded pages where the button should feel quieter.
pill Rounded, polished CTA style with light shadow.

Prompt for an AI Developer Agent

Merchants can paste this into their coding agent, then replace the storefront ID and product SKUs with values from their BMOS Buttons Manager.

You are helping me add BuildMyOnlineStore buy buttons to my storefront website.

Read the implementation docs first:
https://docs.buildmyonlinestore.com/bmos-buy-buttons/

Use the new BMOS .bmos-buy snippet, not the legacy .bmos-product snippet, for new pages.

Required script, once per page:
<script src="https://app.buildmyonlinestore.com/embed.js"></script>

Button snippet pattern:
<div class="bmos-buy" data-store="STOREFRONT_UUID" data-product-id="PRODUCT_SKU" data-mode="human,agent" data-design="split"></div>

Supported data-design values:
- split
- stacked
- compact
- outline
- pill

Use real sellable product SKUs or child variant SKUs for data-product-id. Do not use parent family SKUs as direct buy buttons unless the page intentionally handles variant selection separately.

Inspect the page design and choose the best data-design value for each placement. Preserve the page styling and layout, add accessible surrounding text where helpful, and verify that the human Buy Now button and AI Agent Checkout button both render.

Verification Checklist