> This page is for Designer API.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://developers.webflow.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.webflow.com/_mcp/server.

# Set settings (Beta)

> Set one or more settings on an element.

## `element.setSettings(settings)`

Set one or more settings on an element.

Pass an object with one or more setting keys and their new values.
A value can be a static value, a binding reference to a data source, or `null` to reset the setting to its default and disconnect any existing binding.
The update is undoable via the Designer's undo stack.

> **Beta**
>
> These methods are in public beta and may change with future releases.

For Collection List elements, this method also accepts structured Collection List settings.
See [Collection List settings](/designer/reference/element-settings/collection-list-settings).

## Syntax

```typescript
element.setSettings(settings: SetSettingsInput): Promise<Record<string, ResolvedValue | BindingInput | null>>
```

Related types:

```typescript
// ResolvedValue (static values)
type ResolvedValue =
  | string
  | number
  | boolean
  | null
  | LinkResolvedValue
  | VideoResolvedValue
  | RichTextResolvedValue;

// BindingInput (bind to a data source)
type BindingInput =
  | { sourceType: 'prop'; propId: string }
  | { sourceType: 'cms'; collectionId: string; fieldId: string }
  | { sourceType: 'page'; fieldKey: string }
  | { sourceType: 'locale'; fieldKey: string }
  | { sourceType: 'localeItem'; fieldKey: string };
```

## Parameters

* `settings`: *Record\<string, ResolvedValue | BindingInput | null>* — An object mapping setting keys to new values.

### Value types

| Value                                          | Description                                                             |
| :--------------------------------------------- | :---------------------------------------------------------------------- |
| Static value (string, number, boolean, object) | Sets the setting to a fixed value.                                      |
| Binding reference object with `sourceType`     | Binds the setting to a data source.                                     |
| `null`                                         | Disconnects any existing binding and resets the setting to its default. |

### Binding value shapes

Use an object with a `sourceType` field to bind a setting to a data source:

```typescript
// Bind to a parent component prop
{ sourceType: 'prop', propId: 'prop_3' }

// Bind to a CMS field
{ sourceType: 'cms', collectionId: 'col_abc123', fieldId: 'field_author' }

// Bind to a locale field
{ sourceType: 'locale', fieldKey: 'languageCode' }

// Bind to a page field
{ sourceType: 'page', fieldKey: 'seoTitle' }
```

Pass `null` as the value to disconnect any binding and reset the setting to its default.

### Attributes

To set custom attributes via `setSettings`, pass an `attributes` key with an array of `AttributeEntry` objects.
This replaces all attributes on the element — it does not support partial updates.
Any attributes not included in the array are removed.
Both the name and value of each entry can be a string or a binding reference.

```typescript
type AttributeEntry = {
  name: string | BindingValue
  value: string | BindingValue
}
```

## Returns

**Promise\<Record\<string, *ResolvedValue | BindingInput | null*>>**

A Promise that resolves to an object with the same shape as the input, reflecting the values that were set.

## Example

```typescript
const element = await webflow.getSelectedElement()

if (element) {

  // Set static values
  await element.setSettings({ tag: 'h1', domId: 'my-id' })

  // Bind a setting to a component prop
  await element.setSettings({ domId: { sourceType: 'prop', propId: 'prop_3' } })

  // Reset a setting to its default and disconnect any binding
  await element.setSettings({ altText: null })

  // Replace all custom attributes on the element
  await element.setSettings({
    attributes: [
      { name: 'data-label', value: 'primary' },
      { name: 'data-index', value: '1' },
    ],
  })

}
```

## Designer Ability

| Designer Ability | Locale | Branch | Workflow | Sitemode |
| :--------------- | :----- | :----- | :------- | :------- |
| **canEdit**      | Any    | Any    | Canvas   | Any      |