Fryboyter

Some articles are now offered in multiple languages

In the last few years I have been thinking about publishing at least some articles in English from time to time. So far, however, the technical implementation was too cumbersome for me. But with Hugo it’s done pretty easy, as I noticed today.

The first thing to do is to add the following entries to the configuration file config.toml.

DefaultContentLanguage = "de"

	[languages]
    [languages.de]
        languageName = "Deutsche Version"
        weight = 1
    [languages.en]
        languageName = "English version"
        weight = 2

The first line specifies that de is the default language. The rest defines the existing languages, gives them a name and a weighting (the lower the more important).

Now we create a new article. Let’s just call the file manche-artikel-nun-englisch.md. Let’s assume that the article is important enough to be published in English as well. So we create another article and name the file manche-artikel-nun-englisch.en.md. As you can see the title has been extended by a .en. Hugo now automatically understands that the article with .en is the English version and the other one is the German version.

But what if someone opens the German version but doesn’t understand German? There should be a kind of switch available. For this one can use for example the following code.

{{ if .IsTranslated }}
	{{ range .Translations }} | {{ .Language.LanguageName }} {{ end}}
{{ end }}

This checks whether the article is also available in another language. If so, a link to the corresponding versions will be shown. If not, nothing is displayed. I put this code on fryboyter.de under the main heading of all articles. If the link “English version” appears at an article, I wrote the article in English as well. Currently one will find this link only at this article for the moment. Gradually there will be more articles in German and English (also older ones) available.

Fryboyter is now generated with Hugo

So far I have used the CMS Bolt for fryboyter.de. Basically I am satisfied with it. But somehow I have lately less and less desire to install the updates.

Therefore I looked at various tools in the last weeks, with which one can create static web pages. So you don’t need PHP, no database, etc. Thus also the annoying updating of the side is unnecessary.

Finally I ended up with Hugo . There are basically two reasons for this. On the one hand Hugo consists of only one file and on the other hand the static pages are created very fast.

But what kept me busy was how to create the website when I added new articles and how to upload it to the webspace.

In the Lab of Uberspace there is a manual how to install Hugo. Hugo runs as a service in the background and recreates the page as soon as something has changed. But as a consequence I have to take care of possible updates as soon as possible. It would be better if Hugo is started only to create the page and then shut down again. The easiest way would be to connect to the webspace via SSH, create the new article and then run Hugo manually. Simple? Yes. Cumbersome? Definitely. So it’s out of the question.

The solution is, as so often, Git. First you create a directory on the webspace outside the document root. In this directory you create a so called bare-respository with " git init –bare". In comparison to a normal repository, this has no working tree. If you now look at the directory again, you will find the subdirectory “hooks” there. With these hooks certain tasks can be automated. For example, commands can be executed when the repository has received new data. For this you create the file post-receive in the directory “hooks” and add the following data and make it executable.

GIT_REPO=$HOME/repository/fryboyter.git
TMP_GIT_CLONE=$HOME/tmp/git/fryboyter
PUBLIC_WWW=/var/www/virtual/$USER/html/fryboyter
git clone $GIT_REPO $TMP_GIT_CLONE
~/bin/hugo -s $TMP_GIT_CLONE --cleanDestinationDir -d $PUBLIC_WWW
rm -Rf $TMP_GIT_CLONE
exit

This clones the contents of the repository into a temporary directory. Then Hugo deletes the already published website and recreates it. Then the temporary directory is deleted.

What is still missing is the data with which the website is created. These are created on your own computer. When this is done, you change to the respective directory and execute the following commands.

git init
git add .
git commit -m "Beschreibung des Commit"

With this you create a local repository, add all files of the directory and create a commit. If you upload it with “git push $adresse_des_repository” the file post-receive will be executed and the website will be created automatically. To update the page in the future, create / change the file in the local repository, create a new commit and upload the changes using git push.