Site Bilingual Modification

This site is now available both in Chinese and in English.

This site is now available both in Chinese and in English.

AI-generated excerpt

The author discusses their decision to add an English version to their blog despite feeling uncertain about their fluency in both Chinese and English. They explain their approach to implementing bilingualism using Hexo, utilizing separate configurations and directories for each language's site. They detail the creation of language-switching functionality and address the challenge of directing visitors to the correct language version. The author concludes by expressing uncertainty about blogging in English but remains intrigued by the possibility.

Honestly, I don’t know why I have decided to add an English version of my blog — I cannot write fluently in Chinese, let alone in English; I guess it’s only because it’s interesting and also, I want to see if adding another language is feasible.

Hexo has a limited i18n system which can display a post in multiple languages, yet pages generated by themes are only available in single language. So I took a treacky approach, which is to generate both Chinese site and English site within the same repository, with each site using its own configuration, theme configuration, the source directory, and the public directory; and the rest of the contents required to generate sites such as the scaffolds directory and the scripts directory are shared between these sites. Thus, even though the Chinese site and the English site together is coherent, these are two indivisual sites with each static resources placed in its own public directory. To facilitate site generation, I wrote several scripts which are capable of cleaning up intermediates, including some of the same resources in the two source directories of both sites, switching the language used to generate the site based on parameters. You may have noticed that there is an “info icon” (It has moved to the lower right corner as a “language button” for now.) in the upper right corner of some posts (for example, this one) and pages. It indicates that the page you are reading is available in multiple languages, and you can switch to other versions just by clicking that icon. This feature is supported by a metadata generator and filter, an injector, and a broswer-end runtime script that I wrote. When I intend to write two language versions of a post, I provide an array of paths (each path represents the post in a specific language) in the front-matter, embed the metadata in the page via the metadata generator and filter, read it in the browser via the broswer-end script injected by the injector, and then display the “info icon”. The broswer-end script I mentioned is a script that I use to implement specific features and perform modifications dynamically. This script itself contains some prompt strings, so I also wrote simple i18n functions to provide these strings both in Chinese and in English. Now the website has two language versions, each has a root of /zh-CN/ or /en/. However, the previous links that search engines had indexed does not inlude the “language mark”, so I also wrote the index and 404 page for the entire site to direct visitors to the correct page.

Basically, this is how I implemented a bilingual Hexo site. Maybe I’ll try to blog in English. Maybe.

The End

  • Title: Site Bilingual Modification
  • Author: Hollis
  • Created at : 01-08-2024 03:06:34 pm
  • Updated at : 03-22-2024 07:31:32 pm
  • Link:
  • License: This work is licensed under CC BY-NC-SA 4.0.
On this page
Site Bilingual Modification