Hexo的next主题实现双语功能
前言
前不久,给博客添加了Google Analytics,通过数据显示,发现我这小破站寥寥无几的流量大部分竟然是国外朋友贡献的,心中便想着将博客国际化—-搞个英文版本.说干就干,经过我的一番折腾,终于给搞出来了,但我要说明一下文章的内容是要自己转换为英文,具体效果大家可以点击下面链接前往查看
诉求
首先说说我对英文网站的诉求:
- 英文网站要与原网站的结构外观基本保持一致(我看到有的小伙伴直接换支持双语的主题了,我可不想让自己的心血白流)
- 我希望原网站和英文网站有个切换按钮,很容易切换
步骤
基本配置
在hexo本地目录创建英文文件夹(名字自定义),我的是en
复制hexo目录的内容(node_modules除外)到en文件夹,复制后en文件夹如下
安装相关插件,在en文件夹使用命令
npm install |
修改en文件夹中_config.yml文件,将下图中的language改为en,可以比对着hexo本地目录的_config.yml文件将中文改为相应的英文(如下图的title,subtitle等)
修改hexo目录next主题配置文件_config.yml文件,找到menu字段,增添language菜单,注意链接要换成自己的
language: https://en.idefun.com/ || fa fa-language |
修改next主题文件夹下的languages中的zh-CN.yml,找到menu,添加language:English
可以在hexo目录使用hexo s查看效果
同理,修改en文件夹中next主题配置文件_config.yml文件,找到menu字段,增添中文菜单
中文: https://www.idefun.com/ || fa fa-language |
修改en文件夹下themes中next主题文件夹下的languages中的en.yml,找到menu,添加language:中文
可以在en目录使用hexo s查看效果
部署配置
下面提供两种部署方法,第一种不用再创建仓库,第二种要再创建仓库,若想要给英文博客绑定域名建议选择第二种,关于创建仓库及打开github page就不多说了
方法一
原理
在en文件夹生成英文博客,并将生成的public文件夹中的内容复制到hexo目录下的public文件夹中的en文件夹,推送时只需在hexo目录下推送
实现
使用下面命令即可实现
hexo clean && hexo g && cd en && hexo clean && hexo g && cd ../ && cp -r en/public/. public/en/ && hexo d |
可以写成shell脚本,我这里提供一份简单的脚本供大家参考
下载后改后缀为sh即可双击运行
方法二
原理
在en文件夹生成英文博客,将生成英文博客推送到一个新的仓库,需要分别推送,可以编写相应脚本来简化操作
实现
修改en文件夹在_config.yml文件,找到deploy字段,修改为自己的仓库即可
备注
为大家提供一种思路,希望有帮助
