Customization on Ananke Documentation

Custom CSS

Sat, 06 Jun 2026 08:00:00 +0700

Where custom CSS goes
Register your CSS
Static files and external stylesheets
Asset pipeline limitations
Troubleshooting checklist

You can add your own CSS on top of the theme’s styles without editing the theme. This page covers the common path; for the full stylesheet pipeline (build order, social hover colours, source maps) see Styles.

Where custom CSS goes #

Put your CSS files in your project’s assets/ananke/css/ directory:

Overriding Partials

Sat, 06 Jun 2026 08:00:00 +0700

How Hugo lookup order works
The safe override pattern
A full example
Keep overrides small
Update risks

Ananke is built from many small template files called partials. You can change any of them without editing the theme, by placing a file with the same path in your own project.

How Hugo lookup order works #

When Hugo needs a partial, it looks in your project first and the theme second. If a file exists at the same path in both places, your copy wins. This is what makes safe customisation possible: you never touch the theme, you just shadow the file you want to change.

Colours

Fri, 16 Jan 2026 08:00:00 +0700

How the theme uses classes
Background colour
Body and font classes
Content text colour
Post content typeface
Header and hero classes
Accessibility and contrast

Ananke styles colours and typography with Tachyons utility classes. You choose a class name (for example bg-blue or near-black) and the theme applies it. This page lists the class-based settings.

How the theme uses classes #

Each setting below takes a Tachyons class as its value. Background colours use the bg- prefix (for example bg-navy); text colours use the colour name directly (for example near-white). Browse the available values in the Tachyons skins reference.

Comments

Fri, 16 Jan 2026 08:00:00 +0700

Disqus
Commento.io
Disabling comments
Privacy

Ananke currently supports two commenting systems: Disqus and Commento. Both render below the content on single pages.

Disqus #

Using Disqus as a comment system for your website is an internal feature of Hugo. For more information see the official Hugo documentation.

[services.disqus]
shortname = 'YOURSHORTNAME'

Note that the setup for Disqus is NOT done inside of the params section, but with in the services section of your config file. To turn off Disqus, remove, or comment out the preceding lines.

Hero Section

Fri, 16 Jan 2026 08:00:00 +0700

Change the hero background
Use the images front matter array
Featured image as Page Resources
Other hero settings
Set a background color behind transparent hero images

Change the hero background #

For any page or post you can add a featured image by including the local path in front matter (see content in the exampleSite/content/en/_readme file for examples): featured_image = '/images/gohugo-default-sample-hero-image.jpg'

Use the images front matter array #

If featured_image is not set, Ananke will use the first value from the page’s images front matter array as the featured image.

Styles

Fri, 16 Jan 2026 08:00:00 +0700

Update font or body classes
Stylesheet Generation

Update font or body classes #

The theme is set, by default, to use a near-white background color and the “Avenir” or serif typeface. You can change these in your config file with the body_classes parameter, like this:

[params]
 body_classes = "avenir bg-near-white"

which will give you a body class like this: