#8 - Insérer des médias dans une page web (aka embed code)

L'un des avantages du web actuel est qu'il permet de mêler toutes sortes de médias : de l'image, de la vidéo, du son, des cartes, des visionneuses de documents, des jeux, etc., sans avoir nécessairement recours à des développements techniques compliqués et coûteux. Le dernier reportage vidéo consacré au service peut par exemple facilement être diffusé dans une actualité du site.

 

Les archives municipales de Dunkerque déménagent par villededunkerque

 

De nombreux sites d'hébergement de médias (en vrac Dailymotion, Vimeo, Youtube, Flickr, Commons, Calameo ou autre) proposent, en plus des traditionnels outils de partage Facebook, Twitter, Envoyer à un ami, le code d'intégration qui permet d'insérer le média visionné dans une page Internet.
 
Pour récupérer le code du média à insérer dans sa page Internet, il faut repérer l'icône de partage, qui ressemble généralement à l'un des pictogrammes ci-dessous. Il est parfois indiqué "embed code" (pour "code d'intégration") ; sinon, il faudra survoler les différentes icônes pour trouver la bonne.

Icônes de partage

Intégrer une vidéo Dailymotion

Les appellations diffèrent d'un site à l'autre, mais il faut ensuite copier (Ctrl + C ou "clic droit copier") le code d'intégration qui commence souvent par <iframe> quelque chose.
 
Intégrer une image Flickr                   

Il s'agit ensuite de coller le code copié dans le champ de saisie de texte de votre page web... mais pas n'importe comment ! Il faut basculer l'éditeur en mode HTML : l'accès se fait généralement par une icône de la barre d'outils qui ressemble à des balises "<>" ou "HTML". Un clic sur l'icône ouvre un champ de saisie HTML, dans lequel il faut coller (Ctrl + V, ou "clic droit coller") le code d'intégration.

Editeur de texte

 

Exemple d'icône pour basculer en éditeur de texte HTML avec exemple de code d'intégration

Une fois la page enregistrée, il est probable que le média sera juste représenté par une zone grisée. Pas de panique ! Le média ne sera affichée que sur la partie visible du site, mais pas dans la partie Administration. Publiez la page et vérifiez le résultat.

Média externe intégré dans une page web

La procédure peut sembler un peu compliquée au premier abord, mais elle vaut la peine de s'y habituer car elle permet d'insérer une foule de contenus didactiques et assez sympathiques (patience, d'autres tutoriels arrivent...). En voici un petit aperçu

 

 

 

 

Mots-clés: coller, copier, embed code, Internet, médias, valorisation

ImprimerE-mail

Ajouter un Commentaire


Code de sécurité
Rafraîchir