Skip to content
forked from welpo/tabi

A fast, lightweight, and modern Zola theme with multilingual support, optional JavaScript, and a perfect Lighthouse score.

License

Notifications You must be signed in to change notification settings

cmbadjusting/tabi

 
 

Repository files navigation

tabi

A fast, lightweight, and modern Zola theme with multi-language support. It aims to be a personal page and home to blog posts.

See a live preview (and the theme's documentation) here.

tabi (旅): Journey.

tabi

tabi has a perfect score on Google's Lighthouse audit:

lighthouse

Features

Quick start

Once you have installed Zola 0.17.0 or newer:

git clone https://github.com/welpo/tabi.git
cd tabi
zola serve

Open http://127.0.0.1:1111/ in the browser.

Installation

To add tabi to you existing Zola site:

  1. Initialize a Git repository in your project directory (if you haven't already):
git init
  1. Add the theme as a git submodule:
git submodule add https://github.com/welpo/tabi.git themes/tabi

Or clone the theme into your themes directory:

git clone https://github.com/welpo/tabi.git themes/tabi

Required configuration

  1. Enable the theme in your config.toml:
theme = "tabi"
  1. Set a title in your config.toml:
title = "Your Site Title"
  1. Create a content/_index.md file with the following content:
   
title = "Home"
paginate_by = 5 # Set the number of posts per page
template = "index.html"
   

If you want to serve your blog posts from a different path, such as blog/, add a section_path in the [extra] section of content/_index.md (this file will need pagination):

[extra]
section_path = "blog/_index.md"
  1. If you want an introduction section (see screenshot above), add these lines to content/_index.md:
[extra]
header = {title = "Hello! I'm tabi~", img = "img/main.webp" }

The content outside the front matter will be rendered between the header title and the posts listing. In the screenshot above, it's the text that reads "tabi is a fast, lightweight, and modern Zola theme…".

  1. If you want a multilingual site, you will need to set up each language. In config.toml:
  • set the translations for a few strings;
  • set the title and taxonomies for each language;
  • add the language_name.{code} in [extra]. This is the text shown in the language switcher.

See these lines in the provided config.toml for an example.

You will need an _index.{language_code}.md per language for each section (e.g. /blog or /projects) that you want to enable in that language.

The same is true for individual posts, which should have the exact same name as the default language, with an extra .{code} before the extension (e.g. the Spanish version of security.md would be security.es.md).

This configuration allows the language switcher to take the user to the translation of the current URL. If a translation doesn't exist, the 404 page will be displayed, with an explanation in each language set in the config.

Inspiration

This theme was inspired by:

Contributing

Please do! Take a look at the Contributing Guidelines to learn more.

License

The code is available under the MIT license.

About

A fast, lightweight, and modern Zola theme with multilingual support, optional JavaScript, and a perfect Lighthouse score.

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 41.2%
  • SCSS 30.6%
  • JavaScript 12.8%
  • Shell 7.2%
  • CSS 5.5%
  • XSLT 2.7%