shokax主题安装及避坑

shokax主题安装及避坑

本文字数:860  阅读时长:2分钟

访客数:加载中... | 阅读量:加载中...

因为 shoka 主题很久没维护了,主题相关 CDN 链接访问太慢导致主题加载过于缓慢 (不知道都以为网站打不开了┭┮﹏┭┮),因此把主题换成了其精神续作shokax (作者维护的很勤奋的)

主题安装

主题安装可以参考这个文档,建议直接使用 ShokaX 即食罐头,因为使用 git 安装 ShokaX 会出现很多奇奇怪怪的 bug,而且还不知道是啥原因。相关配置参考这个文档

java
git clone https://github.com/theme-shoka-x/shokax-can --depth=1
cd shokax-can
pnpm install
hexo s # 如果报错更换为 pnpm dlx hexo s

如果你使用 hexo d 上传到服务器上面报错找不到 git,记得下载 hexo-deployer-git

java
npm install hexo-deployer-git --save

相关避坑

我最开始是想用 git 安装的,因为原主题 shoka 就是用 git 安装的,而且有些需要更改的代码都在主题里面,而使用 shokax 即食罐头安装的 theme 文件夹里面只有一个.gitkeep 文件。但是实在是找不到 git 下载的 shokax 怎么修 bug (代码块不渲染),因此最后还是用了即食罐头。

而有关上面的如何更改源码我也再次给出方案,比如我想要更改主题的随机图片 API(因为新浪图床的防盗链导致网站原本的轮播图片无法正常显示),你可以直接把 blog 文件夹放进可以全局搜索字符的软件里面 (比如 IDEA),或者打开你博客文件夹下的

java
\node_modules\.pnpm\hexo-theme-shokax@0.4.16_chalk@4.1.2_chokidar@3.6.0_react-dom@16.14.0_react@16.14.0__react@16.14.0_typescript@5.6.3\node_modules\hexo-theme-shokax\_config.yml

更改 image_server 的值为你的随机图片 API,我这里用的是樱花图片 API。其实 api 或许有更好的选择,不过按照加载速度来说还是推荐直接樱花。

java
image_server: https://www.dmoe.cc/random.php

在解决完轮播图片后,发现原本文章的图片无法正常显示了,一开始我还以为是图片类型不支持,还试了一下 jpg 图片,发现还是不行,但是当我用其他图床的图片时却又能正常显示。[已解决,是防盗链问题!]

微博

gitee

github

你会发现看不见 gitee 的图片,我也不知道什么原理,但是 gitee 图床的图片在 shoka 可以正常显示,emmm,所以最后换了 github 图床,如果不会可以看教程

修改这个 header.pug 文件,有些主题是 header.ejs 之类的

java
\node_modules\.pnpm\hexo-theme-shokax@0.4.16_chalk@4.1.2_chokidar@3.6.0_react-dom@16.14.0_react@16.14.0__react@16.14.0_typescript@5.6.3\node_modules\hexo-theme-shokax\layout\_partials\header.pug

在末尾添加

java
<meta name="referrer" content="no-referrer" />

这样就可以看到图片啦,嘿嘿!

评论配置

这里特意提醒一下配置评论,如果你正确的配置了评论,即你可以打开 waline,在本地也能看到配置的 waline,但是部署在网站上却不显示你配置的 waline 时,请注意清理你的浏览器数据,因为你访问的可能是你之前的缓存!!!我就被这玩意坑了一个多小时┭┮﹏┭┮。