> ## Documentation Index
> Fetch the complete documentation index at: https://help.yuko.so/llms.txt
> Use this file to discover all available pages before exploring further.

# Storefront blocks reference

> Every theme editor piece the app ships, what it renders, and its settings.

All storefront rendering is powered by one required **app embed** plus
optional **app blocks** for manual placement.

## Yuko Extension (app embed) — required

Enabled under **Theme editor → App embeds**. Without it, nothing renders
and offers show the **Not Visible** badge in the Offers list.

| Setting           | Purpose                                                                                                                                                                  |
| ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Mount selector    | CSS selector where widgets auto-mount on product pages — default `form[action*="/cart/add"]` (the add-to-cart form). Change only if your theme uses non-standard markup. |
| Custom JavaScript | Advanced hook for store-specific tweaks — leave empty unless support advises otherwise.                                                                                  |

## App blocks (optional, product templates)

Add these in the theme editor when you want to position a widget
manually instead of relying on auto-mount:

| Block                     | Renders                                               | Settings |
| ------------------------- | ----------------------------------------------------- | -------- |
| **Yuko Discount**         | Quantity breaks, quantity discounts, volume discounts | none     |
| **Yuko Bundle**           | Fixed Bundle, Mix & Match, AI Bundle                  | none     |
| **Yuko Related Products** | Related Products offers                               | none     |
| **Yuko Upsell**           | The Bundle Builder product-page upsell widget         | none     |

In theme-editor preview, blocks print diagnostic messages when they have
nothing to show (offer inactive, widget disabled, product not targeted) —
live shoppers never see these.

## The Bundle Builder page

Build Your Own Box doesn't use a product-page block for its main
experience — the app auto-creates an **Online Store page** per offer and
renders the builder there. See
[Build Your Own Box](/bundles-discounts/offers/bundle-builder).

## Behind the scenes (no setup needed)

Discounts and bundle pricing are applied by Shopify Functions installed
with the app — an automatic discount function ("Yuko Discounts") plus
bundle/cart-transform functions that merge bundle items in the cart.
There are no discount codes, and merchants never configure these
directly.

## Need help?

<CardGroup cols={3}>
  <Card title="Book a call" icon="calendar-days" href="https://cal.com/yukoteam/yuko">
    Schedule a free call with our team for personal setup assistance.
  </Card>

  <Card title="Contact support" icon="comments" href="#crisp-chat">
    Chat with us directly — we're happy to help with any question.
  </Card>

  <Card title="Install Yuko Bundle Builder & Discounts" icon="download" href="https://apps.shopify.com/yuko-bundles-quantity-discount">
    Get [Yuko Bundle Builder & Discounts](https://apps.shopify.com/yuko-bundles-quantity-discount) from the Shopify App Store.
  </Card>
</CardGroup>


## Related topics

- [Message variables reference](/order-limits/customization/message-variables.md)
- [Installation & theme setup](/bundles-discounts/installation.md)
- [FAQ & troubleshooting](/bundles-discounts/troubleshooting.md)
- [Messages & translations](/order-limits/customization/messages-translations.md)
- [Design & themes](/bundles-discounts/customization/design-themes.md)