ElementsElement Properties & MethodsSettings

Set visibility (Beta)

element.setVisibility(visibility)

Set the visibility of an element, or bind its visibility state to a data source.

Verify that the element has the visibility property before calling this method.

Beta

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

Syntax

1element.setVisibility(visibility: boolean): Promise<null>
2element.setVisibility(binding: BindingInput): Promise<null>

Related types:

1type BindingInput =
2  | { sourceType: 'prop'; propId: string }
3  | { sourceType: 'cms'; collectionId: string; fieldId: string }
4  | { sourceType: 'page'; fieldKey: string }
5  | { sourceType: 'locale'; fieldKey: string }
6  | { sourceType: 'localeItem'; fieldKey: string };

Parameters

  • visibility: boolean | BindingInput — true to show the element or false to hide it. Pass a BindingInput object to bind the visibility to a data source such as a CMS boolean field or component prop.

Returns

Promise<null>

A promise that resolves to null on success.

Example

1const element = await webflow.getSelectedElement();
2
3if (element?.visibility) {
4
5  // Hide the element
6  await element.setVisibility(false);
7
8  // Show the element
9  await element.setVisibility(true);
10
11  // Bind visibility to a CMS boolean field
12  await element.setVisibility({
13    sourceType: 'cms',
14    collectionId: 'col_abc',
15    fieldId: 'field_xyz',
16  });
17}

Designer Ability

Designer AbilityLocaleBranchWorkflowSitemode
canDesignPrimaryMainCanvasDesign