使用Ghost博客近半年,对于Casper这个主题一直非常喜欢。最新捣鼓了一下它的主题语言配置,将英文改为了中文,在这里分享一下。

先说这个功能是做什么的。这个语言配置,就是把界面上的相关菜单、链接的文字从英文改为你指定的文字,例如中文。

具体过程,在Ghost官方文档上有详细的说明。

1.添加locales文件夹

在/casper目录下再添加一个locales文件夹,文件夹里新建zh.json文件,这个zh就是中文的缩写。

2.翻译主题文字

博客页面上相关的文字都是英文的,我们可以在zh.json中去设置对应的英文。具体如下:

{
    "Back": "返回",
    "Newer Posts": "新的博文",
    "Older Posts": "旧的博文",
    "Page {page} of {pages}": "Page {page} of {pages}",
    "Subscribe": "丁阅",
    "Subscribe to {blogtitle}": "Subscribe to {blogtitle}",
    "Subscribed!": "Subscribed!",
    "with the email address": "with the email address",
    "Your email address": "Your email address",
    "You've successfully subscribed to": "You've successfully subscribed to",
    "A collection of posts": "A collection of posts",
    "A collection of 1 post": "A collection of 1 post",
    "A collection of % posts": "A collection of % posts",
    "Get the latest posts delivered right to your inbox": "Get the latest posts delivered right to your inbox",
    "Latest Posts": "最新博文",
    "<a href='{url}'>More posts</a> by {name}": "<a href='{url}'>More posts</a> by {name}",
    "No posts": "无博文",
    " (Page %)": " (Page %)",
    "Read More": "阅读更多",
    "Read <a href='{url}'>more posts</a> by this author": "Read <a href='{url}'>more posts</a> by this author",
    "See all % posts": "See all % posts",
    "Share this": "Share this",
    "Stay up to date! Get all the latest & greatest posts delivered straight to your inbox": "Stay up to date! Get all the latest & greatest posts delivered straight to your inbox",
    "This post was a collaboration between": "This post was a collaboration between",
    "youremail@example.com": "youremail@example.com",
    "1 post": "1 post",
    "% posts": "% posts",
    "1 min read": "1 min read",
    "% min read": "% min read"
}

所有冒号后面的英文语句,都可以改为中文,这样在我们设置完成后,页面中相关的用词就会变为中文。

3.设置博客语言

在博客后台管理中,将publication language设置为zh,并点击保存。

4.确保所有模板文件存在

为了确保capser主题的所有文字都可以被转化为中文,需要把对应的模板都拷贝到主题文件夹下面(如果不存在)。

  1. subscribe.hbs - 保存到/content/themes/casper,点击复制
  2. pagination.hbs - 保存到/content/themes/casper/partials,点击复制
  3. subscribe_form.hbs - 保存到/content/themes/casper/partials,点击复制

5.使用{{t}}标识符

做好以上几步后,现在需要设置对应的文字来进行转换。比如,我想把文章详情页的Read More改为查看更多,那么就需要修改/casper/partials/byline-single.hbs的内容。


...
<div class="post-full-footer-right">
    <a class="author-card-button" href="{{url}}">{{t "Read More"}}</a>
</div>
...

6.设置html语言

修改default.hbs,把默认语言设为zh,也就是我们在步骤3中设置的变量。

...
<html lang="{{@site.lang}}">
<head>
...

7.重启Ghost

以上设置完成后,重启Ghost即可看到设置的效果。