Blocks API

Blocks API exposes pre-built HTML blocks that can be quickly integrated into your shop's user interface.

The most typical way to embed a block is to use an iframe:

<iframe src="https://app.bubblehouse.com/blocks/v2023061/Product4?instance=rewards&auth=...&product=12345" loading="lazy" style="height: 0px; width: 100%; border: none"></iframe>

Resizing

Note that an iframe won't automatically resize based on the content. We recommend that you implement Block Client API Resize1 func, which will be invoked by the blocks whenever the content height changes.

The initial iframe size should probably be specified as a large value like 7000px (depending on how high the page typically is), but other values (like 10vh) might make sense for you as well.

Authentication

Pass a customer token as an auth query param. If no customer is logged in, omit the param or leave the value empty.

Redirects

Bubblehouse needs to be able to redirect to your login/signup endpoints to get the user to log in. And it needs to know the URLs of the rewards page and other key pages, to be able to redirect customers back.

The corresponding paths must be configured on the API settings page.