Hi everyone! I’m writing again my own Hugo theme with a lot of copy and paste magic. ;D
I discovered the use of {{ with .Param "mastodon" }}
and want to use it for my social icons. But it doesn’t render. Hugo builds the page, does not show any error message, but it does not show up…
This is my code, for full code please visit this github repro: https://github.com/KurzGedanke/kurz-hugo-v2
header.html
<div class="social column column-80 text-center">
{{ with .Param "mastodon" }}
<span><a href="{{ . }}">Mastodon</a></span>
{{ end }}
{{ with .Param "twitter" }}
<span><a href="{{ . }}">Twitter</a></span>
{{ end }}
{{ with .Param "youtube" }}
<span><a href="{{ . }}">YouTube</a></span>
{{ end }}
{{ with .Param "reddit" }}
<span><a href="{{ . }}">Reddit</a></span>
{{ end }}
{{ with .Param "github" }}
<span><a href="{{ . }}">GitHub</a></span>
{{ end }}
{{ with .Param "Gitlab" }}
<span><a href="{{ . }}">Gitlab</a></span>
{{ end }}
{{ with .Param "email" }}
<span><a href="{{ . }}">Email</a></span>
{{ end }}
{{ with .Param "pgp" }}
<span><a href="{{ . }}">(PGP)</a></span>
{{ end }}
{{ with .Param "donate" }}
<span><a href="{{ . }}">Donate</a></span>
{{ end }}
{{ with .Param "rss" }}
<span><a href="{{ . }}">RSS</a></span>
{{ end }}
</div>
and config.toml
[Params]
dateFormat = "January 2, 2006"
[Param]
mastodon = "https://chaos.social/@KurzGedanke"
youtube = "https://youtube.com/KurzGedanke"
github = "https://github.com/KurzGedanke"
email= "mailto:kurzgedanke@protonmail.com"
pgp = "https://pgp.mit.edu"
donate = "https://kurzgedanke.me/donate"
rss = "https://kurzgedanke.de/index.xml"
My file strcutre looks like this:
.
├── LICENSE
├── README.md
├── archetypes
│ └── default.md
├── layouts
│ ├── _default
│ │ └── baseof.html
│ ├── index.html
│ ├── partials
│ │ ├── footer.html
│ │ ├── head.html
│ │ ├── header.html
│ │ └── paginator.html
│ └── shortcodes
│ └── responsiveImage.html
├── mockup
│ ├── design
│ │ ├── kurz-hugo-v2.afdesign
│ │ └── kurz-hugo-v2.png
│ └── mockup
│ ├── SCSS
│ │ ├── Cyberpunk.scss
│ │ ├── Dark.scss
│ │ ├── Light.scss
│ │ ├── _cyberpunk.scss
│ │ ├── _dark.scss
│ │ ├── _light.scss
│ │ └── reset.scss
│ ├── css
│ │ ├── Cyberpunk.css
│ │ ├── Cyberpunk.map
│ │ ├── Dark.css
│ │ ├── Dark.map
│ │ ├── Light.css
│ │ ├── Light.map
│ │ ├── milligram.min.css
│ │ ├── milligram.min.css.map
│ │ ├── normalize.css
│ │ ├── reset.css
│ │ ├── reset.map
│ │ ├── style.css
│ │ └── style.map
│ ├── index.html
│ └── js
│ ├── jquery.js
│ └── stylechanger.js
├── static
│ ├── SCSS
│ │ ├── Cyberpunk.scss
│ │ ├── Dark.scss
│ │ ├── Light.scss
│ │ ├── _cyberpunk.scss
│ │ ├── _dark.scss
│ │ ├── _light.scss
│ │ └── reset.scss
│ ├── css
│ │ ├── Cyberpunk.css
│ │ ├── Cyberpunk.map
│ │ ├── Dark.css
│ │ ├── Dark.map
│ │ ├── Light.css
│ │ ├── Light.map
│ │ ├── milligram.min.css
│ │ ├── milligram.min.css.map
│ │ ├── normalize.css
│ │ ├── reset.css
│ │ ├── reset.map
│ │ ├── style.css
│ │ └── style.map
│ └── js
│ ├── jquery.js
│ └── stylechanger.js
└── theme.toml
The render html looks like this:
<div class="social column column-80 text-center">
</div>
I take from this post (link) that my use is some sort of correct. But I don’t know, hopefully someone of you can help me. Thank you!
Kind Regards,
KurzGedanle