Use Notion Databases in your website (includes sitemap)

Published: 11 June 2024
on channel: Webstudio
2,820
70

⚠️ Disclaimer: Using Notion Page content in Webstudio is impossible (for now), so it is only for Database properties.

Follow along as I create a website using Notion data and Webstudio for the frontend. Webstudio connects to any API, including Notion's, making Webstudio a Notion website builder.

We'll create:
An overview page listing all items in a Notion database. In this example, I use the Notion Events calendar.
A details page that displays a single record with its own URL
A dynamic sitemap that displays the various items in your Notion database

Notion Integration: https://www.notion.so/my-integrations

A lightweight Notion template is in the Marketplace :)
To start a new project, clone the template. https://wstd.us/notion-template
To integrate with an existing project, visit the Marketplace and insert the various pages.

You can use Webstudio as a Notion website builder for any properties that exist in your database. Notion Page content cannot be fetched in Webstudio. This is because it takes three API calls to get to Notion block content (1. Database, 2. Page content, 3. Block content).

Hope you build something cool!

Build unlimited sites with Webstudio for FREE 👉 https://wstd.us/future-web


Watch video Use Notion Databases in your website (includes sitemap) online without registration, duration hours minute second in high quality. This video was added by user Webstudio 11 June 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 2,820 once and liked it 70 people.