Le Blog
Gallica
La Bibliothèque numérique
de la BnF et de ses partenaires

Mettez du Gallica dans votre site web !

0
17 juin 2019

Vous souhaitez intégrer des images ou des documents Gallica à votre blog ou site Web ? Voici le mode d’emploi !

Gallica regorge de documents, d’images, d’objets et d’enregistrements librement utilisables dans le cadre d’un usage non-commercial. Vous pouvez vous en servir sur votre propre site internet, en tant que source ou illustration, comme le font déjà de nombreux Gallicanautes.

Pourquoi utiliser IIIF ?

En utilisant l’API IIIF (pour International Image Interoperability Framework), vous pouvez intégrer directement à votre article un document entier à feuilleter, une image ou une zone choisie de cette image. Cela vous permet de ne pas surcharger votre site : une simple ligne ajoutée dans le code, et l’image ou le document s’affiche. Plus besoin de le télécharger et de le recadrer, tout se fait directement via Gallica. Si vous souhaitez par la suite faire migrer votre site, il n’est plus nécessaire de réenregistrer et de recharger chaque image, car elles seront déjà toutes intégrées dans vos lignes de code. Les images sont cliquables et renvoient à leur source dans Gallica, mais le lecteur reste discret et se fond dans l’identité graphique de votre site.

Comment ça marche ?

Pour intégrer une image entière
Vous souhaitez utiliser une affiche pour illustrer votre article ? L’icône "Partage et envoi par courriel", présente dans le menu de gauche de consultation des documents, ouvre un onglet : sélectionnez dans celui-ci "le document en entier".

lampe.png
 

Indiquez ensuite la taille souhaitée en pixels. En dessous de l’aperçu, qui vous montre donc l’image telle que vous la faites apparaitre, vous trouvez une ligne de code, que vous copiez.

lampe2.png
 

Revenez sur votre site personnel : cliquez sur le bouton "source" de votre éditeur.

source.png
 

Collez votre ligne de code à l’endroit où vous souhaitez la voir apparaitre dans votre texte.

sourcecode.png
 
Revenez sur votre article, vous voyez l’image apparaitre. Vous pouvez alors la réduire ou la déplacer à votre convenance.

Pour intégrer un document à feuilleter
Pour intégrer un document de plusieurs pages que vos lecteurs pourront feuilleter en intégralité directement sur votre site, utilisez aussi l’icône "Partage et envoi par courriel" . Par exemple, cet album d’illustrations maritimes du XVIe siècle regorge de très belles images en couleur, et vous n’arrivez pas à faire un choix.
Après avoir coché "le document en entier", choisissez la taille du lecteur exportable à intégrer dans votre site et sélectionnez dans "Feuilletage" l’option "automatique", qui fera défiler les pages, ou "manuel", qui permettra à vos lecteurs de parcourir les pages à leur rythme.

poissons_feuilletage.png
 

L’option "commencer à la page affichée" est ici utile, puisque les illustrations commencent à la page 53 : choisissez le passage de l’ouvrage que vous voulez mettre en avant.
De la même façon que précédemment, copiez la ligne de code pour la coller dans votre site.

sourcecode2.png
 

Pour intégrer un détail
Vous souhaitez illustrer votre article avec un seul des poissons de cette très belle planche :

En allant dans le menu de gauche, l’icône "Partage et envoi par courriel"  ouvre un onglet, cochez-y "une partie de l’image".

poissons.png
 

Pour profiter de tous les détails de l’illustration, utilisez le zoom, ou les boutons de rotations pour choisir le sens de votre image. A l’aide du curseur de votre souris, sélectionnez la zone du document qui vous intéresse.

poissons2.png
 

Là aussi, vous trouverez sous l’aperçu, à gauche de votre écran, la ligne de code à insérer dans votre article. Revenez à ce moment-là sur votre site personnel, et collez cette ligne de code dans la "source" de votre article.

sourcecode3.png

N'hésitez pas à nous faire des retours et à poser des questions sur ce tutoriel, nous pourrons l'enrichir en conséquence. Surtout, envoyez-nous les adresses de vos pages habillées de Gallica ! Nous serons heureux de les partager et de nous en faire l'écho.

Pour en savoir plus...

 

Ajouter un commentaire

Plain text

  • Aucune balise HTML autorisée.
  • Les adresses de pages web et de courriels sont transformées en liens automatiquement.
  • Les lignes et les paragraphes vont à la ligne automatiquement.