Market Dropdown
The market picker — customers choose their market and the whole storefront follows.
Last updated
How to use
Choose the
Mode—Configfor a native select styled entirely through the panel, orConnectfor your own fully custom design.In
Connectmode, connect your dropdown design to⦿ Design.In
Configmode, style the dropdown through theStylespanel — font, transform, padding, radius, Selected/Hover states, and the chevron icon.Optionally set
Canvas Marketto choose the example market shown while designing on canvas.
The default market, which markets are available, and the order they appear in all come from the Butter plugin's Markets & Localization settings — not from this component.
Config mode vs. Connect mode
| What it is |
|---|---|
| A configurable design styled entirely via the panel's |
| Your own custom design as the trigger. It ships pre-connected with the active market's label and flag — detach it to customize freely, or leave it connected and edit the design directly on canvas. |
Where the available markets and their order come from
The countries in the dropdown, and the order they're listed in, come from the plugin's Markets & Localization screen — drag the markets there into the order you want. Canvas Market only controls the example shown while you're designing — it has no effect on preview or the published site.
What changes when a customer picks a market
Picking an option sets the active country, currency, and language — prices reformat across the site immediately, and checkout runs in that currency. The choice is remembered in the customer's browser, so it sticks when they return.