Webflow Editor Integration

This skill explains how to ensure your custom code doesn't interfere with the Webflow Designer/Editor while providing full functionality on the published site.

Editor Detection

Import handleEditor from @webflow/detect-editor:

import { handleEditor } from "@webflow/detect-editor";

export default function (element: HTMLElement, dataset: DOMStringMap) {
  let isEditorMode = false;

  handleEditor((isEditor) => {
    isEditorMode = isEditor;