Nyaa.ee website theme

This repository contains a hugo theme for nyaa.ee web site. The theme in question is mostly meant to be used for more hackerish looking blogs with funky fonts.

Installation

In order to install the theme, add the repository as a git submodule to your hugo website's themes directory.

$ git submodule add https://git.doma.nyaa.ee/karmen/nyaa-theme themes/nyaa

After installing it, modify your page's hugo.toml file to contain the following:

title = "My awesome website"
theme = "nyaa"
summaryLength = 30

[params]
    author = "John Smith"
    description = "My awesome website"

# Allow RSS generation only for the home site
[outputs]
  home = ["html", "rss"]
  section = ["html"]
  taxonomy = ["html"]
  term = ["html"]

# Disable default `categories` taxonomy since this template doesn't work with it
[taxonomies]
    tag = "tags"

[markup.goldmark.renderer]
    unsafe = true

Parameter values params.author and params.description are mainly used in meta tags to describe the website. Generally og:description value is taken from an article summary, but in-case the content is a section, then this specific description value is used.

Customizing the website

This theme provides a website with 5 main sections:

• Home section or / - this section contains the website intro along with a short list (up to 5) most recent articles.
• Articles section or /articles - this section contains all your blog articles, each article gets put to /articles/<article-name>.
• Donation or /donate section gives a brief overview of ways that people could support you.
• Projects section or /projects gives you a page for describing all your awesome projects. If a separate article on a specific project is required then they shall be written to /projects/<my-awesome-project>
• Socials section or /socials simply contains some information about your socials.

Shortcodes

By default, 2 shortcodes exist for the convenience of writing content: image and center shortcodes.

image shortcode allows you to align a clickable image thumbnail to your content so that, when clicking on it, the fullres image shows up. Let's assume that you have an image called sample.webp and you would like to add it to your content page.

{{< image
        src=sample.webp
        width=400
        alt="Sample Picture"
        caption="This is an example"
        align=center
        authorName="@me"
        authorLink="/"
>}}

Shortcode properties caption, authorName and authorLink are optional and can be omitted if caption/author data is not needed. Property align supports 3 different values: left, center and right.

center shortcode allows you to horizontally center any arbitrary data. The content can be markdown or HTML.

{{% center %}}
<a href='javascript:alert("Good girl :3")'>Click me!!!</a>
{{% /center %}}