feat(SEO): add Json-LD meta and tags

content/actualites/journee-du-velo-2024/index.md

@@ -5,6 +5,9 @@ featured_image:
     src: stand_discussions.jpg
     caption: Sebastien Denise et Alexis Martini discutent de l'état des aménagements cyclables avec deux visiteurs sur notre stand.
     alt: Quatre personnes discutant devant un stand.
+tags:
+    - manifestation
+    - Aubevoye
 ---
 Ce samedi 20 avril 2024, l'association VMEMS a participé à la journée du vélo organisé par la mairie du Val d'Hazey. Première édition de ce type évènement jamais réalisé auparavant à Gaillon-Aubevoye, elle a regroupé plusieurs acteurs locaux de la mobilité et des loisirs à vélo.
 <!--more-->

hugo.toml

@@ -9,6 +9,7 @@ enableGitInfo = true
 
 [params]
 dateFmt = "2006-01-02 15:04"
+ISO8601 = "2006-01-02T15:04:05-07:00"
 [params.contact]
 email = "contact@vmems.fr"
 website = "https://vmems.fr"

layouts/_default/single.html

@@ -11,6 +11,14 @@
                     <span>Mis à jour le <b><time>{{ . | time.Format ":date_full" }}</time></b></span>
                 {{ end }}
             </p>
+        <p class="article__tags">
+            {{- range $index, $element := .Params.tags -}}
+                {{- with $element -}}
+                    <span>{{- if $index -}}, {{- end -}}</span>
+                    <a href="{{ "/tags/" | relLangURL }}{{ . | urlize }}">{{ . }}</a>
+                {{- end -}}
+            {{ end }}
+        </p>
     
 
         {{ if .Params.featured_image }}
@@ -26,12 +34,11 @@
         {{ end }}
         {{ end }}
 
-            {{ range .Params.tags }}
-               <a href="{{ "/tags/" | relLangURL }}{{ . | urlize }}">{{ . }}</a>
-            {{ end }}
-			<div>
+
+        <div class="article__text">
             {{ .Content }}
         </div>
+        
 		</article>
 	</main>
 {{ end }}

layouts/index.html

@@ -11,8 +11,12 @@
                     />
                 </div>
                 <div class="landing__slogan__content col-12 col-lg-9 mt-4 mt-md-0 d-flex flex-column justify-content-center align-items-center">
-                    <h1 class="text-center">Ensemble, rendons Gaillon-Aubevoye cyclable !</h1>
-                    <h5 class="text-center mt-3">Association Vélo et Mobilités en Eure-Madrie-Seine</h5>
+                    <h1 class="text-center">
+                        Ensemble, rendons Gaillon-Aubevoye cyclable !
+                    </h1>
+                    <h5 class="text-center mt-3">
+                        Association Vélo et Mobilités en Eure-Madrie-Seine
+                    </h5>
                 </div>
             </div>
             </div>
@@ -86,9 +90,7 @@
         </section>
         <section class="landing__section odd" id="landing-need-help">
             <div class="container">
-            {{/*
-            How to help us
-            */}}
+                {{/* How to help us */}}
                 <h2>Nous avons besoin de votre aide ! 🙋</h2>
                 <ul>
                     <li>Pour parler de l'association et des initiatives autour de vous…</li>
@@ -106,9 +108,7 @@
         </section>
         <section class="landing__section" id="landing-last-news">
             <div class="container">
-            {{/*
-            Show last 3 news
-            */}}
+            {{/* Show last 3 news */}}
             <h2>Nos dernières actualités</h2>
             {{ $news := where .Site.RegularPages "Section" "in" "actualites" }}
             {{ range $index, $element := $news }}{{ if eq $index 0 }}

layouts/partials/head.html

@@ -1,6 +1,9 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 
+{{- $title := partialCached "data/title" . .RelPermalink -}}
+<title>{{ $title }} {{ if not .IsHome }}- VMEMS{{ end }}</title>
+
 {{- $description := partialCached "data/description" . .RelPermalink -}}
 <meta name="description" content="{{ $description }}">
 
@@ -8,15 +11,18 @@
 <meta name="author" content="{{ . }}">
 {{ end }}
 
-{{- $title := partialCached "data/title" . .RelPermalink -}}
-
-<title>{{ $title }} {{ if not .IsHome }}- VMEMS{{ end }}</title>
+{{ if .IsPage }}
+{{- with .Params.tags -}}
+<meta name="keywords" content="{{ range $i, $e := . }}{{ if $i }}, {{ end }}{{ $e }}{{ end }}">
+{{ end }}
+{{- end -}}
 
 <link rel="canonical" href="{{ .Permalink }}">
 
-{{ partial "opengraph/include.html" . }}
+{{- partial "metas/opengraph.html" . -}}
+{{- partial "metas/json-ld.html" . -}}
 
-{{ range .AlternativeOutputFormats }}
+{{- range .AlternativeOutputFormats -}}
 <link rel="{{ .Rel }}" type="{{ .MediaType.Type }}" href="{{ .Permalink | safeURL }}">
 {{ end }}
 
@@ -29,7 +35,7 @@
 <meta name="theme-color" content="#198754">
 
 <!-- Note: j'ai galérer à rajouter du scss car en fait y'avait déja une variable $style de définit plus haut... -->
-{{ $style := resources.Get "sass/main.scss" | resources.ToCSS  | resources.Fingerprint }}
+{{- $style := resources.Get "sass/main.scss" | resources.ToCSS  | resources.Fingerprint -}}
 <link rel="stylesheet" href="{{ $style.Permalink }}" integrity="{{ $style.Data.Integrity }}">
 
 <meta name="htmx-config" content='{"selfRequestsOnly":false}'>

layouts/partials/metas/json-ld.html

@@ -0,0 +1,23 @@
+{{ if .IsPage }}
+{{ if eq .Section "actualites" }}
+<script type="application/ld+json">
+{
+    "@context" : "http://schema.org",
+    "@type" : "BlogPosting",
+    "articleSection" : "{{ .Section | title }}",
+    "name" : "{{ .Title }}",
+    "headline" : "{{ .Title }}",
+    "description" : "{{ if .Description }}{{ .Description }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ end }}{{ end }}",
+    "inLanguage" : "fr-FR",
+    "author" : "{{ .Params.author }}",
+    "creator" : "VMEMS",
+    "accountablePerson" : "VMEMS",
+    "datePublished": "{{ .PublishDate.Format $.Site.Params.ISO8601 }}",
+    "dateModified" : "{{ .Lastmod.Format $.Site.Params.ISO8601 }}",
+    "url" : "{{ .Permalink }}",
+    "wordCount" : "{{ .WordCount }}",
+    "keywords" : [ {{ range $i, $e := .Params.tags }}{{ if $i }}, {{ end }}{{ $e }}{{ end }} ]
+}
+</script>
+{{ end }}
+{{ end }}