Storefront setup
Add the Design Now button to your product pages and enable cart editing, using Shopify theme app blocks — no code changes.
Customezo installs into your storefront as theme app blocks. Nothing is injected into your theme’s code, nothing is left behind if you uninstall, and you can turn every piece on or off from the Shopify theme editor.
There are two pieces:
| Piece | Where it goes | What it does |
|---|---|---|
| Design Now button | Product template, as a block | Opens the designer for that product. |
| Customezo Cart UX | App embed (site-wide) | Adds Edit design and Preview links to cart line items. |
Add the Design Now button
- In Shopify admin, go to Online Store → Themes and press Customize on your published theme.
- Switch the top selector to a Products → Default product template (or the specific template your custom products use).
- In the left panel, under the product information section, press Add block and choose Design Now from the Customezo apps group.
- Drag it into position — directly above or below the Add to cart button works best.
- Press Save.
The button only appears on products that have the designer enabled in Customezo, so you can safely add it to a template shared by all products.
Button settings
| Setting | What it does |
|---|---|
| Button text | The label shown to shoppers. Leave empty to use the default, which is translated automatically. |
| Button style | Primary (filled) or Outline. |
| Background color / Text color | Override the colors to match your theme. |
| Font size | 12–24 px. |
| Border radius | 0–30 px. |
| Show icon | Shows a small design icon before the label. |
| Full width | Stretches the button to the width of the product form. |
| Alignment | Left, center or right when the button is not full width. |
| Open mode | Open the designer in the same tab or a new tab. |
Match your theme
Set the background color to your theme’s primary button color and the radius to the same value your Add to cart button uses. The designer itself is styled separately — see Designer branding.
Enable Customezo Cart UX
- Still in the theme editor, open the App embeds tab in the left panel.
- Switch Customezo Cart UX on.
- Press Save.
This embed detects customized line items in your cart and adds the links your shoppers need.
Cart UX settings
| Setting | What it does |
|---|---|
| Edit design | Shows an Edit design link on customized cart items so shoppers can reopen the designer. |
| Edit design label | Custom wording for that link. |
| Locked label | Wording shown when the design can no longer be edited, for example once production has started. |
| Design preview link | Shows a link that opens the full-size preview of the customer’s design. |
| Preview link label | Custom wording for the preview link. |
| Cart section IDs (advanced) | Only needed if your theme uses non-standard cart section names and the links do not appear. |
| Analytics | Sends anonymous interaction events so your dashboard stats stay accurate. |
Check that everything is live
Back in Customezo, the dashboard shows a Theme status card:
- Theme — the published theme Customezo inspected.
- Design button — detected or not detected.
- Cart UX — detected or not detected.
- Re-check — runs detection again after you save theme changes.
Legacy Liquid templates
If your product page uses a legacy Liquid template rather than a JSON template, Shopify does not expose enough information for automatic detection. Add the block as usual, then mark the setup step with I’ve installed it. If detection later succeeds, it replaces your manual confirmation automatically.
Testing it
- Open a product that has the designer enabled on your storefront.
- The Design Now button should appear where you placed it.
- Design something, add it to the cart, and confirm the Edit design and Preview links show on the cart line.
- Reopen the design from the cart, change something and update the cart — the line item and its price should update.
Troubleshooting
The button does not appear.
- Confirm the designer is enabled for that product in Customezo (Products → the product → Enable designer).
- Confirm the product status is Active and the product is published to the Online Store sales channel.
- Confirm you added the block to the template that product actually uses.
- Press Re-check on the dashboard’s Theme status card.
The button appears on products that should not have it. The block hides itself on products without a designer configuration. If it still shows, the product likely has the designer enabled — disable it on the product page in Customezo.
Cart links do not appear. Confirm the app embed is on and saved. If your theme renders the cart with custom section names, enter them in the Cart section IDs setting.
Styling looks off. Adjust colors, radius and full width in the block settings rather than adding CSS. If your theme overrides button styles globally, switch the block to Outline and set the colors explicitly.
More fixes: Troubleshooting.