新博客:https://yinl.fun
欢迎关注,同步更新

技术博客有时避免不了一些数学公式,利用Hexo建立博客后,最开始利用Google的公式库,但是得请求Google的网址,有时会被墙,所以不得不转战方向。让Hexo自己支持mathjax必然是一个省心的过程。然而事实并不省心。如果要建立一个支持数学公式的基于Hexo框架的博客,你得符合以下要求:

  • 博客:Hexo,博客的搭建可以看我之前的文章
  • 支持mathjax的markdown渲染器:hexo-renderer-kramed
  • 支持mathjax的Theme:NexT:(NexT使用文档,之前用的Archar,不过不支持mathjax)
  • markdown编辑器:Typora

安装渲染器

hexo默认的渲染器是marked,并不支持mathjax。kramed是在marked基础上修改的,支持了mathjax。你的hexo工程目录下的node_modules中可以找到对应的渲染器文件夹。同时在你的工程目录下用以下命令安装kramed。另外补充一个NexT配置中推荐的渲染器hexo-renderer-pandoc,功能很强大不仅可以渲染markdown,还支持textile、reStructedText等许多其他格式。具体参见官方教程

npm uninstall hexo-renderer-marked --save
npm install hexo-renderer-kramed --save
// npm install hexo-renderer-pandoc --save

如果你安装了hexo-math包,卸载再安装hexo-renderer-mathjax包

npm uninstall hexo-math --save
npm install hexo-renderer-mathjax --save

更新mathjax的CDN链接,打开node_modules/hexo-renderer-mathjax/mathjax.html

修改<scripts>标签

<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML"></script>

NexT开启mathjax

打开主题的_config.yml文件,找到math字段,新版的NexT主题支持两个数学渲染引擎mathjax和katex,这里我们使用mathjax

math:enable: true// 省略很多注释engine: mathjax

文章中开启mathjax标签

为加快渲染速度,渲染器只会在标签中有mathjax: true的文章中使用利用mathjax渲染。例:

title: hexo支持mathjax
date: 2018-08-31 08:33:08
tags: [Web,hexo,mathjax]
mathjax: true // 开启后才会渲染数学公式

Typoare

Typoare原生支持数学公式的输入和渲染,而且还支持本地图片导入的图片复制位置。

然后开启你的Typoare编辑器输入几串公式,看看效果吧~

转载于:https://www.cnblogs.com/SHOR/p/9581661.html

hexo支持mathjax相关推荐

  1. 如何在hexo中支持Mathjax

    第一步: 使用Kramed代替 Marked hexo 默认的渲染引擎是 marked,但是 marked 不支持 mathjax. kramed 是在 marked 的基础上进行修改.我们在工程目录 ...

  2. (二)设置hexo支持mermaid

    欢迎访问个人网络日志

  3. 在hexo中使用mathjax的方法

    欢迎光临我的个人主页 之前总是使用mathtype写公式然后再上传图片, 速度太慢了, 而且公式出错后不容易修改, 所以开始用mathjax, 但是原生hexo并不能直接渲染mathjax, 查阅资料 ...

  4. github page hexo博客gitee_GitHub+hexo快速搭建个人博客

    写博客的好处是我们用博客表达自己.升华自己. 平时学习新知识总是经常性会遗忘部分内容,使用过有道云,印象笔记,公众号,缺金社区,csdn,Github,码云等等记录了零零散散一些内容.所以准备使用he ...

  5. 【个人博客】Hexo个人博客搭建与配置详细教程 + Fluid主题 + Gitee发布

    文章目录 一.环境准备 1.1 安装 NodeJs 1.2 安装 Git 1.3 安装 Hexo 二.Gitee仓库搭建 2.1 Gitee账号注册 2.2 仓库搭建 三.Hexo博客搭建 3.1 基 ...

  6. 个人网站搭建保姆级教学:Hexo + Kaze + Gitee Pages

    前 言 建网站本身是一个很大的工程,涉及前端页面的搭建,网站数据的存储,还要购置服务器资源,甚至是后期的维护,过程相当繁琐. 不过如果仅仅是想搭建个人的网站,写写博客,想要美观,又不想操心太多和写博客 ...

  7. Hexo+Kaze+Gitee Pages 搭建静态博客网站

    前言 建网站本身是一个很大的工程,涉及前端页面的搭建,网站数据的存储,还要购置服务器资源,甚至是后期的维护,过程相当繁琐. 不过如果仅仅是想搭建个人的网站,写写博客,想要美观,又不想操心太多和写博客无 ...

  8. 使用Hexo免费搭建个人博客教程

    前言 现在各种互联网博客非常的,常见的如CSDN.简书.掘金.博客园等平台,这些博客平台做的都很好,可以直接在上面注册自己的账号写文章,发表的文章在百度.Bing等搜索引擎上也能收到,但缺点是受于平台 ...

  9. Hexo+Github: 博客网站搭建完全教程(看这篇就够了)

    本篇教程首次发布在个人博客:sunhwee.com,想要获得最佳阅读体验,欢迎前往,建议用电脑查看教程文档. 文章目录 阅读须知 博客开源 前言 第一部分 搭建 Hexo搭建步骤 1. 安装Git 2 ...

最新文章

  1. 再见 VBA!神器工具统一 Excel 和 Python
  2. c#编码规范【转载】
  3. win7开启休眠功能
  4. python中popen转变时区_python中的subprocess.Popen()使用
  5. android自定义滤镜,【Android】自定义View那点事(三)ColorFilter篇
  6. Create view failed with ORA-01031:insufficient privileges
  7. WebSocket 详解教程
  8. 应用:Xbox 360无线大屏幕控制器“WP 7”
  9. 来了!Python 官方发布了整套的中文PDF 文档(共27本)
  10. 【SpringBoot】微信点餐系统
  11. 微信小程序获取手机号用户拒接之后再掉接口微信返回40163
  12. SupeSite模板中的代码代表什么意思
  13. 快速上手UER-py
  14. HTML网页设计:CSS渐变、过渡
  15. CompletableFuture学习
  16. 第三方登陆实践之基于OAuth的FACEBOOK Web Login(最新版)
  17. 关于一些数学符号和概率的阐述;
  18. 微信小程序获取并展示公众号推文
  19. 动图形象理解深度学习卷积
  20. win10 KMS 激活

热门文章

  1. Unexpected state导致HMaster abort
  2. 2016全球大数据战略版图剖析(6):应用篇下
  3. 网络渗透测试作业:知道创宇
  4. qt样式表设置边框_QT样式表
  5. 项目文件模板-项目章程
  6. 网站长尾关键词对SEO优化起到什么作用
  7. Java平凡之路-成长篇(03) -SOA和EAI(架构)
  8. 福克斯车钥匙遥控失灵解决办法
  9. 【数据结构】B/B-树(目录树)
  10. 论文的研究方法实验方案技术路线