50 lines
3.5 KiB
Markdown
50 lines
3.5 KiB
Markdown
|
---
|
||
|
|
title: "Exemples images"
|
||
|
|
date: 2023-07-14T09:16:33+02:00
|
||
|
|
lastmod: 2023-07-30T09:16:33+02:00
|
||
|
|
draft: true
|
||
|
|
categories: ["publication numérique"]
|
||
|
|
tags: ["exemples", "images", "légendes"]
|
||
|
|
postimage: "posts/example_images/ben-sweet-2LowviVHZ-E-unsplash-800.jpg"
|
||
|
|
postimagedescription: "silhouette d'un homme de profil sur fond noir et bleu."
|
||
|
|
postimage_width: "800"
|
||
|
|
postimage_height: "450"
|
||
|
|
imageLicence:
|
||
|
|
imageAuthor: "Ben Sweet"
|
||
|
|
imageUrl: "https://unsplash.com/photos/2LowviVHZ-E"
|
||
|
|
imageService: "Unsplash"
|
||
|
|
imageServiceUrl: "https://unsplash.com/"
|
||
|
|
description: "Ce poste est un brouillon pour documenter les différentes manières d'utiliser la légende lors de l'insertion d'une image avec Hugo."
|
||
|
|
slug: exemples-images
|
||
|
|
---
|
||
|
|
|
||
|
|
Ce poste est un brouillon pour documenter les différentes manières d'utiliser la légende lors de l'insertion d'une image. À la fois pour insérer une simple légende ou pour indiquer une licence si applicable. Le processus est géré grâce au shortcode `figure` par défaut de Hugo ainsi qu'au shortcode personnalisé `img` défini dans le dossier `shortcodes` du thème.
|
||
|
|
|
||
|
|
## Image personnelle
|
||
|
|
|
||
|
|
Sans mention spécifique de licence mais avec ajout d'une légende. La licence est dérivée de celle du site web. On utilise le shortcode `figure` par défaut de Hugo <span style="font-style: italic; font-size: 0.8rem;">(Attention bien penser à retirer les deux ` `` ` supplémentaires avant le `<` et après le `>` dans le code ci-dessous lors de sa réutilisation).</span>
|
||
|
|
|
||
|
|
<pre style="font-size: 0.8rem; text-align: center;">{{`< figure src="/images/posts/example_images/test.jpg" title="Image de randonnée dans les Grisons" >`}}</pre>
|
||
|
|
|
||
|
|
{{< figure src="/images/posts/example_images/test.jpg" title="Image de randonnée dans les Grisons" >}}
|
||
|
|
|
||
|
|
## Image réutilisée avec mention de licence
|
||
|
|
|
||
|
|
Avec mention d'une licence `CC-BY` ou `©` ou toute autre licence du même type. On utilise le shortcode personnalisé `img` <span style="font-style: italic; font-size: 0.8rem;">(Attention bien penser à retirer les deux ` `` ` supplémentaires avant le `<` et après le `>` dans le code ci-dessous lors de sa réutilisation).</span>
|
||
|
|
|
||
|
|
<pre style="font-size: 0.8rem; text-align: center;">{{`< img src="/images/posts/example_images/brioche.jpg" licence="CC-BY" author="Igor Milhit" url="https://igor.milhit.ch/brioche/" >`}}</pre>
|
||
|
|
|
||
|
|
{{< img src="/images/posts/example_images/brioche.jpg" licence="CC-BY" author="Igor Milhit" url="https://igor.milhit.ch/brioche/" >}}
|
||
|
|
|
||
|
|
## Image réutilisée avec simple attribution
|
||
|
|
|
||
|
|
Sans mention explicite de licence mais avec tout de même une attribution parce que c'est la moindre des choses. Cela peut être notamment le cas en utilisant des images de [Unsplash][US] avec la [licence Unsplash][LU].
|
||
|
|
|
||
|
|
On utilise à nouveau le shortcode personnalisé `img` avec une petite variante <span style="font-style: italic; font-size: 0.8rem;">(Attention bien penser à retirer les deux ` `` ` supplémentaires avant le `<` et après le `>` dans le code ci-dessous lors de sa réutilisation).</span>
|
||
|
|
|
||
|
|
<pre style="font-size: 0.8rem; text-align: center;">{{`< img src="/images/posts/example_images/ben-sweet-2LowviVHZ-E-unsplash.jpg" author="Ben Sweet" url="https://unsplash.com/photos/2LowviVHZ-E" service="Unsplash" service_url="https://unsplash.com" >`}}</pre>
|
||
|
|
|
||
|
|
{{< img src="/images/posts/example_images/ben-sweet-2LowviVHZ-E-unsplash.jpg" author="Ben Sweet" url="https://unsplash.com/photos/2LowviVHZ-E" service="Unsplash" service_url="https://unsplash.com" >}}
|
||
|
|
|
||
|
|
[US]: https://unsplash.com
|
||
|
|
[LU]: https://unsplash.com/license
|