---
title: "lzb.editor.PreviewServerCallback.replaceNode"
description: "JS filter `lzb.editor.PreviewServerCallback.replaceNode` of the Lazy Blocks WordPress plugin."
url: "https://www.lazyblocks.com/docs/js-filters/lzb-editor-previewservercallback-replacenode/"
lastUpdated: 2026-08-26
source: "js-filters/lzb-editor-previewservercallback-replacenode.mdx"
---
# lzb.editor.PreviewServerCallback.replaceNode

Filter called for every node while the editor preview parses the rendered block markup. Return a React element to put in place of the node, or the default `null` to leave the node to the standard handling.

Use it to give a custom component of your own the same treatment `` gets: written as a tag in the block code, turned into a real editor component in the preview.

## Attributes

| Name         | Type            | Description                                              |
| ------------ | --------------- | -------------------------------------------------------- |
| `customNode` | **JSX \| null** | replacement node, `null` by default                       |
| `domNode`    | **Object**      | parsed node, with `name`, `attribs` and `children`        |
| `data`       | **Object**      | `props`, `parserOptions`, `domToReact`, `prepareAttributes` |

`prepareAttributes` converts the raw markup attributes the way the rest of the parser does: `"true"` and `"false"` become booleans, `class` becomes `className`.

## Usage

```js title="JS"
wp.hooks.addFilter(
  "lzb.editor.PreviewServerCallback.replaceNode",
  "my.custom.namespace",
  function (customNode, domNode, data) {
    if (domNode.name !== "myComponent") {
      return customNode;
    }

    const atts = data.prepareAttributes(domNode.attribs);

    return <div className={atts.className}>{atts.label}</div>;
  }
);
```

Returning anything other than `null` stops the default handling for that node, so return the incoming `customNode` untouched for every node you do not care about.

## Documentation Index
> Fetch the complete documentation index at: https://www.lazyblocks.com/llms.txt
> Fetch every page in a single file at: https://www.lazyblocks.com/llms-full.txt
