Hi~ 我是 Linmi,这是 Notion 中文基础入门教程的第二篇,这一篇我将和大家一起体验 Notion 的 embed block,通过使用 Notion embed,让我们发掘提升效率的更多可能。

这个新瓶怎么样?

其实 embed 这个概念早已有之,博客时代我们可以自定义嵌入

通过 Notion 的 embed,我们可以在 Notion 内看 Bilibili 视频,完成思维导图制作,甚至可以在 Notion 中使用腾讯文档、石墨文档、Google 文档,还有最近新潮的松果文档。

Notion embed :新瓶老酒,真香-Linmi

我试了试印象笔记,并不支持。

按照这个节奏,我可以在一个页面内看超多网页的内容,似乎就不用每天跳来跳去。实际测试中,针对跳转的页面

看起来是有点作,但是 Notion embed 实际应用场景还是能显著提高我们的效率。

这篇文章我就带大家来体验一下 Notion 的 embed,

  • 如何创建 embed Block
  • Notion 如何内嵌 Bilibili 、YouTube 视频?

创建你的第一个 embed Block

使用 embed 很简单,可以通过一下三种方式创建得到一个 embed Block。

快捷命令创建

Notion 页面键入/embed 快捷命令,

场景一:内嵌文档、视频,方便记笔记

当我们身边的朋友或者客户给我们发了 Google 文档,文档中有不少要点需要同步到 Notion,正常情况下我们需要开两屏幕。

Notion embed :新瓶老酒,真香-Linmi

不过话说回来,这种方式并没有比开双栏好,Windows 下分屏更是简单。

内嵌 Bilibili 视频

Bilibili 视频并不像 YouTube 视频那样,贴个链接就能快捷生成一个 Block,需要动动我们的的小手,做一些变化。

选择我们想要嵌入 Notion 中的 Bilibili 视频,点击分享按钮,再点击下面的「嵌入代码」,复制代码。

Notion embed :新瓶老酒,真香-Linmi

得到一下代码:

<iframe src="//player.bilibili.com/player.html?aid=8684450&cid=14306848&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
Notion embed :新瓶老酒,真香-Linmi

如上图所示,这种代码粘贴进 Notion 并不能显示出我们想要的视频效果,所以我们要进行处理一下。

我们截取src="链接"里面的链接,得到:

//player.bilibili.com/player.html?aid=8684450&cid=14306848&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true

这种链接嵌入 Notion 也是无效,再进行一下处理。

去掉 player 前面的// ,得到以下代码:

player.bilibili.com/player.html?aid=8684450&cid=14306848&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true

改格式也有第二种方案,就是在 // 前面加上 https,得到以下代码:

https://player.bilibili.com/player.html?aid=8684450&cid=14306848&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true

Notion 中创建一个 embed block,粘贴上面修改过格式后的链接,上面两种方式处理的链接均可。

Notion embed :新瓶老酒,真香-Linmi

每一次内嵌一个 Bilibili 视频我都要这么做?那得多麻烦。能不能快速得出我们想要的链接呢?

画质显示并不理想,只能显示 360P,那么如何才能在 Notion 中开启 Bilibili 的 1080P 画质?

解决方案当然有,就是复杂一些。

场景二:内嵌地图,出行好帮手

聊聊网页内嵌起源

追溯内嵌网页的历史,

如果你不信,可以试着打开 Chrome 的 DevTools(Mac 快捷键 Command + Shift + i Windows 快捷键 Ctrl+ Shift + i),通过定位,可以看到Notion 使用了什么?

Notion embed :新瓶老酒,真香-Linmi

哦?原来 Notion 是使用了 <iframe>

同样也要对比看 <embed>

不过 <iframe> 在前端似乎名声并不太好,要不说能耗过高,要不说不安全。

对与非技术人员,上面的问题也会真实的影响到我们体验,我个人也不建议随意的嵌入任意网页,安全问题,人人有责。

当然,效率的诱惑,只能一句真香表达。

更深入的了解 <iframe>,请点击此链接:https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/iframe

感谢阅读,请评分鼓励一下我!

感谢评价,欢迎关注我的 Twitter 哦。