ElementsElement Properties & MethodsTags

Set HTML tag

element.setTag(tag)

Set the HTML tag of an element.

For example, you can change a Webflow list element to use the <ul> or <ol> HTML tags. The valid tag values depend on the element type. Webflow List, Div Block, and Heading elements are supported.

Syntax

1element.setTag(tag: BlockElementTag | HeadingTag | ListTag): Promise<null>

You can also use this method to set the CMS binding of a Heading element:

1// Heading elements only — binds the tag to a CMS field
2element.setTag(binding: BindingInput): Promise<null>

Parameters

The valid values for tag depend on the element type:

Element typeParameter typeValid tag values
Block, Section, VFlex, HFlex, Container, Row, Column, BlockContainer, RichText, Slot, NavbarContainer, TabsContentBlockElementTagdiv, header, footer, nav, main, section, article, aside, address, figure
HeadingHeadingTagh1, h2, h3, h4, h5, h6
ListListTagul, ol

Returns

Promise<null>

A Promise that resolves when the tag has changed.

Example

1const el = await webflow.getSelectedElement();
2
3// Change a Section element to use a nav tag
4if (el?.type === 'Section') {
5  await el.setTag('nav');
6}
7
8// Change a Heading element from h1 to h2 and change its CMS binding
9if (el?.type === 'Heading') {
10  await el.setTag('h2');
11  // Bind to a CMS field
12  await el.setTag({
13    sourceType: 'cms',
14    collectionId: 'col_abc',
15    fieldId: 'field_xyz',
16  });
17}
18
19// Change a List element from unordered to ordered
20if (el?.type === 'List') {
21  await el.setTag('ol');
22}

Designer Ability

Checks for authorization only

Designer AbilityLocaleBranchWorkflowSitemode
canAccessCanvasAnyAnyAnyAny