问题描述
我正在开发一个将Next.js(静态/预渲染)与Netlify CMS结合使用的网站,以管理内容并运行博客。
对于每个博客帖子,我都有一些字段(例如标题,作者等)是字符串字段,并且我有一个Markdown字段,其中包含来自所见即所得编辑器的丰富文本,用于显示我的帖子的全部内容,供贡献者选择帖子的结构,添加图片等。
我需要能够将youtube视频嵌入到该富文本格式中(贡献者必须能够将视频添加到帖子中的任何位置)。知道我该怎么做吗?
谢谢
解决方法
如果您想让它变得简单,可以建议您的团队直接将youtube视频直接嵌入Markdown中,那么我可以使用危险的SetInnerHTML进行正确的解析。
通过右键单击视频获取此代码:
<iframe width="1680" height="690"
src="https://www.youtube.com/embed/DyY9Wpfajqo" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media;
gyroscope; picture-in-picture" allowfullscreen></iframe>
要将视频嵌入到文本编辑器中,您需要创建一个自定义小部件,您可以在此处找到该食谱: