Open the Appearance editor
Open Appearance in the Loto Cart menu. The settings sit next to a live preview of the cart drawer, rendered with the same code that runs on your store, so every change shows up as you make it.
The Appearance editor is available on every plan, including the free Starter plan.
What you can change
Settings are grouped by the part of the drawer they affect:
- Drawer: background, maximum width, backdrop opacity, inner padding, how many items show before the list scrolls, and animation speed.
- Header: the background and padding of the top bar with the title and close button.
- Buttons: the primary, secondary and checkout buttons, including their hover color and padding.
- Line items: product image size and background, quantity badge, title, price, line discounts and row spacing. You can also let shoppers click the title or image to open the product page, and show the compare-at price crossed out.
- Quantity stepper: the − / number / + control on each row.
- Totals: the subtotal and shipping rows, the total and the total savings line.
- Empty cart and Cart icon.
Change the drawer font
The font is not set in the Appearance editor. It is set in your theme editor: open the Loto Cart app embed and pick a font under Drawer font. That gives you the same font library your theme uses, so the drawer can match the rest of your store.
The app’s Settings page shows which font the drawer is using.
Save, discard and revert
When you change a setting, a save bar appears at the top of the page. Click Save to publish the change to your store or Discard to throw it away. If the save bar stays visible after saving, the change was not saved: try again.
To start over, use Revert settings to default at the bottom of the page.
Style individual features
The Appearance editor covers the drawer itself. Features that add something to the cart, like the free shipping bar, the discount field or the upsell footer, have their own style options on their feature page, with a preview of that feature.
Why your theme can’t break the look
The drawer renders inside a closed shadow DOM, so your theme’s CSS can’t reach in and change it. What you set in Loto Cart is what shoppers see, whatever theme you use.
