hexo主题进阶配置以及遇到的问题


搭建好博客后,我尝试将在CSDN写的博客迁移到我的个人博客中,发现了一些问题。

一、关于hexo不支持latex渲染的问题

有的主题已经进行过渲染,可以正常使用,对于没有渲染的主题,可以使用以下方法:

方法1

hexo根目录\scaffolds\post.md目录中添加如下代码,这样就能保证latex以后会在所有文章中生效:

<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>

方法2

使用npm install hexo-renderer-markdown-it-plus --save安装插件,并在hexo配置文件中添加对应的配置:

# _config.yml

markdown:
  render:
    html:  
      plugins:
        - markdown-it-abbr
        - markdown-it-container
        - markdown-it-deflist
        - markdown-it-emoji
        - markdown-it-footnote
        - markdown-it-ins
        - markdown-it-mark
        - markdown-it-sub
        - markdown-it-sup
        - markdown-it-task-checkbox

二、图片无法显示问题

第一反应就是路径问题,因此我调整了图片的路径。多次尝试以后发现了一个事情:hexo资源路径的根目录是hexo g生成的public目录,其中图片的位置是public/img/目录下,md文件在public/posts/目录下,因此在写图片路径的时候,要写成../img/xxx.png的形式。

三、字体更改问题

主题所提供的字体往往不够,这里提供一种更改字体的方法。

  1. hexo根目录的source文件夹中新建css、font文件夹
  2. 下载一个没有版权的字体,可以去无版权字体下载自己想要的字体到font文件夹中
  3. 配置css文件:
@font-face {
  font-family: 'fzkt'; //fzkt是字体的名字,可以换
  src: url('../font/fzkt.ttf') format('truetype');//format根据你下载下来的字体的后缀就可以确定
}
  1. 修改主题配置文件,找到对应的位置并作出修改
# Inject
# Insert the code to head (before '</head>' tag) and the bottom (before '</body>' tag)
# 插入代码到头部 </head> 之前 和 底部 </body> 之前
inject:
  head: # head一般引入css文件
    - <link rel="stylesheet" href="/css/custom-font.css?1">
    # href链接?后边的参数随便,当更改文件时再随便换一个就可以,这样可以避免使用本地缓存,使修改及时生效
  # bottom: 一般引入js文件

四、配置搜索

npm install hexo-generator-search --save安装插件,然后再主题配置文件中添加如下参数:

search:
  path: search.xml
  field: post
  content: true
  template: ./search.xml

官方文档说在root中修改参数,我在blog目录修改时发生了错误,就在主题配置文件中修改,然后就可以运行了。

五、集成gitalk评论

  1. npm i --save gitalk安装gitalk
  2. 新建个一GitHub仓库
  3. 创建GitHub Application,可以在这里创建
    其中Application name写仓库名字就可以,Homepage URLAuthorization callback URL填写你博客的地址,最后勾选Enable Device Flow就创建完成了。此时可以生成Client secrets

准备工作做好了,接下来去修改主题配置文件即可:

gitalk:
  client_id: '第3步中创建的GitHub Application,里面的client_id'
  client_secret: '也是第3步中生成的client_secret'
  repo: '仓库名字'
  owner: 'GitHub用户名'
  admin: ['GitHub用户名']
  option: # 不用填

若配置后出现 未找到相关的issue评论,请联系xxx初始化创建 的问题,登录github账号即可。要注意的是,此时要预览效果不能仅在本地服务器,需要部署到GitHub才能看到效果。

一百、慢慢更新

  • 8
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值