Webflow Designer API: Get all elements

`webflow.getAllElements()`

Retrieve all elements present on the current page of the Designer.

If the Designer is editing a component, the elements returned are those present in that Component.

Syntax

1 webflow.getAllElements(): Promise<Array<AnyElement>>

Returns

Promise<AnyElement>

A Promise that resolves to an array of AnyElement objects.

AnyElement represents the various element types available in a Webflow project. See a full list of supported element types in the Designer Extension type definitions.

Example

1 // Retrieve all elements in the current context
2 const allElements = await webflow.getAllElements();
3 
4 // Print element list
5 if (allElements.length > 0) {
6   console.log("List of all elements:");
7 
8   allElements.forEach((element, index) => {
9     console.log(`${index + 1}. Element ID: ${element.id}, Element Type: ${element.type}`);
10   });
11 } else {
12   console.log("No elements found in the current context.");
13 }

Designer Ability

Checks for authorization only

Designer Ability	Locale	Branch	Workflow	Sitemode
canAccessCanvas	Any	Any	Any	Any

1	// Retrieve all elements in the current context
2	const allElements = await webflow.getAllElements();
3
4	// Print element list
5	if (allElements.length > 0) {
6	console.log("List of all elements:");
7
8	allElements.forEach((element, index) => {
9	console.log(`${index + 1}. Element ID: ${element.id}, Element Type: ${element.type}`);
10	});
11	} else {
12	console.log("No elements found in the current context.");
13	}