Sam is a Simple and Minimalist theme for Hugo. It lets you categorize and showcase your content the way you want to.
Focused on content and typography, the stylized index page is really just a list of navigation links that you can set in your config.toml. This versatile design is limited only by your imagination, as you can make it say anything you like. Here are some ideas.
Content-focused page templates for list pages, single pages, and posts
A responsive CSS grid gallery page that renders from images in your Page Bundle
Custom navigation menu set via config.toml
Custom footer text
Custom background video via config.toml
Share-ready pages with Open Graph and Twitter metadata you can customize in config.toml and page front-matter
Effortless use of Hugo Pipes to generate CSS from Sass files
Tested for compatibility with Hugo versions as far back as 0.49.2
Extended version of Hugo (latest version recommended)
Error: Error building site: POSTCSS failed to transform "css/main.css"
You can install the required packages using npm. You’ll need postcss, postcss-cli, and autoprefixer:
That’s it! Sam’s gallery layout template will automagically build the page from your images.
Custom video background
To change the default home page background to a looping video, you need to set a list of video sources and optionally an overlay color (default: rgba(0, 0, 0, 0.4)).
Here is an example configuration of config.toml:
source = "/background.mp4"# Your video filetype = "video/mp4"poster = "/background.jpg"# The image to show when the video isn't playing
overlay = "rgba(0, 0, 0, 0.4)"# optional
And here is a screenshot of what that might look like:
Editing the theme
This theme uses Hugo Pipes to compile, autoprefix, and minify its CSS styles from the included Sass files.
To make changes to the CSS, edit the Sass files located in assets/sass/, then build your site using extended Hugo, which you can obtain from Hugo Releases.
If when building you do not see the changes you have done, make sure to build your website with the --ignoreCache flag, otherwise Hugo will
attempt to use its own cached Sass files.
You can run the built-in server to preview the site as you make changes to the Sass files!
If you have a question or get stuck, please open an issue for help and to help those who come after you. The more information you can provide, the better!
Pull requests for bug fixes and enhancements are welcome! Please ensure you first read about contributing to this project.
Open source themes like this one would not be possible without some amazing contributors. Thank you!