A theme consisting of partials and shortcodes that can be added as a theme component for any Hugo site. This leverages the theme composition functionality added in Hugo v0.42.
Wanna report a bug or suggest a feature? Great stuff! For more information on how to contribute check out our contributing guide.
Please note that this project is released with a Contributor Code of Conduct. By participating in this project project you agree to abide by its terms.
- Add the
hugo-utilitybelt
as a submodule to be able to get upstream changes latergit submodule add https://github.com/lockedatapublished/hugo-utilitybelt.git themes/hugo-utilitybelt
- Add
hugo-utilitybelt
as a theme in your config.tomltheme = ["hugo-itsalocke", "hugo-utilitybelt"]
- In your custom theme or site, reference utilitybelt partials in the normal way.
Partial | Description |
---|---|
use_bootstrap4.html |
Contains the CSS, javascript, and meta tags ideal for including bootstrap 4 (4.1.1 currently) in the <head/> tag of your site. This uses async loading of the scripts. |
use_jquery3.html |
Calls the minified full jquery 3.3.1 from the CDN. This uses async loading of the scripts. |
use_fontawesome5.html |
Incorporates fontawesome 5 (5.4.1 currently) into your site. |
use_fontawesome5pro.html |
Incorporates fontawesome 5 (5.4.1 currently) Pro into your site. Won't work unless you've whitelisted your site with fontawesome. |
use_staticman.html |
Provides comments. You will need to include in params staticman_url which contains the POST url e.g. https://api.staticman.net/v2/entry/eduardoboucas/staticman/gh-pages/comments and staticman_debug |
use_hugo-search-index.html |
Produces a search box and returns a result if you've implemented the hugo-search-index project. This doesn't do any of the search index generation etc |
use_fullcontentrss.xml |
Returns all the content in an RSS feed |
use_snipcart_*
partials help you implement snipcart- See original article at https://forestry.io/blog/snipcart-brings-ecommerce-static-site/
- Add to
params
:snipcart_test_api_key
andsnipcart_live_api_key
Shortcode | Description |
---|---|
eventbrite.html |
The Eventbrite shortcode allows you to embed the ticket sales page into your hugo site using the event id. |
fullcalendar_gcal.html |
The Fullcalendar shortcode allows you to embed google calendar page into your hugo site using google calendar API key. |
netlify_basiccontact.html |
The Netlify shortcode allows you to embed basic contact form into your hugo site. |
sitemap.html |
The Sitemap shortcode allows you to embed simple sitemap into your hugo site. |
Here are the instructions for using the staticman comments system in your theme / site.
- Add
hugo-utilitybelt
to your list of themes inconfig.toml
e.g.theme= ["hugo-utiliybelt","hugo-itsalocke"]
- Per the staticman docs add staticman to your Hugo github repo as a collaborator
- This enables staticman to contribute pull requests, you can alternatively create your own hosted version of staticman if you don't want to use an external dependency
- Add a
staticman.yml
file to your site- Use the samples, consult the docs, or lift one I made earlier.
- Add style functionality to your theme / site by using
use_staticman_head.html
in your<head></head>
e.g.{{ partial "use_staticman_head.html" . }}
- Customise comments CSS by adding a CSS file at
static/css/comments.css
- Include the
use_staticman.html
partial in your layouts that you wish to have comments available on.
See original article at https://forestry.io/blog/snipcart-brings-ecommerce-static-site/
The Eventbrite shortcode allows you to embed the ticket sales page into your hugo site using the event id.
At present, only the ticket page is supported, however support for the button is on the way.
- Add
hugo-utilitybelt
to your list of themes inconfig.toml
e.g.theme= ["hugo-utiliybelt","hugo-itsalocke"]
- Insert the shortcode into the page you want to sell the tickets from and set the event id e.g
{{< eventbrite event_id="0123456789" >}}
- Publish your page, the Eventbrite details should be listed and people can order directly from your website.