Giter Site home page Giter Site logo

inputusername / zola-hook Goto Github PK

View Code? Open in Web Editor NEW
31.0 2.0 17.0 279 KB

A clean and simple personal site/blog theme for the Zola static site generator

Home Page: https://inputusername.github.io/zola-hook/

SCSS 42.46% HTML 57.54%
zola zola-theme

zola-hook's Introduction

Hook

A clean and simple personal site/blog theme for Zola.

Demo

Setup

Clone this repo into your themes folder:

cd themes
git clone https://github.com/InputUsername/zola-hook.git hook

Then, enable it in your config.toml:

theme = "hook"

Features

The following templates are built-in:

  • index.html - the homepage;
  • page.html - pages and posts (extends index.html);
  • section.html - archive of pages in a section, mostly for a blog (extends page.html);
  • 404.html - 404 page (extends page.html).

Templates have the following Tera blocks:

  • title - to override the default <title> (config.title);
  • description - to override the <meta name="description">'s content (config.description);
  • extra_head - to override styles and anything else in <head>;
  • header - to change the header (best to put this in a <header>);
  • content - to change the content (best to put this in a <main>).

You can set a section or page description using description in your front matter. By default, the description in config.toml is used.

You can define links to include in the header on the homepage in config.toml:

[extra]

links = [
    { title = "Link display text", href = "http://example.com" },
    # ...
]

Pages in the root section can define extra.in_header = true to be included in the header links on the homepage.

The content in the root _index.md is included in the homepage if present.

Below that is a list of the 20 most recent posts. For this, the blog/_index.md section is expected to exist (will error if it doesn't exist). There is also a link to an archive of all blog posts by year.

Hook supports light/dark mode based on the user's preference. There is also a manual toggle button (requires JavaScript).

Screenshots

Homepage

Homepage

Blog post

Blog post

Blog archive

Blog archive

Dark mode

Dark mode

License

MIT license, see LICENSE.

zola-hook's People

Contributors

ewreurei avatar i-ghost avatar inputusername avatar kmicklas avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

zola-hook's Issues

tables

I just noticed these are missing.
Not really sure how to do those myself, any pointers? Or do you want to add them?

how to use tags

Hi! Thank you for the great theme! It is very nice to see a minimal theme with a dark mode support. I wonder if it is possible to add tags to posts and list them in a dedicated page? E.g. see how it is done in the "anpu" theme: github, demo.

Can't setup the theme

I've set up Zola for the first time following all the steps mentioned in the official guide, and it works fine with no theme applied. https://www.getzola.org/documentation/getting-started/overview/

But seems like the Setup instruction might be missing something because cloning the Hook theme into themes folder and then putting theme = "hook" into config file doesn't help. The theme isn't getting applied this way. Is there anything else that should be done? I'm afraid the template structure should be somehow rebuilt or reconfigured yet I don't know how.

Any chance you could help?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.