Chevron Left

查看所有社区故事

将 Notion 与 Metabase 结合使用

2025年1月26日

投稿人

郭庭韶

节点

photo of Ting-Shao Kuo

郭庭韶是一名软件工程师。除了开发软件,他还通过构建内部系统不断提升团队效率。您可以在 X 上通过 @bottle_of_soul 联系他。

想将 Metabase 仪表板添加到 Notion 吗?如果您的团队使用 Notion 进行组织协作,嵌入 Metabase 可以将您的数据融入日常工作流程。以下是使用 CodePen 实现此目的的方法。

为什么要将 Metabase 嵌入到 Notion?

在一家 SaaS 公司工作,我深知数据的重要性——尤其是在理解用户行为方面。我们依赖数据来改进产品、确定功能优先级并优化设计。

为了让我们的决策更加数据驱动,我希望将 Metabase 仪表板集成到我们日常使用的项目管理工具中。由于我们的团队使用 Notion 处理所有事务——从会议记录到设计草稿——我找到了一种使用 CodePen 将 Metabase 图表直接嵌入 Notion 的方法。

如果您是 Metabase 新用户,请查阅我们的入门指南以设置您的第一个仪表板。

使用 CodePen 将 Metabase 嵌入 Notion 的 3 个步骤

步骤 1. 在 Metabase 中复制 iframe 代码

转到您希望嵌入 Notion 的 Metabase 问题,然后单击右下角的分享图标。

Screenshot of a chart build with Metabase

然后启用问题分享并复制 iframe 代码。

Screenshot of enabling sharing option in Metabase

步骤 2. 将您的 iframe 代码粘贴到 CodePen 中

您需要使用 CodePen 的原因是 Notion 不支持 Metabase 的原生 iframe 代码,但它支持 CodePen。

Codepen

Codepen

单击“调试模式”后,浏览器中将打开一个新标签页。复制该标签页的 URL。

步骤 3. 将 CodePen URL 粘贴到您的 Notion 页面

打开您的 Notion 页面并输入“/codepen”以创建一个 CodePen 块。

Codepen & Notion

将上一步复制的 URL 粘贴到 CodePen 块中,然后单击“嵌入链接”。

Embedding link in Notion

现在您可以在 Notion 中直接查看交互式 Metabase 图表了!

Metabase embedded in Notion

重要提示

请注意,这不是 Metabase 官方指南。
按照这些步骤操作将使您的仪表板公开。了解更多关于Metabase 安全设置的信息。

投稿人

郭庭韶

节点

photo of Ting-Shao Kuo

郭庭韶是一名软件工程师。除了开发软件,他还通过构建内部系统不断提升团队效率。您可以在 X 上通过 @bottle_of_soul 联系他。

您可能还会喜欢

预测下一次点击

Ukrit Wattanavaekin

Metabase

利用数据提供可靠指标

Frédéric Vion

Subclic

您可能还会喜欢

预测下一次点击

Ukrit Wattanavaekin

Metabase

利用数据提供可靠指标

Frédéric Vion

Subclic

© . All rights reserved.