Designer API: Version 2
We're excited to introduce the new version of Webflow's Designer APIs, featuring enhanced functionality and more efficient methods for interacting with the Designer. Refer to the migration guide to learn more about configuring your App to work with version 2 of our Designer APIs.
Quick Nav:
Notable Changes
Simplified edit semantics
We have removed the .save() method from many of our objects. Rather than staging “local changes” and explicitly synchronizing via element.save(), we’re now making changes as they’re invoked.
Accessing native Elements
Through the introduction of the Element Presets Object, the API now allows Apps to insert native Elements onto the canvas.
Inserting Elements
We’re introducing new helper methods that make it easier to insert elements into a hierarchy
element.append()element.prepend()element.before()element.after()
We've removed element-specific methods for adding an element to a canvas including
createDOM()createString()createHeading()
Direct editing of Components
This API allows a more streamlined way to edit Component Objects, by accessing the root element of a Component Object.
Clear and consistent naming
We've made minor changes to clarify Designer API functionality
- “Folders” → “PageFolders” to disambiguate versus other Page resources (eg. Asset pages)
- “og-” -> “openGraph-” prefix for Open Graph Page Fields
Clear and consistent return objects
- Most methods that aren't meant to return a value now return a Promise that resolves to
nullinstead ofundefined - Element IDs are now identified by their component and element ids, eg.
id: {component: '63486e4622e33733b9002e9c', element: 'cafe0045-d304-79d9-8f68-af3adaed06e8'}
New Methods and Objects
Elements
- Element Presets
- Remove element
- Insert Element before target element
- Insert element after target element
- Nest element as first child
- Nest element as last child
Styles
Removed Methods
.save()webflow.createDOM()webflow.createHeading()webflow.createString()