code-backups/node.js/hexo/multi-lingual-hexo-site-setup.md

How to Create a Multi-lingual website with Hexo and Minos theme

Screenshots of the finished product (I haven't translated all of the things in these): 1 2 3

Step 1: Basic setup

npm install hexo-cli -g
hexo init hexo_dir
cd hexo_dir
git clone --depth=1 https://github.com/ppoffice/hexo-theme-minos.git themes/minos

So far Minos is the theme that shows only the posts for currently selected language. Even the default theme shows all posts from all languages (as of writing this post), which is frustrating. I'll test more themes and would probably list them here if I find more i18n friendly themes.

Step 2: Edit configs

I am localizing my content into Bangla/Bengali (Bangladesh), so I'm using bn-bd as language code. Use your own language code for your own use case.

Edit hexo_dir/config.yml and set these:

language: ['en', 'bn-bd']

theme: minos

It will set English as the main and default language and bn-bd as secondary language.

Now we'll edit theme configs. Prepare a copy of themes/minos/_config.yml:

cp themes/minos/_config.yml.example themes/minos/_config.yml

Now we'll create language strings for our language. Check to see if your language is listed there already in hexo_dir/themes/minos/languages/. If not, create yml file for your language:

cp themes/minos/languages/en.yml themes/minos/languages/bn-bd.yml

Now edit hexo_dir/themes/minos/languages/bn-bd.yml to reflect your language. e.g. mine looks like:

name: 'Bangla'
common:
  archives: 'আর্কাইভ'
  category: 'শ্রেণী'
  tag: 'ট্যাগ'
  categories: 'শ্রেণী'
  tags: 'ট্যাগ'
nav:
  next: 'পরবর্তী'
  prev: 'পূর্ববর্তী'
  search: 'খোঁজ'
  toc: 'সূচীপত্র'
article:
  read_more: 'বিস্তারিত'
  read: 'সময় লাগবে পড়তে'
  about: 'মোটামুটি'
  words: 'শব্দ'
  comments: 'মন্তব্য'
  contents: 'বিষয়বস্তু'
search:
  hint: 'কিছু টাইপ করুন...'
insight:
  hint: 'কিছু টাইপ করুন...'
  posts: 'পোস্ট'
  pages: 'পাতা'
  categories: 'শ্রেণী'
  tags: 'ট্যাগ'
  untitled: '(শিরোনামহীন)'

Create hexo_dir/themes/minos/_config.en.yml and put something like:

menu:
  Archives: /archives
  Categories: /categories
  Tags: /tags
  Schedule: /schedule
  About: /about
  Friends: /friends

Now copy that confg (cp themes/minos/_config.en.yml themes/minos/_config.bn-bd.yml) and translate. e.g.

menu:
  আর্কাইভ: /bn-bd/archives
  ক্যাটাগরি: /bn-bd/categories
  ট্যাগ: /bn-bd/tags
  সময়সূচী: /bn-bd/schedule
  সম্পর্কে: /bn-bd/about
  বন্ধুরা: /bn-bd/friends

Step 3: Preparing content

As a test, you should have a hexo_dir/source/_posts/hello-world.md. Now create a copy of it inside a folder that's named after your language code:

mkdir -p source/_posts/bn-bd
cp source/_posts/hello-world.md source/_posts/bn-bd/hello-world.md

Now translate that hexo_dir/source/_posts/bn-bd/hello-world.md into your language.

The idea is to create a directory with language code just beside the content .md file and then put a copy of the content into it and translate.

For pages, the same thing goes. Just create a directory with your language code and then put the translated .md file inside it. Example:

# this should create `hexo_dir/source/about/index.md`
hexo new page About -s about
mkdir -p source/bn-bd
cp /source/about /source/bn-bd/about

Step 4: Try it!

Generate the site files:

hexo generate

Launch the server:

hexo server

There is a Language dropdown at the bottom of the page. Change it and test it.

Source:

• https://medium.com/walkout/build-a-multi-lingual-blog-with-hexo-937107866d31
• https://github.com/ppoffice/hexo-theme-minos