blob: 4f5a6a42b7fd62b00b763d1480b5aed1b5e9fbcb (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
|
# Huginn
Huginn is a minimalist and responsive theme for [Hugo static site generator](https://gohugo.io). It was once developed for [Pelican](https://getpelican.com) based on the work of **iKevinY** with his theme [pneumatic](https://github.com/iKevinY/pneumatic).
The theme is mainly tailored for my needs but I will try to make it more stateless in order to be used without any fuss by others.
As of today **Huginn** supports :
- Responsive design (using *media queries*)
- Lovely light colors (and dark syntax highlights) took from [snow.vim](https://github.com/nightsense/snow)
- Hugo builtin functions such as
- Table of Content (automatically added if your post contains *headers*)
- Related Content
- Rss feeds (tweaked layout to allow full-text rendering)
- JavaScript lightbox powered by [baguetteBox.js](https://github.com/feimosi/baguetteBox.js)
- A `lightbox` shortcode for simple one-image display
- A `gallery` partial to display a nice gallery at the end of your post
- Displaying a link and the name of a song you were listening at while writing a post (activated in front-matter with `song: [title](link)`)
- Comments powered by [Isso](https://posativ.org/isso/) for
now. A parameter in `config.yaml` is used to specify Isso server
`{{ .Site.Params.isso_server }}`
- Static comments powered by [Staticman](https://staticman.net) v3.
Some parameters in `config.toml` and `staticman.yml` are used to configure
Staticman's API.
## Lightbox
> This shortcode uses the **Page Bundle** function introduced in Hugo 0.32, make sure to be aware of it when playing with `lightbox`.
The `lightbox` shortcode is pretty simple and looks like this:
```
{{ $img := (.Page.Resources.ByType "image").GetMatch ( printf "images/lightbox/%s*" (.Get "img")) }}
{{ $align := (.Get "align") }}
{{ .Scratch.Set "image" ($img.Resize "256x q80") }}
{{ $scaled := .Scratch.Get "image" }}
<a href="{{ $img.RelPermalink }}">
<img class="thumbnail {{ with $align }}{{ . }}{{ end }}" src="{{ $scaled.Permalink }}">
</a>
```
All you have to do is to make sure that your thumbnail has the same filename that the full one only with the addition of the suffix *-thumb* before the extension.
The shortcode only needs two parameters :
| Parameters | Description
|:------------:|------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| `img=""` | Filename to your image. (no `.extension` required) |
| `align=""` | If you want to align the image on the left side or the right side of the *content* block.If none is specified the image is automatically centered in the block. |
## Gallery
> **Page-Bundle** required
The `gallery` partial is even more simple. All you have to do is put your images in `images/gallery` and ... here you are, with images at the end of your post.
```
<div class="gallery">
{{ with .Resources.Match "images/gallery/*.*" }}
{{ range . }}
{{ $scaled := .Resize "256x q80" }}
<div class="gallery-item">
<a href="{{ .RelPermalink }}">
<img class="thumbnail" src="{{ $scaled.Permalink }}">
</a>
</div>
{{ end }}
{{ end }}
</div>
```
|
