Original link: https://cyrusyip.org/zh-cn/post/2022/05/30/hugo-multilingual/
Recently, I saw everyone discussing blogs in the statistics capital, which aroused my tossing heart again. I plan to fill a big hole: change the Chinese blog to a bilingual blog. I first created a new Git branch to toss, and then merged into the master branch after success. The following is the detailed tossing process.
Use the jane theme instead
The even theme I used before has been in disrepair. The author has not come out to deal with Issue and Pull Request for more than a year. The multi-language configuration of this theme has no detailed description and configuration, so I switched to the jane theme . This theme is updated in a timely manner. If there is a bug, it should be easy to fix. The jane theme has ready-made multi-language configurations that can be copied, and the mobile page also has a directory.
This time, use git submodule to add the theme, so that you don’t have to add a bunch of files in the theme to the git repository.
|
|
Copy these files for configuration:
|
|
The bilingual configuration looks like this:
|
|
Change the content directory to this:
|
|
URL redirection
After the website is changed to bilingual, the website link is different from the original one, and the old link needs to be redirected to the new link. The Chinese blog link is now more zh-cn , it used to be like this: https://cyrusyip.org/post/2020/10/02/ubuntu-compile-goldendict/ , now it will be changed to https://cyrusyip.org/zh-cn/post/2020/10/02/ubuntu-compile-goldendict/ . The RSS link should also be changed. I’m using Vercel to deploy the site, so I modified vercel.json to use regular expressions to redirect links. It is best to close the site before changing links and migrating comments to avoid two comments on the same article.
|
|
The official documentation of Vercel redirection does not describe which regular expressions it supports, so I tried it myself with reference to Yihui’s configuration . If you are struggling with regular expressions like me, you can use the regex visualizer to help you understand. The modified full vercel.json is here . Once done, you can use Google Search Console to see if there are any wrong links.
Change internal links
The links in the source file of the website should also be changed, for example: [本站的某文章](/post/2021/01/01/hi/) should be changed to [本站的某文章](/zh-cn/post/2021/01/01/hi/) , https://cyrusyip.org/post/xxx to https://cyrusyip.org/zh-cn/post/xxx .
Use ripgrep to find the link in the source file that needs to be changed.
|
|
Fix link.
|
|
The remaining fish that slipped through the net were changed manually.
RSS link to update blog list
My blog is included in the two blog lists below.
- shidenggui/bloghub: A group of free and interesting souls will eventually meet here | Independent personal blog recommended navigation
- timqian/chinese-independent-blogs: List of Chinese independent blogs
So in the past, I submitted a pull request to change the RSS link. In fact, it’s okay to not change, the old link will redirect to the new link.
Migration Comments
The comments on this site are bound to the article link, because the article link has changed, so point the comment to the new link, otherwise you will not be able to see the existing comment. The commenting system on this site is Disqus and utterances.
Disqus
Disqus comments are modified using URL Mapper . URL Mapper uses a .csv file to migrate comments, I first got a .csv file from Disqus. Excerpts are as follows.
|
|
Add a comma and a new link to it.
|
|
Then upload it to Disqus to migrate the comments. Disqus will merge the article comments on both sides of the comma and move the comments to the link on the right. The official documentation says it may take 24 hours to complete the migration, in fact I migrated 82 reviews and it was done in an instant. Modifying each line of .csv is the same operation: copy the entire line, add commas, paste, and add zh-cn , so use Vim’s q command to record an operation, and then you can batch changes. The following is the operation video (the speed is relatively slow, you can watch it at 2x speed).
Disqus has other migration methods , but I think URL Mapper is the safest.
utterances
utterances use GitHub Issues to save comments. The link to the article titled “post/2021/10/11/build-aur-wps/” is ” https://cyrusyip.org/post/2021/10/11/build-aur-wps/ “. Comments can be migrated by modifying the Issue title using the GitHub CLI.
Save the Issue title and number and open it with Vim.
|
|
Issue information is like this:
|
|
Here we use Vim’s q command to batch process the above content into:
|
|
Then execute :%!bash in Vim, and execute the above command with BASH. utterances can only move comments, not merge comments. It’s a good idea to close the site before moving to avoid two comments on the same article.
increase title level
Before I wrote articles, I used Markdown first-level headings first, but according to MDN and Bing Webmaster Tools, using multiple <h1> headings is wrong.
Use only one
<h1>per page or view. It should concisely describe the overall purpose of the content.Using more than one
<h1>is allowed by the HTML specification, but is not considered a best practice. Using only one<h1>is beneficial for screenreader users.— https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements#usage_notes
These pages have more than one
<h1>tag. Multiple<h1>header tags might confuse search engine bots and website’s users. It is recommended to use only one<h1>tag per page.—SEO Reports from Bing Webmaster Tools
This is a rare toss, so let’s rectify it completely. Still using regular expressions to solve:
|
|
The above regular expression looks for “lines starting with # , and it has 1 blank line above and below it”, and then adds # in front of the found content, that is, adds 1 heading level. After processing, manually check with VS Code, and submit a commit if there is no problem. You can use VS Code to search ^# to see if there is anything missing.
The :HeaderIncrease of preservim/vim-markdown and the --shift-heading-level-by=1 option of pandoc can also be used to increase the heading level. But these two tools have problems. vim-markdown will treat the last two lines of the YAML content of the Markdown file as the title, and pandoc will modify the YAML content. It’s better to write your own regular expressions honestly.
add favicon
Use https://realfavicongenerator.net/ to make my avatar a favicon and put it in the /static folder.
Jane themed questions
Switching from the Even theme to Jane, still ran into some minor issues.
- There is no total number of articles function, even the theme is there (solution: use the
tree content/command to view the number of files in the blog directory). - Bu Suanzi traffic statistics still display Chinese under the English blog.
- You cannot set different author names for different languages, for example: the author of the Chinese blog is “Ye Xun”, and the author of the English blog is “Cyrus Yip” (temporary solution: write the author’s name in both Chinese and English names, that is, “Cyrus Yip Ye Xun” ).
- When deploying a blog with Vercel, the
params.gitInfofunction will fail, but local deployment will be fine. I don’t know what’s going on.
There is no end to modifying the website. Just bear with these small problems. If you are too entangled, you will not have time to write articles. The content of the blog is the most important, as long as the function can be used and the appearance is not ugly.
To-do matters
Here are some things I want to do. Dig a hole first, See if anyone can bury me .
- Auto backup utterances
- Auto Backup Disqus Comments
Materials and Tools
- E Personal Experience | blogdown: Creating Websites with R Markdown (Xie Yihui’s blog writing experience)
- iggredible/Learn-Vim: Learn Vim (the Smart Way )
- ziishaned: Learn regex the easy way
- regex visualizer (regular expression visualization tool for understanding regular expressions, you can find a lot on Google)
- vimtutor (Vim’s official tutorial, learn this first, then learn-Vim)
This article is reprinted from: https://cyrusyip.org/zh-cn/post/2022/05/30/hugo-multilingual/
This site is for inclusion only, and the copyright belongs to the original author.