Complete reference for all theme features and configuration options.
Requirements # Hugo 0.152.0 or later (extended edition) Go 1.21+ (for Hugo modules) npm (Node Package Manager) in your build environment tailwindcss v4 installed (can be included via package.hugo.json) Using Hugo Modules # Add the theme as a module in your hugo.yaml: module: imports: - path: github.com/jwhumphries/shiloh Then run:
All parameters go in params section of your site configuration. Shiloh uses a modular configuration structure in config/_default/. Configuration Files # File Purpose hugo.toml Core Hugo settings (outputs, pagination, privacy) params.toml Theme parameters (all options below) languages.en.toml Language and site title settings menus.en.toml Navigation menus markup.toml Markdown rendering and code highlighting module.toml Hugo module configuration Appearance # Parameter Type Default Description colorScheme string "shiloh" daisyUI theme name font string "code" Font family: "code" (Fira Code) or "prose" (Fraunces + Lora) defaultAppearance string "light" Initial theme: "light" or "dark" autoSwitchAppearance boolean true Respect system preference defaultThemeColor string "#ffffff" Browser chrome color Theme Colors # Shiloh includes two custom daisyUI themes defined in assets/css/main.css:
All theme parameters can be overridden per-page using front matter. This allows fine-grained control over how each page is displayed. Basic Parameters # Parameter Type Description title string Page title (used in browser tab and headings) date date Publish date lastmod date Last modified date draft boolean Mark as draft (hidden in production) description string Page description (meta tag and social cards) summary string Custom summary for article cards tags array Page tags categories array Page categories keywords array SEO keywords weight integer Sort order for list pages Layout Parameters # Parameter Type Description layout string Override layout template type string Content type (determines lookup path) Available Layouts # single - Default article layout with optional TOC sidebar list - Archive/list page with article cards about - About page layout Display Overrides # Override any params.article setting per-page:
Shiloh provides several extension points for customizing the theme without modifying core files. This ensures smooth upgrades while giving you full control. Custom CSS # Add custom styles by creating assets/css/custom.css in your project. This file is processed by Tailwind CSS, so you have access to all Tailwind features. Basic Usage # Create the file in your project:
Shiloh includes a complete dark mode implementation with system preference detection and manual toggle. How It Works # The theme uses the theme-change library to handle theme switching. The current theme is stored in localStorage and persisted across page loads. Theme Detection Order # Check localStorage for saved preference If no preference saved, check system preference (prefers-color-scheme) Fall back to defaultAppearance from site configuration Configuration # Site-Wide Settings # In params.toml:
Shiloh includes built-in full-text search powered by Fuse.js , a lightweight fuzzy search library. Enabling Search # Search is enabled by default. To disable: [params] enableSearch = false Adding Search to Navigation # Add the search button to your navbar by including a menu item with the search identifier: