Images
Ajoutez une image ou une galerie d’images à une page, ajoutez des variantes d’image pour le mode sombre et redimensionnez et alignez les images selon vos besoins
Vous pouvez insérer des images dans votre page, puis choisir leur taille et décider si elles doivent être alignées à gauche, au centre ou à droite. Vous pouvez aussi, si vous le souhaitez, ajouter un texte alternatif et/ou une légende à votre bloc d'image.
Exemple d'un bloc d'image
Importer une image
Il existe deux façons d'ajouter des images à votre contenu :
Glissez-déposez l'image depuis votre système de gestion de fichiers directement dans un bloc vide de votre page.
Ajoutez un bloc d'image à votre page et utilisez le Sélectionner des images panneau latéral qui apparaît à droite de la fenêtre.
Si vous suivez le second processus, vous pouvez choisir de téléverser un fichier, de sélectionner un fichier déjà téléversé, de coller l'URL d'une image ou d'ajouter une image depuis Unsplash à l'aide de la recherche intégrée.
GitBook vous permet de téléverser des images jusqu'à 100 Mo par fichier.
Il n'y a pas de limite définie pour le nombre total de ressources dans une section, bien que GitBook se réserve le droit de bloquer des comptes en cas d'abus. Pour les fichiers plus volumineux que la limite de téléversement, stockez-les dans un service comme Google Drive ou Dropbox et créez un lien vers eux depuis votre page.
Les GIF animés ont une limite de 200 images par fichier. Les fichiers volumineux — GIF compris — ralentissent le chargement de votre page, évitez donc autant que possible de téléverser directement de gros fichiers.
Créer une galerie d'images
Ajouter plus d'une image à un bloc d'image créera une galerie. Pour ce faire, ouvrez le menu des options 
et choisissez Ajouter des images… pour rouvrir le Sélectionner des images panneau latéral.
Pour supprimer une image d'une galerie, ouvrez le menu Modifier 
de l'image que vous souhaitez supprimer et appuyez sur la touche Suppr ⌫ touche.
Ajouter des images pour le mode clair et le mode sombre
Vous pouvez définir des images différentes pour les versions en mode clair et en mode sombre de votre site publié. GitBook affichera automatiquement la bonne image en fonction du mode utilisé par votre visiteur.
Pour ajouter une image pour le mode sombre, survolez votre image, ouvrez le menu Modifier et cliquez sur Remplacer l'image 
.
Dans le menu déroulant, choisissez Ajouter une image pour le mode sombre. Une fois cela défini, vous pouvez remplacer l'une ou l'autre image depuis ce même menu.
Remarque : GitBook ne prend actuellement pas en charge les images en mode clair et sombre dans certains cas, y compris les couvertures de page ou les couvertures d'image sur les cartes.
Images en mode clair et sombre via la synchronisation GitHub/GitLab
Vous pouvez également ajouter des images en mode clair et sombre dans Markdown via la syntaxe HTML (<picture> et <source>).
Pour les images en bloc, utilisez l'élément HTML <figure> avec un <picture> et <source> à l'intérieur :
Pour les images en ligne (des images placées dans le texte), utilisez <picture> avec un <source> à l'intérieur :
Remarque : Nous ne prenons pas encore en charge la syntaxe propre à GitHub via #gh-dark-mode-only ou #gh-light-mode-only.
Redimensionnement
Pour redimensionner votre image, survolez-la et ouvrez le menu Modifier . Cliquez sur le bouton Taille pour modifier la taille de votre image parmi les options disponibles.
Petit – 25 % de la taille de l'image
Moyenne – 50 % de la taille de l'image
Grande – 75 % de la taille de l'image
Adapter – Supprime toutes les spécifications de taille et affiche l'image à sa taille réelle ou plafonnée à une largeur maximale de 735 pixels pour les images plus grandes.
Si votre image est plus large que l'éditeur, GitBook limitera plutôt la largeur de l'image à celle de l'éditeur, et le redimensionnement sera basé sur cette limite.
Redimensionnement des images via Git Sync
Si vous souhaitez davantage de contrôle sur la taille de votre image, vous pouvez préciser la taille exacte à l'aide de Markdown dans GitHub ou GitLab.
Lorsque nous exportons une image, nous utilisons la balise HTML <img/>. Conformément aux spécifications, nous pouvons préciser les dimensions de l'image à l'aide des attributs width et height qui n'acceptent que des valeurs en pixels ou une combinaison d'un nombre et d'un % signe.
Les variantes valides pour spécifier les dimensions de l'image sont :
<img width="100" /> Définit l'image à une largeur de 100 pixels
<img width="100%" /> Définit l'image en taille réelle (bien que cela soit limité par l'éditeur)
Alignement des images
Par défaut, les blocs d'image affichent votre image à sa taille réelle, alignée au centre.
Pour modifier l'alignement d'une image, ouvrez le menu des options et choisissez l'alignement souhaité. Cela n'affectera que les images plus étroites que l'éditeur, ou les images que vous avez redimensionnées.
Encadrer des images
Vous pouvez ajouter un cadre aux blocs d'image afin de donner à vos images une apparence cohérente et de les distinguer visuellement du contenu qui les entoure.
Pour ajouter un cadre à une image, survolez-la et ouvrez le menu des options et activez le Avec cadre interrupteur.
Représentation en Markdown
Pourquoi mon image ne se charge-t-elle pas ?
Une erreur "impossible de charger l’image" signifie que l’image a été modifiée ou supprimée à sa source. Si vous avez intégré une image par URL plutôt que de la téléverser, GitBook dépend de cette URL — si l’image est déplacée ou disparaît de la source, elle cesse d’apparaître sur votre page.
Pour résoudre le problème, téléversez l'image directement dans GitBook, ou mettez à jour l'URL si l'emplacement de l'image a changé. L'erreur peut également apparaître lorsque vous copiez une image d'une section à une autre, car chaque section possède son propre répertoire de fichiers — téléversez de nouveau l'image dans la nouvelle section.
Vous pouvez consulter tous les fichiers téléversés dans une section dans l'onglet Bibliothèque à côté de Pages en haut de la table des matières.
Mis à jour
Ce contenu vous a-t-il été utile ?