A custom field for Sitecore XM Cloud Marketplace that lets authors easily add tables to pages by copying and pasting directly from Excel, Google Sheets, or HTML tables.
Start typing to search...
Sitecore recently introduced the Marketplace for XM Cloud, providing developers and partners with a flexible way to extend the platform through custom integrations.
The Marketplace SDK supports multiple integration points where custom apps can plug into the XM Cloud experience:
This guide focuses on #4 – Custom Field – XMC Page Builder, where we’ll create a custom field that allows content authors to copy and paste tables from a variety of sources — Excel, Google Sheets, or HTML tables from other sites.
The first thing we need to do is to set up an app in XM Cloud.
In the Sitecore Portal, open Developer Studio from the top navigation and click Create App.
My TableCustom
Once the app is created, click Configure App.
Under Extension Points, enable only Custom field.
Fill in:
My Table/
Under API Access, select XM Cloud APIs and click Save.
For testing, you can use this public example app:
https://sitecore-xm-cloud-spreadsheet-table.vercel.app
You can replace this later with your own hosted application.
For local development, use: http://localhost:3000
Example logo URL:
https://raw.githubusercontent.com/robertobarbedo/sitecore-xm-cloud-spreadsheet table/refs/heads/main/AppIcon.png
On the top-right corner, copy the Marketplace App ID — you’ll need it later when creating the field.
Click Activate to enable the app.
From Sitecore Portal’s top menu, go to My Apps → Install the Table App.
During installation, select the environments where this app should be available.
Now that your Marketplace app is live, let’s create a field using the Table type.
TablePlugin
In Page Builder, open your component or page — you should now see the Table field available.
Click Open app to launch it.
This custom field lets authors paste tables from multiple sources — Excel, Google Sheets, or even website HTML tables.
💡 Note: The dialog’s title uses the field name directly. At the time of writing, it doesn’t yet pull from Display Name or Field Title.
Sitecore provides great documentation for building Marketplace apps — see reference links at the end.
You can download the working Table application from my GitHub repo and host it yourself.
🔗 https://github.com/robertobarbedo/sitecore-xm-cloud-spreadsheet-table
In that repository, you’ll also find a SpreadsheetTable.tsx.sample component, which can be used to render the data from your custom Table field. This component is just a sample that you need to rename and add to your actual website head application.
If you want to start from scratch, use the official Marketplace Starter Kit:
🔗 https://github.com/Sitecore/marketplace-starter
When developing your custom Marketplace app, you won’t see it running standalone in a browser — it must be connected to an XM Cloud organization.
The good news is that you can point your app to http://localhost:3000 to test and debug it directly inside Page Builder, with live data.
In the Marketplace Starter Kit, you’ll find a helper called useMarketplaceClient.
This hook provides a convenient API for interacting with Page Builder — retrieving, saving, and closing your field data.
Example of some useful functions:
const { client, isInitialized } = useMarketplaceClient();
// Retrieve the data
const existingData = await client.getValue();
// Save the data
// The second parameter decides whether to refresh the page
client.setValue(dataToSave, true);
// Close the dialog
client.closeApp();
It opens up endless possibilities for delivering customized authoring experiences, while maintaining the same flexibility and control developers have always enjoyed in Sitecore.
With this approach, you can create tools that simplify authoring, streamline workflows, and empower editors — directly inside Page Builder.