hexo使用小记

1. 常用的命令

hexo new tile_of_poster
hexo g # hexo generate
hexo s # hexo server
hexo d # hexo deploy

正常情况下要推送到网站使用,随后即可到www.github.io查看网页了。

hexo clean
hexo g
hexo d

要备份代码到github时

git push origin hexo # 因为master分支是用于备份网页文件的

2. 常见问题

  1. 数学公式
    在hexo中渲染数学公式需要Mathjax,可以参考hexo下LaTeX无法显示的解决方案
    [NexT]配置MathJax 参考这里也可以,注意per_page配置为true时,要在blog中主动带上mathjax: true
  2. hexo中支持的一些语法可以参考Hexo Markdown 简明语法手册
  3. Mathjax英文可以参考MathJax basic tutorial and quick reference,中文翻译参考Mathjax与LaTex公式简介
  4. Mathjax的docs,可以查到相关的语法支持情况hMathJax TeX and LaTeX Support
  5. 当前markdown渲染引擎不支持todolistPort todo list support from marked,有需要的话未来可以自己合并。
  6. 使用kramed需要在文档头中加mathjax: true
  7. Katex中不支持\label\eqref,目前站点渲染这个也无法做到,但Mathjax应该可以做到。
  8. 代码不让它显示行数序号数字怎搞
  9. 取消hexo中的目录编号,可以使用vs中的toc功能加编号会更好些。
  10. 如何备份hexo的blog源代码
    可以参考使用hexo,如果换了电脑怎么更新博客?
    如果已经完成了blog的编写,可以在github上面新建一个hexo分支,并设置为默认分支,随后将远程分支下载下来,并用blog的源文件全部替换掉,在push即可。这样就可以将源代码备份到Github上面的hexo分支,而网页文件存储在master分支。
  11. NexT 自带的语法高亮插件支持的语言列表 注意shell应该使用sh会比较统一一些。
  12. TypeError: Cannot set property ‘lastIndex’ of undefined github
  13. 用Markdown写Hexo博客时如何转义竖杠 | ? 使用HTML字符修改
  14. 如何在hexo使用图片和提供附件下载 提供附件下载功能,其实就是开启在开启post_asset_folder后,在同名文件夹下面放附件就可以了,类似于图片

3. 添加gitalk评论系统

主要参考了以上两个教程,但事实上目前(2019.4)在next主题中都已经集成了gitalk的相关配置了,直接启用即可,不需要像第一个blog那样需要完整添加很多配置文件。以后可以方便添加评论然后重新记录了。

  1. 先在github上注册新应用
    参数说明

    Application name: # 应用名称,随意
    Homepage URL: # 网站URL,如https://asdfv1929.github.io
    Application description # 描述,随意
    Authorization callback URL:# 网站URL,https://asdfv1929.github.io
  2. 点击注册后,页面跳转如下,其中Client ID和Client Secret在后面的配置中需要用到,到时复制粘贴即可

  3. 在主题配置文件next/_config.yml中添加如下内容:

    gitalk:
    enable: true
    github_id: astraywu # Github repo owner
    repo: astraywu.github.io # Repository name to store issues.
    client_id: Client ID # Github Application Client ID
    client_secret: Client Secret # Github Application Client Secret
    admin_user: astraywu # GitHub repo owner and collaborators, only these guys can initialize github issues
    distraction_free_mode: true # Facebook-like distraction free mode

4. next主题优化

4.1. 添加tag

hexo 下的分类和表签无法显示,怎么解决?

  1. 给文章加tag

    title: 一个人的狂欢
    date: 2016-11-11 13:09:04
    tags: [journal,think]
  2. 命令行输入hexo n page tags,会在sources/tags生成index.md文件

  3. 编辑index.md文件

    title: tags
    date: 2016-11-11 21:40:58
    type: "tags"
  4. 在主题配置文件themes\next\_config.ymlmenu项目下打开tags

    menu:
    home: / || home
    #about: /about/ || user
    tags: /tags/ || tags
    #categories: /categories/ || th
    archives: /archives/ || archive
    #schedule: /schedule/ || calendar
    #sitemap: /sitemap.xml || sitemap
    #commonweal: /404/ || heartbeat

4.2. 浏览页面的时候显示当前浏览进度

4.3. 添加顶部加载条

4.4. 本地搜索

4.5. 统计功能,统计功能,显示文章字数统计,阅读时长,总字数

4.6. 允许代码段拷贝

这里要使用npm install hexo-symbols-count-time --save

4.7. 给代码块添加复制功能

4.8. 修改行间距

文章内容较多时,next原来的间距太大了,要上下来回滚动。
修改themes\next\source\css\_variables\custom.styl,添加

$line-height-base           = 1.5

5. ref

  1. Hexo的Next主题详细配置
  2. 精于心,简于形 Next官网
  3. GitHub+Hexo 搭建个人网站详细教程 知乎的hexo建站笔记
  4. 利用vscode插件与git hook提升hexo编写部署体验
  5. Hexo博客搭建之在文章中插入图片
  6. 绝配:hexo+next主题及我走过的坑 搭建更多功能
  7. Hexo+Next主题优化
  8. Hexo-Next-主题优化(一) 应该是上面的ref,带有图片演示
  9. hexo指南
0%