The Heading element represents an element within the Webflow Designer. The following methods are specific to Heading elements.

Properties

Property	Description	Type	Example
`id`	Unique identifier for the element composed of two identifiers, the `component` and the `element`.	`object`	`{component: "64c813...", element: "5edf8e59-71f9..."}`
`type`	Specifies the type of the element.	'string'	'Heading'
`children`	Indicates if the element can contain child elements.	`boolean`	`true`
`customAttributes`	Indicates if the element can contain custom attributes.	`boolean`	`true`
`styles`	Indicates if the element can contain styles.	`boolean`	`true`
`textContent`	Indicates if the element can contain text content	`boolean`	`true`

Methods

`element.getHeadingLevel()`

Retrieves the heading level of a heading element.

Syntax

element.getHeadingLevel(): Promise<null | 1 | 2 | 3 | 4 | 5 | 6>

Returns

Promis<level>: Number - 1 | 2 | 3 | 4 | 5 | 6

A Promise that resolves to the value of the heading level.

Example

const selectedElement = await webflow.getSelectedElement()

if (selectedElement?.type === 'Heading'){

  const headingLevel = await selectedElement.getHeadingLevel()
  console.log(headingLevel)

} else {
  console.log("Selected Element is not a Heading Element")
}

`element.setHeadingLevel(level)`

Set the heading level of a heading element.

Syntax

element.setHeadingLevel(level: 1 | 2 | 3 | 4 | 5 | 6): Promise<null>

Parameters

level: Number - 1 | 2 | 3 | 4 | 5 | 6

Returns

Promise<null>

A Promise that resolves to null

const selectedElement = await webflow.getSelectedElement()

if (selectedElement?.type === 'Heading'){

  const headingLevel = await selectedElement.setHeadingLevel(1)
  console.log(headingLevel)

} else {
  console.log("Selected Element is not a Heading Element")
}