The String element represents a string value within the Webflow Designer.
String elements cannot be created directly, and are only created as a side effect of creating other element presets that contain text content (eg. webflow.elementPresets.FormBlockLabel
).
See methods below you to retrieve and set the text of a String element.
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 | 'String' |
children | Indicates whether an element can contain child elements. | boolean | false |
styles | Indicates if the element can be styled. | boolean | false |
textContent | Indicates if the element can contain text content | boolean | false |
customAttributes | Indicates whether an element can have custom attributes | boolean | false |
Methods
element.getText()
element.getText()
Retrieves the text value from a String element
Syntax
element.getText(): Promise<null | string>
Returns
Promise<string
>
A Promise that always resolves to a String value
- String Contents of the string element, which may be an empty string.
Example
// Get Selected Element
const selectedElement = await webflow.getSelectedElement();
if (selectedElement?.textContent && selectedElement?.children) {
// Get Child Elements
const children = await selectedElement.getChildren();
// Filter string elements from children
const strings = children.filter(child => child.type === "String");
// Initialize an array to hold text content
let textContent = [];
// Loop over string elements to get text
for (const myString of strings) {
if (myString.type === "String") {
const text = await myString.getText();
textContent.push(text);
}
}
// Print text
console.log(textContent);
}
Designer Ability
Checks for authorization only
Designer Ability | Locale | Branch | Workflow | Sitemode |
---|---|---|---|---|
canAccessCanvas | Any | Any | Any | Any |
element.setText(text)
element.setText(text)
Sets the text value on a String element, overwriting any prior text value.
Syntax
element.setText(text: string): Promise<null>
Parameters
- text:
string
- The new text for yourStringElement
Returns
Promise<null
>
A Promise that resolves to null
.
// Get all elements and find the first StringElement
const allElements = await webflow.getAllElements();
const foundElement = allElements.find(el => el.type === "String");
if (foundElement) {
// Check that element has the method in order to use it
if ('setText' in foundElement) {
const elementText = foundElement.setText("Hello Element 🚀"); // Set Text
}
} else {
console.log('Element not found on page');
}
Designer Ability
Designer Ability | Locale | Branch | Workflow | Sitemode |
---|---|---|---|---|
canEdit | Any | Any | Canvas | Any |