Hexo启用Markdown内嵌HTML的配置方法
发布于
# 笔记
想着丰富下文章,实在不知道写什么,又偶然看见腾讯微博的备份记录,打开看看不禁让人感叹时间飞快恍如昨日。
遂计划将备份记录作为一篇文章上传至 air1 ,不过 Hexo 框架兴许为了安全考虑并没有使能 md 文章内嵌 HTML ,需要修改_config.yml文件才能实现。
修改配置文件后,直接复制html代码进入md文件后,又存在内容被转义或导致全站背景/布局异常等问题。以下是解决过程。
- 启用 Markdown 中的 HTML 渲染
在站点根目录的_config.yml中,找到或添加 marked 配置项,并确保开启 HTML 支持:
# 启用 Markdown 中的 HTML 渲染
marked:
gfm: true
breaks: true
html: true # 允许 HTML 标签
sanitize: false # 禁用安全过滤(关键)
smartLists: true
smartypants: true
注意:sanitize: false 是关键,否则即使写了 HTML 也会被过滤掉。
- 更安全的方案:使用
<iframe srcdoc>
为避免污染全局样式、破坏主题布局,强烈建议优先采用 <iframe> 内嵌方式:
<iframe
srcdoc="
<!DOCTYPE html>
<html><head><meta charset='utf-8'><style>/ 局部 CSS /</style></head>
<body>
<!-- 微博内容 -->
</body></html>"
sandbox="allow-same-origin"
style="width:100%; height:600px; border:none;"
</iframe>
此方法将内容完全隔离在独立文档上下文中,既安全又干净,不会影响原有样式。