4.5 KiB

Raw Permalink Blame History

+++ title = "Zhuia" description = "An elegant but still playful theme for Zola." template = "theme.html" date = 2024-09-02T05:58:27Z

[extra] created = 2024-09-02T05:58:27Z updated = 2024-09-02T05:58:27Z repository = "https://github.com/gicrisf/zhuia.git" homepage = "https://github.com/gicrisf/zhuia" minimum_version = "0.15.0" license = "MIT" demo = "https://zhuia.netlify.app"

[extra.author] name = "Giovanni Crisalfi" homepage = "https://github.com/gicrisf" +++

Zhuia

An elegant but still playful theme for Zola powered by Spectre.css.

It is especially optimized for mobile navigation (optionally without JavaScript, if you don't like fancy stuff).

DEMO: https://zhuia.netlify.app/

Installation
Features
Options
- Title
- SEO
- Menu
- Social
- Footer
Name
Genesis
Donate
License

Installation

First download this theme to your themes directory:

$ cd themes
$ git clone https://github.com/gicrisf/zhuia.git

and then enable it in your config.toml:

theme = "zhuia"

Posts should be placed directly in the content folder.

To sort the post index by date, enable sort in your index section content/_index.md:

sort_by = "date"

Features

Lightweight and minimal
Spectre CSS classes to manage content. Look at the docs
Responsive for mobile support (with full-page mobile menu)
SCSS based CSS source files for easy customization
HTML based sidebar widget
Author card sidebar widget with customizable avatar
Multi-author support
Optional twitter sidebar widget
Feed RSS/Atom
Open Graph and Twitter Cards support
Social buttons with icons
Deploy via Netlify (config already included)
Tags AND categories
Granular image optimization for a really faster loading on mobile
Pagination
Easily extendable menu
Inter-page pagination
Optional NoJs
Hamburger animation
Comments
Related posts (not sure about this)
Search bar
Math rendering
Other shortcodes
Multilanguage support
Dark mode
Table of Contents
Image + text title option

Options

Title

Set a title and description in the config to appear in the site header and on the RSS feed:

title = "Der Prozess"
description = "a novel written by Franz Kafka in 1914"

SEO

Most SEO tags are populated by the page metadata, but you can set the author and for the og:image tag provide the path to an image:

[extra]

author = "Timothy Morton"
og_image = "Hyperobjects.png"

You can choose between two modes:

With a small script for an elegant overlay menu
Without any scripts at all (it just your show menu underneath)

Set a field in extra with a key of footer_links:

[extra]

# Freely comment out or delete every field
social_links = [
    {url = "https://t.me/yourname", name = "telegram"},
    {url = "https://twitter.com/gicrisf", name = "twitter"},
    {url = "https://github.com/gicrisf", name = "github"},
    # {url = "", name = "facebook"},
    # {url = "", name = "instagram"},
    # {url = "", name = "bookstack"},
    # {url = "", name = "dokuwiki"},
]

The theme automatically picks up the right icons. We can expand the support to other social, for sure: make a PR or open an enhancement issue to ask a new implementation.

Footer

You can add your own copyright or whatever to the footer with a through a simple option on the config file:

[extra]

footer_tagline = "What if everything is an illusion and nothing exists? In that case, I definitely overpaid for my carpet."

Name

The name arise from two parts:

The generator, Zola, gives the "Z";
An extinct species of New Zealand wattlebird, the huia, provide the second part.

The theme is built on Spectre CSS framework, so I found reasonable evoking a spectral species.

Genesis

This theme is based on a Pelican theme I originally made for my blog, which was in turn based on the Grav theme Quark.

Donate

Did you liked this theme? Make a donation and support new features!

License

Open sourced under the MIT license.

4.5 KiB Raw Permalink Blame History