Managing text content is essential for keeping content fresh and relevant. These methods let you handle an element’s text, ensuring it’s always up-to-date.

To effectively use the methods, choose an element that already has its textContent property set to true. This property is read-only, so it’s important to select elements that have this attribute. Using these methods with elements that don’t have this property will return an error.

Methods

element.setTextContent(content)

Set text content for an element. Be sure to check that an element has its textContent property set to true.

Syntax

1
element.setTextContent(content: string): Promise<null>>

Parameters

• content: string - Text to add to the element

Returns

Promise<null>

A Promise that resolves to null.

Example

1
// Get Selected Element
2
const selectedElement = await webflow.getSelectedElement()
3
4
if (selectedElement?.textContent) {
5
6
  // Set and print text content
7
  const text = await selectedElement.setTextContent("Lorem Ipsum")
8
  console.log(selectedElement.textContent)
9
10
}

Designer Ability

Getting Text Content

The textContent of an element is automatically created as a child StringElement of that element. To retrieve the text content from an element, you’ll need to get the child StringElement of your target element. Once you’ve retrieved the StringElement you can use the getText() method to get the text content of your element.

1
// Get Selected Element
2
const selectedElement = await webflow.getSelectedElement();
3
4
if (selectedElement?.textContent && selectedElement?.children) {
5
6
  // Get Child Elements
7
  const children = await selectedElement.getChildren();
8
9
  // Filter string elements from children
10
  const strings = children.filter(child => child.type === "String");
11
12
  // Initialize an array to hold text content
13
  let textContent = [];
14
15
  // Loop over string elements to get text
16
  for (const myString of strings) {
17
    if (myString.type === "String") {
18
      const text = await myString.getText();
19
      textContent.push(text);
20
    }
21
  }
22
23
  // Print text
24
  console.log(textContent);
25
}