In the docs

Moving and reacting

Click actions

Anything can do something when it's clicked or tapped: open a drawer, step through a list, add to cart, flip a switch. A button with a link simply follows it.

Stoneware Mug
Stoneware Mug
$24.00
Pleated Table Lamp
Pleated Table Lamp
$96.00
Linen Cushion
Linen Cushion
$38.00
Soy Candle
Soy Candle
$28.00
Ceramic Vase
Ceramic Vase
$42.00
Rattan Basket
Rattan Basket
$34.00
←
→
Try it: click the arrows, or a dot. The arrows are buttons set to Next item and Previous item; the dots are a list whose click makes an item current.

How to set one

  1. Select the button, text or box.
  2. In its Behaviour tab, pick under When clicked.

What a click can do

Follow its link
For buttons and links with somewhere to go.
Open “…”
Open a drawer or pop-up on the page. See Drawers and pop-ups.
Close the layer
For the Close button inside a drawer or pop-up.
Next item, Previous item
Step through a list's current item: a gallery, a close-up.
Next in carousel, Previous in carousel
Arrows beside a carousel.
Show all
Clear the search and filters on a list.
Show more
Show a list's next page, for lists shown a page at a time.
Set a switch…
Flip a switch, so parts that wait for it show or hide. See Switches.
Add to cart
Add the product it can read. See The cart.
One more, One fewer, Remove it
On a line in the cart.

Clicks on list items

A list decides what a click on one of its items does, under When one is clicked in its Behaviour tab: open the item's page, make it the current item, open a drawer with it, or narrow another list. See Lists.

Recipes that use it