CHAPITRE 11 — Gérer les images et la bibliothèque média

Toutes les images, vidéos et documents que vous utilisez sur votre site transitent par la bibliothèque média. Il s'agit d'un emplacement central : vous téléversez un fichier une seule fois et le réutilisez partout où vous en avez besoin.
Accéder à la bibliothèque
Trois entrées sont possibles :
Depuis le tableau de bord : cliquez sur la carte « Bibliothèque médias ».
Depuis l'éditeur : sélectionnez l'onglet Médias en haut de la colonne gauche.
Depuis un slot image : cliquez sur le bouton « Choisir une image » qui ouvre la bibliothèque dans une fenêtre.
L'organisation de la bibliothèque
La bibliothèque est gérée par site. Si vous administrez plusieurs sites, chacun dispose de sa propre médiathèque indépendante.
Au sein d'un site, les médias sont classés par type :
Type
Formats acceptés
Image
JPG, PNG, WebP, SVG, GIF
Vidéo
MP4, WebM
Document
PDF, DOC et autres formats bureautiques
Téléverser un nouveau média
Méthode A — Bouton « Envoyer un fichier »
Dans la barre d'outils de la bibliothèque, cliquez sur Envoyer un fichier.
Sélectionnez un ou plusieurs fichiers depuis votre poste.
Le ou les fichiers sont téléversés. Une vignette apparaît dans la grille.
Méthode B — Glisser-déposer
Faites glisser une image depuis votre explorateur de fichiers.
Déposez-la directement sur la grille de la bibliothèque.
Le téléversement démarre automatiquement.
Méthode C — Pendant l'édition d'un slot image
Vous éditez un slot de type image dans l'inspecteur.
Cliquez sur Choisir une image.
La bibliothèque s'ouvre. Un bouton Envoyer est disponible en haut.
Téléversez sans interrompre votre flux d'édition.
Conseil — Pour les photographies, le format WebP est recommandé. Il offre un fichier 30 à 50 % plus léger qu'un JPG à qualité équivalente. Le module accepte ce format nativement.
Retrouver un média existant
Au-dessus de la grille, plusieurs filtres sont disponibles :
Recherche : par libellé, référence ou tag.
Type : images, vidéos ou documents.
Site : si vous administrez plusieurs sites.
La grille se met à jour instantanément. Un défilement infini en bas de page charge les médias suivants par lots de cinquante.
Modifier les métadonnées d'un média
Cliquez sur une vignette. Une fenêtre d'édition s'ouvre, organisée en deux colonnes.
Colonne de gauche — Aperçu et utilisation
Aperçu de l'image en taille réelle.
Liste des pages où le média est utilisé : « Utilisé sur N éléments ».
Historique des modifications, présenté de manière dépliable.
Colonne de droite — Champs éditables
Champ
Description
Référence
Identifiant court, réutilisable dans les shortcodes (par exemple 
{{media:ref=hero-1.url}}
).
Libellé
Nom affiché dans la bibliothèque.
Texte alternatif (canonique)
L'attribut 
alt
 par défaut. Important pour le référencement et l'accessibilité.
Tags
Mots-clés facilitant la recherche du média.
Traductions par langue
Section dépliable. Un champ par langue pour traduire le texte alternatif.
Recommandé — Renseignez systématiquement le texte alternatif. C'est ce texte alternatif qui est affiché si l'image ne se charge pas. C'est ce texte alternatif que lit un lecteur d'écran et que Google utilise pour comprendre vos images.
Les variantes générées automatiquement
Lors de chaque téléversement d'image, le module crée automatiquement trois tailles supplémentaires en plus de l'original.
Variante
Dimensions
Usage type
thumb
200 × 200 px
Vignettes, galerie
card
640 × 480 px
Cartes d'articles, mosaïques
wide
1600 × 1200 px
Hero pleine largeur
original
Dimensions natives
Téléchargement, impression
Les variantes sont générées à la demande. Lors de la première utilisation d'une variante (par exemple 
card), elle est créée puis mise en cache.
Supprimer un média
Ouvrez la fenêtre d'édition en cliquant sur la vignette.
En bas à droite, cliquez sur Envoyer à la corbeille.
Note — La suppression est en réalité un marquage : le média n'est pas effacé physiquement du disque. Il est simplement signalé comme inactif et n'apparaît plus dans la grille. Vos pages qui le référencent continuent à l'afficher.
Avertissement — Si le média est encore utilisé, la suppression est par défaut refusée. Le module présente la liste des pages concernées. Soit vous remplacez l'image sur ces pages, soit vous forcez la suppression — auquel cas les pages afficheront une image cassée.
Réimporter le contenu d'un dossier
Si vous avez ajouté des fichiers sans passer par le Studio (FTP, SCP, ou via l'éditeur Dolibarr Website), ils n'apparaissent pas dans la bibliothèque.
Pour les détecter :
Dans la barre d'outils de la bibliothèque, cliquez sur Réimporter.
Le module parcourt le dossier physique du site.
Les fichiers absents de la bibliothèque sont enregistrés.
Conseil — Le module effectue cette réimportation automatiquement toutes les cinq minutes au maximum lors de l'ouverture de la bibliothèque. Le bouton sert uniquement à forcer une réimportation immédiate.
Insérer un média dans un slot de texte riche
Vous éditez un slot de type texte riche.
Au-dessus de la barre d'outils, cliquez sur Insérer un média.
La bibliothèque s'ouvre dans une fenêtre.
Sélectionnez ou téléversez une image.
Le module insère :
une balise 
<img> si vous avez choisi une image,
un lien 
<a> avec le libellé si vous avez choisi un document.
Récapitulatif
Vous savez désormais :
Accéder à la bibliothèque depuis trois entrées différentes.
Téléverser des médias par bouton, par glisser-déposer ou pendant l'édition d'un slot.
Filtrer la bibliothèque par recherche, type ou site.
Modifier les métadonnées (libellé, texte alternatif et traductions, tags).
Comprendre les variantes générées automatiquement (thumb, card, wide).
Supprimer un média en respectant ses utilisations.
Réimporter pour récupérer des fichiers ajoutés hors du Studio.
Insérer un média au curseur dans un slot de texte riche.
Le chapitre suivant aborde le mécanisme de publication, qui sépare votre travail en cours de la version visible publiquement.
Variants WebP (depuis 18.47)
Les déclinaisons d'images (vignette 200×200, carte 640×480, large 1600×1200) sont générées au format WebP — plus léger à qualité égale — pour les originaux JPEG et PNG. L'original n'est jamais converti. Pour revenir au comportement historique, posez la constante INFRASSTUDIO_MEDIA_WEBP à 0.
Le point focal (depuis 18.47)
Dans l'inspecteur d'un média, cliquez sur l'image pour poser une croix de point focal : le sujet important de l'image. Les recadrages des variants s'ancrent alors sur ce point (fini le visage coupé par un recadrage centré), et le champ de shortcode {{media:ref=X.focal}} expose la position au format CSS object-position pour les templates qui veulent en profiter.