- Where to find it
- Labelled Pointer Events in the Collection Settings drawer (gear in the collection header).
- Per device
- Yes — you can set one value for every screen, or separate values for phone, tablet, and desktop.
- Underlying CSS
pointerEvents
In plain English
Pointer Events decides who receives a click or tap on the whole collection. "auto" (the default) takes the click. "none" lets the click fall through as if the collection were not there.
The setting that most needs this is an overlay layer. A layer covers the base, so without "none" every click aimed at the base would hit the layer instead. Set Pointer Events to "none" in Layer Settings and the base stays clickable. A button sitting on that layer can take clicks back by setting "auto" on its own column.
What each option does
| Option | What you will see |
|---|---|
auto | The default. Clicks and taps land on the collection or layer and its contents. |
none | Clicks and taps pass through the collection or layer to whatever is behind it. Descendants can take them back with "auto". |
When you would use it
- An overlay layer should decorate the collection without blocking clicks on the base.
- The collection is a visual overlay on neighbouring content that should stay clickable.
How to change it
- Open Collection Settings (or Layer Settings, when a layer is selected) from the gear, then "Pointer Events".
- Choose "none" to let clicks through, or "auto" to take them.
- Open Preview to confirm — the editing canvas keeps the collection clickable so you can still work on it.
One value, or one per device? Every input in this setting sits under a “Same value for all resolutions” checkbox. Leave it checked for a single value everywhere, or uncheck it to give phones, tablets, and desktops their own. How per-device values work.
Watch out for
- This setting is left out on the editing canvas so you can still click and drag. Open Preview to see clicks actually pass through.
- "none" on the whole collection makes every control inside it unusable, unless a child sets "auto" to take clicks back.
- On a layer this is usually the setting you want, not Hide. Hide removes the layer from view; Pointer Events of "none" keeps it visible and lets clicks through.
Related settings
- Pointer Events
- Widget Pointer Events
- Row Pointer Events
- Hide Collection
- Using a CSS variable instead of a typed value
- Setting a different value per device
For developers
The technical reference for what this setting produces: MDN: pointer-events. You do not need any of it to use the setting — it is there for whoever is building the components or debugging the published page.
Where to go next
- Back to the full attribute reference
- The Composer — the editing surface these settings live in.
- Publishing — how a change like this reaches your live site.