# Design your checkout

Offer design lives in Plandalf. Your public page usually only needs the offer slug and SDK options.

## What you can design

-   page structure and block order
-   heading, text, image, and HTML blocks
-   product summaries and payment blocks
-   option selectors, add-ons, and upsells
-   brand colors, type, spacing, borders, and radius
-   mobile layout and page progression
-   close behavior and confirmation copy

## Embed stays stable

Changing design inside the offer does not require replacing your site button:

```html
<button data-plandalf-present="pro-plan">
  Buy Pro
</button>
```

The next time the SDK opens `pro-plan`, it uses the current published offer state.

## Use real test sessions

Preview layout in the editor, then run a test session to verify the complete customer path:

-   required fields
-   payment methods
-   totals, taxes, and discounts
-   add-ons and upsells
-   mobile frame behavior
-   redirects and automations

## Related docs

-   [Configure frame and size](https://plandalf.com/docs/sdk)
-   [Multi-page flows](https://plandalf.com/docs/product-guides/checkouts/multi-page-flows)
-   [Going live](https://plandalf.com/docs/going-live)

Source: https://plandalf.com/docs/product-guides/checkouts/design
