This Hugo theme focuses purely on content: Content is king. Layout and appearance are simply by design. The primary goal of the theme is to give the website visitor maximal user experience for reading and enjoying the published content elegantly. No Sidebars or any other annoying elements that interrupt the reading experience.
- Clone this theme to your
themesdirectory
git submodule add https://github.com/devidw/hugo-theme-cik ./themes/hugo-theme-cik- Add this theme to your list of themes inside your config-file
Using
config.toml
theme = ["…", "hugo-theme-cik", "…"]Using config.yaml
theme: ["…", "hugo-theme-cik", "…"]or
theme:
- "…"
- "hugo-theme-cik"
- "…"- (Optional) Install additional hugo theme components to extend the theme. Some suggestions:
- https://github.com/devidw/hugo-theme-component-asciidoctor-skin
- https://github.com/devidw/hugo-theme-component-structured-data
- https://github.com/devidw/hugo-theme-component-webmentions
- https://github.com/devidw/hugo-theme-component-oembed
- Or create your own one using https://github.com/devidw/cookiecutter-hugo-theme-component
git submodule update --init --recursive --remotePlease specifiy in which sections you posts are located:
mainSections:
- postsauthor:
name: David Wolf
email: [email protected]
signature: signature.svg # static file pathGenerates <link rel=payment> links and adds them to the <head>
payments:
- https://paypal.me/devidwolf
- https://buymeacoffee.com/dwolfthemeColor: "#8b7355"icons:
favicon: logo.svg
touchIcon: logo.svg # Safari
maskIcon: logo.svg # Safarinoindex: true- sets robots meta tag
- excludes via
robots.txt - excludes from
sitemap.xml - excludes from RSS feed
You can inject custom HTML markup by creating hook partial files inside your projects layouts/partials/hooks directory.
For example to hook directly before the closing </body> tag you can create a body/end.html file in your layouts/partials/hooks directory. The full path in this case would be layouts/partials/hooks/body/end.html.
Available hooks:
head/start.htmlto inject HTML right after the opening<head>taghead/end.htmlto inject HTML right before the closing</head>tagbody/start.htmlto inject HTML right after the opening<body>tagbody/end.htmlto inject HTML right before the closing</body>tag
You can add additional custom styles to the Hugo theme via the /assets/sass/_custom.sass file.
If there is no /assets/sass/_custom.sass file in your project you can simply create it.
Simply add your SASS rules into _custom.sass.
All your custom styles will be compiled from SASS to CSS and minified automatically via Hugo pipes.
If you not so familiar with SASS you can also write SCSS or just plain CSS.
To do so you only have to import your .scss or .css file into _custom.sass by doing a SASS-import using the @import method.
@import <filename>Say you want to include some CSS styles, which you write into /assets/sass/my-custom-styles.css.
To add them to the theme you add the following into /assets/sass/_custom.sass:
@import my-custom-stylesDo not include the file extension like .scss or .css in the path of the @import rule.