This Hugo blog is based on the Atlas, Hugo Boilerplate. It has been modified to fit my needs.
Disclaimer - This boilerplate has been integrated with Netlify, and therefore many features are specific to the Netlify platform and may not work with other hosting providers.
Disclaimer - Atlas is a boilerplate (starter kit) for bespoke Hugo projects. It's not a Hugo theme and cannot be placed inside the /themes
directory. Check the theme docs for more information.
Atlas provides the following features out of the box:
- Environment driven
robots.txt
file (disallows robots on everything other than production) - Base HTML templates with easy customisation/extension
- Configuration for Netlify deployments
- Better defaults for configuring HTTPS
- Better redirects with Netlify instead of
<meta http-equiv="refresh">
For more information on these features go to the Atlas repo.
A few modifications have been done to the base Atlas boilerplate code to fit my needs.
- Use normalize.css and a modified version of Skeleton
- Minify CSS action added to the
styles.html
that minifies and concatinates all the CSS files into onesite.css
file - Use Hugo's inbuilt syntax highlighting with Xcode syntax style
- Added pagination for posts with 10 posts/page by default
- Remove Netlify CMS
- No other javascript except Google Analytics
- Use YAML all around (TOML is nice but I like YAML)
- Added an Archive page inspired from David Tran
- Added JSON Feed generation in addition to XML RSS Feed
- Added Twitter Card support
The layout is loosely based on Attila Ghost theme and styles from my other photography website.
- The main page consists of a blog header that only shows up on the home page
- Rest all pages have a mini nav bar with the blog title
- Pagination with links to Older and Newer Posts along with the page number context
- Single post page has the date and a link to the category(s) the post is in
- Show tags at the bottom of the single post page controlled by
displayPostTags
inconfig.yaml
- Footer with links to XML RSS, JSON Feed and Archive page
This starter project does not include a copy of the hugo
binary. You will need to install Hugo first you can run any of the commands mentioned below.
To get started, you can either clone the repository, or deploy straight to Netlify. Then run the following from the project root:
npm install
npm run server
There are 3 commands available:
npm run build
- Builds assets (sass, js, fonts, images) and runshugo
npm run build:preview
- The same asbuild
, but runshugo --buildDrafts --buildFuture
npm run server
- Runs BrowserSync and watches for changes, runningbuild
when changes are detected
│
└──── /layouts - Template files
│ │ 404.html - 404 Template
│ │ index.json - JSON Feed conforming template
│ │ index.headers - Custom Netlify HTTP headers
│ │ index.redirects - Custom Netlify redirect rules
│ │ robots.txt - Template for robots.txt
│ │
│ └──── /_default - Base templates for list & singular pages
│ │ │ baseof.html - Base template
│ │ │ list.html - List/taxonomy template
│ │ │ single.html - Singular page/post template
│ │
│ └──── /partials - Partials
│ │
│ └──── /site - Site partials loaded into _default/baseof.html template
│ │ meta.html - Site <meta> tags
│ │ nav.html - Top nav that shows up on non home pages
│ │ blog-header.html - Site header that shows up on the home page
│ │ pagination.html - Pagination links
│ │ post-summary.html - Post summary shown on the home page
│ │ footer.html - Sites primary <footer>
│ │ twitter-card.html - Twitter card meta tags
│ │ scripts.html - JavaScript <script> referenced before closing </body>
│ │ styles.html - Stylesheets referenced before closing </head>
│ │
| └──── /src - Source files for assets (SASS, JS, Images, Fonts etc)
│ │
│ └──── /static - Hugo static resources
│
│ .gitignore
│ .sass-lint.yml - Linting rules for sass-lint
│ LICENSE
│ README.md
│ config.yaml - Hugo configuration
│ netlify.toml - Netlify configuration
│ package.json
You can deploy directly to Netlify using this button:
MIT © Vashishtha Jogi