Skip to content

Instantly share code, notes, and snippets.

@alexisjanvier
Last active January 26, 2022 05:05
Show Gist options
  • Save alexisjanvier/66aa5f417f9429b0cd73337a20ba399c to your computer and use it in GitHub Desktop.
Save alexisjanvier/66aa5f417f9429b0cd73337a20ba399c to your computer and use it in GitHub Desktop.
[Hugo] Notes sur la mise en place d'un template hugo #hugo #markdown
[menu]
[[menu.nav]]
name = 'Accueil'
url = '/'
weight = 1
[[menu.nav]]
name = 'Blog'
url = '/blog'
weight = 2
[[menu.nav]]
name = 'Talks'
url = '/talks'
weight = 3
[[menu.nav]]
name = 'À propos'
url = '/a-propos'
weight = 4
{{ $image := $.Page.Resources.GetMatch (.Get "src")}}
{{ $desktopImage := $image.Resize "620x jpg" }}
{{ $desktopImageWebp := $image.Resize "620x webp" }}
{{ $mobileImage := $image.Resize "350x jpg" }}
{{ $mobileImageWebp := $image.Resize "350x webp" }}
<figure class="image" role="figure">
<picture>
{{ if gt $image.Width $mobileImage.Width}}
<source srcset="{{ $mobileImage.RelPermalink }} {{ $mobileImage.Width }}w" media="(max-width: 399px)" type="image/jpeg">
<source srcset="{{ $mobileImageWebp.RelPermalink }} {{ $mobileImageWebp.Width }}w" media="(max-width: 399px)" type="image/webp">
{{ end }}
{{ if eq $desktopImage.Width $image.Width}}
<source srcset="{{ $image.RelPermalink }}" media="(min-width: 400px)" type="image/jpeg">
<img src="{{ $image.RelPermalink }}" width="{{ $image.Width }}" height="{{ $image.Height }}" alt="{{ $.Get "alt" }}" />
{{ else }}
<source srcset="{{ $desktopImage.RelPermalink }} {{ $desktopImage.Width }}w" media="(min-width: 400px)" type="image/jpeg">
<source srcset="{{ $desktopImageWebp.RelPermalink }} {{ $desktopImage.Width }}w" media="(max-width: 399px)" type="image/webp">
<a href="{{ $image.RelPermalink }}" alt="{{ $.Get "alt" }}">
<img src="{{ $desktopImage.RelPermalink }}" width="{{ $desktopImage.Width }}" height="{{ $desktopImage.Height }}" alt="{{ $.Get "alt" }}" />
</a>
{{ end }}
<figcaption>{{ .Get "alt" }}</figcaption>
</figure>
{{ define "main" }}
<div class="home">
{{$posts := ($.Site.GetPage "section" "blog").Pages.ByPublishDate.Reverse}}
{{ range first 1 $posts }}
{{ partial "latest-blog-item.html" . }}
{{ end }}
<section class="post-list">
<h1 class="section-title">Articles récents</h1>
{{ range $elem_index, $elem_val := first 3 $posts }}
{{ with $elem_index }}
{{ partial "blog-item.html" $elem_val }}
{{ end }}
{{ end }}
</section>
<section class="post-list">
<h1 class="section-title">Talks récents</h1>
{{$talks := ($.Site.GetPage "section" "talks").Pages.ByPublishDate.Reverse}}
{{ range first 2 $talks }}
{{ partial "talk-item.html" . }}
{{ end }}
</section>
</div>
{{ end }}
<div class="menu-list">
{{ $current := . }}
{{ range .Site.Menus.nav }}
{{ $active := or ($current.IsMenuCurrent "nav" .) ($current.HasMenuCurrent "nav" .) }}
{{ $active = or $active (eq .Name $current.Title) }}
{{ $active = or $active (and (eq .Name "Blog") (eq $current.Section "post")) }}
{{ $active = or $active (and (eq .Name "Tags") (eq $current.Section "tags")) }}
<a href="{{ .URL }}" {{ if $active }}aria-current="page" class="active"{{ end }} >{{ .Name }}</a>
{{ end }}
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment