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

# Store

> The public storefront where customers browse a creator's products, view product details, and pay.

Every creator gets a public **store page** at `<workspace>.boble.io/store` (e.g. [rgaconsulting.dev.boble.io/store](https://rgaconsulting.dev.boble.io/store)). It is reached from the **Store** item in the admin sidebar, or via the **View store page** buttons across the admin panel. This is the client-facing platform: it showcases the creator's **public** products, with detail pages and built-in payment.

<Frame>
  <img src="https://mintcdn.com/boble-90b7fb3f/sTKAfAlwSEgu-Dr1/images/store/home.png?fit=max&auto=format&n=sTKAfAlwSEgu-Dr1&q=85&s=4ed44b1b9fb7b6584961050c12c45218" alt="Boble public storefront" width="1512" height="805" data-path="images/store/home.png" />
</Frame>

## Page structure

### Header

* **Logo and business name** — configured in Settings → Branding.
* **Search** — find a product in the store.
* **Account** — customer sign-in.
* **Cart** — current order.

### Hero

The headline and subtitle come from **Settings → Branding → Store Front** (Title and Description).

### Category filters

The product grid can be filtered by type: **All products**, **Bundles**, **Assets**, **Software**, **Video Courses**, **Coaching**, **Services**. Only products whose store status is **Public** appear here.

### Product cards

<Frame>
  <img src="https://mintcdn.com/boble-90b7fb3f/sTKAfAlwSEgu-Dr1/images/store/grid.png?fit=max&auto=format&n=sTKAfAlwSEgu-Dr1&q=85&s=ba9f9b8e8507a9776466fef5de8d2d8f" alt="Storefront product grid" width="1512" height="805" data-path="images/store/grid.png" />
</Frame>

Each card shows:

* A **category badge** (e.g. Coaching Session, Design Asset, Software, Video Course, Bundle, Service)
* The **cover image**
* The **title** and a short **description**
* The **price**, which adapts to the pricing model:
  * `Free`
  * One-time price (e.g. `US$71.99`)
  * Subscription (e.g. `US$95.00/mo`)
  * Discounted price with the original struck through and a **SAVE n%** badge
  * Any currency configured by the creator (US$, €, A$, F CFA, …)

### Footer

<Frame>
  <img src="https://mintcdn.com/boble-90b7fb3f/sTKAfAlwSEgu-Dr1/images/store/footer.png?fit=max&auto=format&n=sTKAfAlwSEgu-Dr1&q=85&s=4bbd76770ff785ce6a1b3f7ac9f701f3" alt="Storefront footer" width="1512" height="805" data-path="images/store/footer.png" />
</Frame>

The footer shows the business description, the **legal links** (Refund Policy, Privacy Policy, Community Guidelines, Terms of Use, Contact Support — fed by Settings → General → Legal), the **accepted payment methods** (Visa, Mastercard, Klarna, Affirm, Link, Cash App Pay, PayPal, Zip), and the copyright.

## Product detail page

Clicking a card opens `store/<product-id>`, with a `Shop /` breadcrumb back to the grid.

<Frame>
  <img src="https://mintcdn.com/boble-90b7fb3f/sTKAfAlwSEgu-Dr1/images/store/product.png?fit=max&auto=format&n=sTKAfAlwSEgu-Dr1&q=85&s=53765b94e8a6505caadaae6b59f48b93" alt="Storefront product detail page" width="1512" height="805" data-path="images/store/product.png" />
</Frame>

* **Image gallery** — main visual with clickable thumbnails.
* **Title and price** — with the pricing type (One-time payment, subscription…).
* **Buy Now** — opens the checkout in a new tab.
* *"Instant delivery · Secure checkout"* reassurance text.
* The content sections configured in the admin (What's inside, Who it's for) when present.

For **bundles**, an **INCLUDED PRODUCTS** section lists every product in the package with its icon and type:

<Frame>
  <img src="https://mintcdn.com/boble-90b7fb3f/sTKAfAlwSEgu-Dr1/images/store/product-included.png?fit=max&auto=format&n=sTKAfAlwSEgu-Dr1&q=85&s=c95f1d5f09bc591722ea8d2ba6c8efd9" alt="Bundle included products on the storefront" width="1512" height="805" data-path="images/store/product-included.png" />
</Frame>

## Checkout and payment

**Buy Now** opens the secure checkout (`/checkout/...`), powered by Stripe:

<Frame>
  <img src="https://mintcdn.com/boble-90b7fb3f/sTKAfAlwSEgu-Dr1/images/store/checkout.png?fit=max&auto=format&n=sTKAfAlwSEgu-Dr1&q=85&s=65e4316194b1a9d3d6726e8820c45c2a" alt="Boble checkout page" width="1512" height="805" data-path="images/store/checkout.png" />
</Frame>

**Left column — order summary:**

* Product name and price
* For bundles, the list of included products
* **Add promotion code** field
* **Total due today**

**Right column — payment form:**

* **Email**
* **Card** — number, expiry date, CVC (Visa, Mastercard, Discover…)
* **Google Pay** as an alternative payment method
* **Full name**, **Country or region**, **Address**
* The **Pay** / **Subscribe** button (label depends on the pricing model)

By paying, the customer agrees to the creator's Terms of Service and Privacy Policy. The page is **Secured by Stripe**.

<Note>
  The checkout reflects the configuration made in the admin panel: pricing type and amount (product Checkout tab), promo codes, trial period, stock, and access expiry.
</Note>