Le bloc Intégration affiche dans votre page une vidéo, une publication, un lecteur audio, une carte, une présentation, un formulaire ou un agenda d’un fournisseur autorisé. Il part de son adresse ou de son code d’intégration. Cette page décrit les gestes pour intégrer, les fournisseurs acceptés, le format du cadre et ce que le fournisseur apprend de vos visiteurs.
Intégrer un contenu
Trois gestes posent un bloc Intégration.
| Geste | Résultat |
|---|---|
| Coller l’adresse seule dans un paragraphe vide | Le paragraphe devient un bloc Intégration. |
| Coller dans la page le code d’intégration du fournisseur, celui de Partager puis Intégrer sur YouTube par exemple | Le bloc Intégration garde l’adresse du code. |
| Insérer le bloc depuis l’inserteur | Le bloc attend une adresse. Les étapes suivantes détaillent ce geste. |
- Dans l’éditeur, ouvrez l’inserteur et choisissez Intégration, ou cherchez
vidéo,youtubeoucarte. Ajouter un bloc détaille les façons d’insérer un bloc. - Dans le champ Adresse de l’intégration, collez l’adresse ou le code d’intégration d’un fournisseur autorisé, puis sortez du champ. Le champ ne garde que l’adresse d’un code d’intégration.
- Si l’adresse est acceptée, le contenu s’affiche dans le bloc.
- Remplissez le Titre (accessibilité), par exemple « Vidéo de présentation » ou « Plan d’accès ».
Le code d’une carte OpenStreetMap ou d’une publication de X, de TikTok ou de Bluesky porte autre chose qu’un cadre. Collez-le dans le champ Adresse de l’intégration.
Les fournisseurs acceptés
Quand la colonne À coller indique une adresse, l’adresse de la page suffit : le site en tire l’adresse du lecteur du fournisseur. Pour les autres, collez le code d’intégration que donne le fournisseur sous Intégrer, ou sous Partager puis Intégrer.
| Famille | Fournisseurs | À coller |
|---|---|---|
| Vidéo | YouTube, Vimeo, Dailymotion, TikTok, Loom, Wistia | L’adresse de la vidéo. |
| Vidéo | TED, VideoPress | Le code d’intégration de la vidéo. |
| Réseaux sociaux | X, LinkedIn, Instagram, Facebook, Pinterest | L’adresse de la publication. |
| Réseaux sociaux | Bluesky | Le code d’intégration de la publication. |
| Musique et podcasts | Spotify, SoundCloud, Deezer, Apple Music, Apple Podcasts | L’adresse du titre, de l’album, de la liste ou de l’épisode. |
| Musique et podcasts | Mixcloud, Bandcamp, Ausha, Acast | Le code d’intégration du lecteur. |
| Cartes et visites | Google Maps et Google My Maps, OpenStreetMap, uMap | Le code d’intégration de la carte. |
| Cartes et visites | Matterport | L’adresse de la visite. |
| Cartes et visites | Kuula | Le code d’intégration de la visite. |
| Cartes et visites | Doterr, la carte des lieux de médiation numérique de la Région Centre-Val de Loire | L’adresse de la carte. |
| Présentations et documents | Google Drive | L’adresse du fichier, partagé avec toute personne disposant du lien. |
| Présentations et documents | Google Docs, Sheets, Slides | Le code de Fichier > Partager > Publier sur le Web. |
| Présentations et documents | Canva, Genially, Issuu, Calaméo, Scribd, Speaker Deck, SlideShare | Le code d’intégration du document. |
| Formulaires | Typeform, Google Forms | L’adresse du formulaire. |
| Formulaires | Tally, Jotform, Microsoft Forms | Le code d’intégration du formulaire. |
| Réservation et agendas | Calendly | L’adresse de la page de réservation. |
| Réservation et agendas | Google Agenda (agenda ou page de réservation), Zenchef | Le code d’intégration de l’agenda ou du module de réservation. |
Une adresse raccourcie par le fournisseur, comme vm.tiktok.com, pin.it ou forms.gle, n’est pas reconnue : collez l’adresse complète ou le code d’intégration.
Quand l’adresse est refusée
Le bloc garde l’adresse et affiche Ce type d’adresse n’est pas accepté. Contactez l’équipe technique si cela vous paraît anormal. Écrivez-nous pour demander un fournisseur. Nous l’ajoutons s’il sert ses pages en HTTPS, se laisse intégrer et reste stable. Une carte doit avoir son équivalent en texte dans la page, une adresse ou une liste de lieux.
Le bouton Insérer comme un simple lien remplace le bloc par un paragraphe qui porte un lien vers l’adresse.
Onglet Réglages
| Réglage | Effet | Valeur par défaut |
|---|---|---|
| Adresse de l’intégration | L’adresse ou le code d’intégration du contenu. | Vide |
| Titre (accessibilité) | Le nom du contenu, annoncé par les lecteurs d’écran. Vide, il est remplacé par un libellé générique qui ne dit rien au visiteur. | Vide |
| Ancre HTML (panneau Avancé) | Un identifiant pour pointer le bloc avec une adresse terminée par #. | Vide |
Onglet Styles
Le bloc se règle dans les états Par défaut, Survol et Actif. Pour une vidéo, il prend le format du lecteur : 16/9, ou 9/16 pour TikTok. Il affiche un instant Proportions réglées automatiquement à suivi du format. Pour un agenda, une carte, une publication ou un lecteur audio, réglez la hauteur ou les proportions vous-même.
| Panneau | Guide |
|---|---|
| Taille et espacement | La largeur, la hauteur et les Proportions, voir Régler la taille, les bordures et les effets. |
| Couleurs | Colorer un bloc |
| Images de fond | Poser un arrière-plan |
| Bordures, Effets, Transitions | Régler la taille, les bordures et les effets |
Le bloc n’a pas d’onglet Animations : pour faire apparaître une vidéo au défilement, animez le Conteneur qui l’entoure.
La vie privée des visiteurs
Un contenu intégré est demandé au fournisseur par le navigateur du visiteur. Pour tous les visiteurs et sans réglage, le site réduit ce que cette demande révèle.
| Information | Reçue | Détail |
|---|---|---|
| Le compte du visiteur | Non | Le contenu s’ouvre sans les cookies du visiteur : le fournisseur ne rattache pas la visite à son compte Google, Meta ou Spotify. |
| L’adresse de votre site | Non | Le fournisseur voit un site Lovely Render, le même pour tous les sites. |
| L’adresse IP et le navigateur | Oui | Dès que le lecteur se charge, quand le visiteur approche du bloc en faisant défiler la page. |
Le lecteur ne connaît pas le compte du visiteur. Spotify ne joue que des extraits de 30 secondes et une vidéo YouTube réservée aux personnes connectées ne se lit pas. Les publications Instagram ou Facebook s’affichent sans mentions J’aime ni commentaires.
Sur téléphone
Un format réglé par les proportions garde sa forme à toutes les largeurs : une vidéo en 16/9 reste en 16/9 sur un téléphone. Une hauteur fixe reste la même quelle que soit la largeur.
Accessibilité
Le Titre (accessibilité) est le nom que les lecteurs d’écran donnent au contenu intégré. Remplissez-le. Le panneau Accessibilité de l’éditeur le rappelle. Vérifier l’accessibilité de vos pages décrit le panneau.
Limites
- Seuls les fournisseurs de la liste sont acceptés.
- Un bloc sans adresse acceptée n’affiche rien sur le site.
- Une vidéo copiée depuis un autre site qui l’héberge lui-même arrive en bloc Média vide : déposez-y votre fichier.