---
title: "Reload the page canvas"
slug: "reload-the-page-canvas"
abstract: "How to programmatically reload the SitecoreAI Page builder canvas when the contents change."
---
# Reload the page canvas

*Required extension points: any SitecoreAI Page builder extension point*

*Required SDK packages: client*

*Required API access: none*

> [!note]
> **Before you begin**
> -   Complete the [SDK quick start](https://doc.sitecore.com/mp/en/developers/sdk/0/sitecore-marketplace-sdk/quick-start--manual-.html "Quick start (manual)").

You can programmatically reload the page canvas so the SitecoreAI Page builder user can immediately see the most recent changes, with no manual reloading required. This is useful when the page contents change. For example, after your Marketplace app inserts a new text field into the canvas.

To reload the page canvas:

1. In the SDK initialization code where you run the `useMarketplaceClient` hook, after the Effect Hook, create a new mutation function:

    ```typescript
    // Make a mutation to reload the page canvas
    const reloadCanvas = () => {
      client?.mutate("pages.reloadCanvas");
    };
    ```

2. In the `return` statement, create a button that runs the mutation function, then save your changes:

    ```typescript
    <button onClick={reloadCanvas}>Reload canvas</button>
    ```

3. In the SitecoreAI Page builder, refresh the page, then open your Marketplace app.
4. In the Marketplace app, click **Reload canvas**.