How to Embed a Notion Page Into a Website
🔍 WiseChecker

How to Embed a Notion Page Into a Website

You want to display a Notion page directly on your website so visitors can view it without leaving your site. Notion provides a built-in Share and Publish feature that generates a public link and an embed code for any page. This article explains how to generate that embed code, the required settings, and how to paste it into your website builder or CMS.

Key Takeaways: Embedding a Notion Page

  • Share > Publish > Copy link: Generates a public URL that you can embed with an iframe.
  • Share > Publish > Allow duplicate as template: Must be disabled to prevent visitors from copying your page.
  • iframe embed code: Use <iframe src="your-public-link"></iframe> in your website HTML.

How Notion Page Embedding Works

Notion does not offer a one-click embed button. Instead, you publish the page to the web, then use the generated public URL inside an HTML iframe on your website. The page must be publicly accessible, meaning anyone with the link can view it. You can control whether visitors can search engines index the page or if they can duplicate it as a template.

Before you start, ensure your Notion page is not a private or team-only workspace page that contains sensitive information. Once published, the page is visible to anyone who has the link. You cannot password-protect a Notion page, so only publish content you want the entire internet to see.

The embedded page will retain its formatting, including databases, images, and code blocks. However, interactive elements like date pickers or rollup formulas may not function inside an iframe. The page will also be responsive, scaling to fit the iframe container on your site.

Steps to Embed a Notion Page Into a Website

  1. Open the Notion page you want to embed
    Navigate to the page in your Notion workspace. Make sure the page is fully edited and ready for public viewing.
  2. Click the Share button in the top-right corner
    A panel opens showing sharing options for the current page.
  3. Toggle the Share to web slider to On
    This makes the page publicly accessible. A public link appears below the slider.
  4. Optional: Disable Allow duplicate as template
    If you do not want visitors to copy your page structure, uncheck this box. Keep it checked if you want others to reuse your template.
  5. Optional: Enable Search engine indexing
    If you want the page to appear in Google search results, check this box. Leave it unchecked for a private embed.
  6. Click Copy link
    This copies the public URL to your clipboard. The link looks like https://www.notion.so/your-page-id.
  7. Open your website editor or CMS
    Go to the page or post where you want to embed the Notion page. Most website builders have a custom HTML block or an embed widget.
  8. Insert an iframe with the copied URL
    Paste this code into the HTML block, replacing YOUR_LINK with the URL you copied:
    <iframe src="YOUR_LINK" width="100%" height="800px" style="border:none;"></iframe>
    Adjust the height value to fit your layout. The border:none style removes the default iframe border.
  9. Publish or update your website
    Save the changes and view the live page to confirm the Notion page appears correctly.

Common Issues When Embedding a Notion Page

The iframe shows a blank white space

This usually means the page is not published. Go back to the Share panel and confirm the Share to web slider is On. Also check that the URL in the iframe src attribute exactly matches the copied link, including the https:// prefix.

The embedded page is too tall or too short

Notion pages have variable height based on content. Set a fixed height in the iframe that accommodates the full page. A height of 800px works for most pages, but you can increase it to 1200px for longer pages. If you want the iframe to auto-resize, you will need custom JavaScript, which Notion does not natively support.

Visitors see a Notion login screen instead of the page

This occurs when the page is shared with specific people rather than published to the web. Ensure you used Share to web, not the Add people option. The Share to web slider must be toggled On for the page to be embeddable.

Interactive database features do not work in the embed

Notion databases inside an iframe are read-only. Visitors cannot filter, sort, or add new entries to a database view. If you need interactivity, consider linking to the live Notion page instead of embedding it.

Notion Embed vs Direct Link: Key Differences

Item Embedded iframe Direct public link
User experience Page appears inside your site without leaving Visitor is redirected to Notion website
Branding Your site controls the surrounding layout Notion interface and toolbar are visible
Interactivity Databases are read-only; no editing Full Notion functionality, including editing if permissions allow
SEO Search engines may not index embedded content easily Page can be indexed if search indexing is enabled
Mobile responsiveness Scales with iframe width, but height is fixed Fully responsive on mobile devices

You can now embed any Notion page into your website using the iframe method. Start by publishing the page in Notion, then paste the public URL into an iframe block in your website builder. For a cleaner look, set the iframe border to none and match the background color to your site. If you need real-time updates, note that the embedded page will automatically reflect changes made in Notion without republishing.