Manage Page with Bissetii in Hugo
Managing a page with Bissetii is a little different from the Hugo's manual. Due to many of Bissetii core features, there are a lot of key setup to be done in order to allow a page operating smoothly.
Bissetii enabled Hugo’s multi-lingual feature for the sake of removing possibility of creating broken URL (SEO hates it). Hence, the first you need to do is to ensure the languages for your Hugo site configurations are correct.
The most important file would be the
each supporting languages. At minimum, you need 2 langauges in order to instruct
Hugo to maintain its language code setup.
Bissetii by default setup
Simplified Chinese as a default
configuration. The configuration file is as follows:
- The langauge data table identification. Can be any so long it is
alphanumeric, hyphen (
-), or underscore (
_). Space (
- Although freedom is available, Bissetii suggests to keep this value
languageCodeto avoid confusion.
- The langauge data table identification. Can be any so long it is alphanumeric, hyphen (
- The ISO 639-1
ISO 3166 Alpha 2
compliant internationalization and localization language codes.
en-USfor English localized to United States
en-UKfor English localized to United Kingdom
en-MYfor English localized to Malaysia
zh-hansfor Simplified Chinese
zh-hans-CNfor Simplified Chinese localized to China
zh-hans-TWfor Simplified Chinese localized to Taiwan
- See Google’s Localization Guide to learn more.
- Will be used for data identification.
- Will be used for URI path language prefixing.
- The ISO 639-1 and optionally ISO 3166 Alpha 2 compliant internationalization and localization language codes. Example:
- The name of the langauge (Label).
- Recommend the label to be in the native language.
- The directory holding the contents for the language.
- The title of the site appeared for the language.
Please arrange the order where the primary language is always at the top. For obvious reason,
For obvious reason, Bissetii supports directory-level transation from the get-go as it is very practical and easier to distribute among all language translators while the content creators only works on the primary language content.
Selecting Primary Language
To select the primary language from your list of languages, simply update the
defaultContentLanguage field with the language
ID (the one with
.sites/config/_default/config.toml file. Example:
Redirect Unused Second Language
Due to Hugo’s requirement to maintain a minimum 2 languages in order retain the language code in the URL construction, you can redirect the unused second language page to your primary language landing page. That will ensure visitor will always arrive at the primary language’s landing page.
No Changes with
hugo new Command
Bissetii setup the theme not to intefere with
hugo new command in order to
keep things aligned with Hugo. You can still continue create the content
directly using the original pathing. This will always create the content inside
the primary language
content/ directory. Your list of actions would be
something as such:
Recommended Content Organization
If you notice, each content page has a lot of its associated files like a list
of thumbnail images, possible PDF file, and etc. Bissetii recommends the use
directory/_index.md approach, in the same directory, the creators can store
all the associated files in it. The file structure would be:
This way, you can calmly, safely, and keeping distribute process simple
when working with your translators counterpart without worrying about
untangling the dependencies located elsewhere (hint:
directories management nightmare).
Another benefit is when the page is scaling with its child pages, you do not need to perform large scale overhaul just to keep content organization sane.
Page’s Hugo Front Matter
Once a page is created, the extra step you need to do is to fill up or edit the Bissetii generated page’s Hugo front matter template before writing your content. Among notable changes would be:
date- Hugo compatible timestamp to indicate its creation date. Not to confused with modified date which is obtained from your git latest timestamp to the content file.
title- a sensible language specific title that will appear in page title and your first heading (
keywords- sort out your content’s key takeaways' keywords.
description- a 150-300 characters long summary of the page. It is used for advertising the page via search engine display.
creatorsfor page authorships. See Manage Authorship for instructions.
thumbnailsfor page thumbnail image management. See Manage Social Network for instructions.
menu.mainfor navigation management. See Manage Menu for instructions.
schemafor Schema.org data structure management. See Manage Schema.org
Intensively Using Bissetii’s Components' Shortcodes
Once all the front-matter settings are set, you’re free to create the page contents accordingly.
When using with Bissetii, please stick to using as many Bissetii’s Hugo shortcodes as Bissetii can offer via its components to standardize the content input. The main reason is that Hugo also generates multiple output formats (e.g. Vanilla HTML5 and AMPHTML) simultenously from your single content data file.
Hence, the shortcode apporach is currently the most sane practice in terms of maintenance and scalability so use them whenever available.
Manage Development and Publications
Now that you’re ready to create your web content, you can proceed to setup your hugo server for development and later on, manage your publishers. Visit Manage Publishers to learn more.
That is all for managing page with Bissetii in Hugo. If you have any question to ask us directly, please feel free to raise it at our GitLab Issues Section. We will be happy to assist you.