# Options

Motion opens on its settings screen, in the suite's workspace and under
`SleekWP > Motion` in the standalone plugin. Change any field and use the
save action at the top of the page. Every text field starts empty; an empty
field uses the fallback named below, and the grey text in an empty field is
only an example.

The settings are one document in the `sleek-motion_settings` option, read and
saved through `SettingsOperations_read` and `SettingsOperations_save`. Their
fields are listed in the [settings reference](/docs/motion/reference/settings.md).
You can also change them from the terminal with
`wp sleek motion settings update`; see [CLI](/docs/motion/cli.md).

## Selectors

Selectors decide which elements Motion animates.

- **Class name**: the prefix of animation classes. With `motion`, Motion reads
  `motion-from:opacity-0`. A class counts only when it is the prefix itself or
  starts with the prefix and a hyphen. Empty means `animate`.
- **Data attribute**: the attribute that holds animations. Empty means
  `data-animate`.

## Breakpoints

- **Default breakpoint**: the media query for animations without a breakpoint
  prefix. Empty means `(min-width: 1px)`, which always matches.
- **Custom breakpoints**: each has a name, used as `@name:` in an animation,
  and a media query, such as `lg` with `(min-width: 1024px)`. Use letters,
  digits and underscores in the name; `default` is taken by the Default
  breakpoint.

See [Breakpoints](/docs/motion/usage/breakpoints.md).

## Defaults

- **Timeline defaults**: options for every timeline, including the one Motion
  creates for each animated element. `defaults:ease-power2.inOut|duration-0.6`
  gives every animation that ease and duration unless it sets its own. A part
  without `defaults:`, such as `repeat-1`, is an option of the timeline
  itself.
- **Element defaults**: animation parts every animated element starts from.
  With `from:opacity-0|y-20`, every element fades and rises in; an element's
  own parts override them, so `animate-from:y-50` still moves 50 pixels.

See [Defaults](/docs/motion/usage/defaults.md).

## Presets

Each preset has a name and an animation string, written without the class
prefix, such as `fade-up` with `from:opacity-0|y-20`. An element uses it as
`animate-preset-fade-up`. See [Presets](/docs/motion/usage/presets.md).

A breakpoint or preset needs both a name and a value before the screen saves,
and the screen and `wp sleek motion breakpoint add` refuse a breakpoint name
with any other character than letters, digits and underscores, or named
`default`. When two share a name, only the first is kept. A name with a
hyphen saved by an earlier version still works.

## Preview

- **Enable Motion in the editor**: also loads Motion in the block editor and in
  the Bricks, Elementor, Oxygen and Beaver Builder previews, so you see the
  animations while you edit. Off by default; it does not change the front
  end.

## Accessibility

- **Respect reduced motion**: visitors whose system asks for reduced motion
  see every animation's end state instead of the animation. On by default.

## Event

- **JavaScript event**: when set, Motion waits for this event on `document`
  before it starts, instead of starting as soon as its script loads. Your own
  code dispatches it; Motion starts on the first dispatch and ignores later
  ones.

## Changing the settings in code

The `sleekMotion/settings` filter changes the settings Motion prints for its
script without changing what is stored; see [PHP](/docs/motion/hooks/php.md).
