Mettre une carte sur ton propre site
Une carte peut vivre à l'intérieur d'une page que tu as déjà (une page d'équipe, un billet d'intranet, un site fait pour l'occasion), comme un cadre qui porte la vraie carte plutôt qu'une image de carte.
Ce qu'est l'intégration
La même carte, affichée sans Noya autour : pas d'en-tête du site, pas de commandes d'édition, rien qui appartienne à la personne qui l'a faite. Les gens qui lisent ta page peuvent lire les cartes et ajouter la leur, exactement comme sur le lien. La carte encadrée n'est pas indexée par les moteurs de recherche, et tout ce qui y ramène vers Noya s'ouvre dans un nouvel onglet plutôt qu'à l'intérieur de ta page.
Le code
Colle ceci là où la carte doit se trouver, et remplace YOUR_WALL_ID par l'identifiant de ta carte, la partie de son lien qui vient après /c/.
<iframe data-noya-src="https://noya.so/embed/YOUR_WALL_ID" width="100%" height="720" style="border:0;width:100%;" title="Noya" loading="lazy" allow="camera; microphone" referrerpolicy="no-referrer-when-downgrade"></iframe>
<script>(function(d){var w="https://noya.so/noya-embed.js",v=function(){if(window.noyaEmbed){window.noyaEmbed.load()}else{d.querySelectorAll("iframe[data-noya-src]:not([src])").forEach(function(f){f.src=f.getAttribute("data-noya-src")})}};if(window.noyaEmbed){v()}else if(!d.querySelector('script[src="'+w+'"]')){var s=d.createElement("script");s.src=w;s.async=true;s.onload=v;s.onerror=v;(d.body||d.head).appendChild(s)}})(document);</script>Ce que tu peux changer
Le cadre est une iframe ordinaire, donc ses attributs sont à toi de modifier pour aller avec la page où il atterrit.
| Attribut | Ce qu'il fait |
|---|---|
| width | La largeur du cadre. Laissé à 100%, il prend la largeur de la colonne où il se trouve. |
| height | La hauteur du cadre, en pixels. Le cadre ne grandit pas avec la carte, donc une carte plus haute que ça défile à l'intérieur. |
| title | Le nom du cadre pour les lecteurs d'écran, et pour quiconque navigue sans images. |
| loading | Laissé sur lazy, la carte n'est chargée que lorsqu'un lecteur arrive près d'elle. |
Un exemple complet
Le même extrait avec l'identifiant d'une carte rempli et une hauteur choisie pour la page où elle se trouve.
<iframe data-noya-src="https://noya.so/embed/b7Kq2mXsPnR4" width="100%" height="1000" style="border:0;width:100%;" title="Noya" loading="lazy" allow="camera; microphone" referrerpolicy="no-referrer-when-downgrade"></iframe>
<script>(function(d){var w="https://noya.so/noya-embed.js",v=function(){if(window.noyaEmbed){window.noyaEmbed.load()}else{d.querySelectorAll("iframe[data-noya-src]:not([src])").forEach(function(f){f.src=f.getAttribute("data-noya-src")})}};if(window.noyaEmbed){v()}else if(!d.querySelector('script[src="'+w+'"]')){var s=d.createElement("script");s.src=w;s.async=true;s.onload=v;s.onerror=v;(d.body||d.head).appendChild(s)}})(document);</script>Ce qui vaut la peine
- Laisse la largeur à 100% pour que la carte suive ta mise en page au lieu d'en sortir.
- Choisis une hauteur dans laquelle tu es content de faire défiler, et augmente-la quand la carte se remplit.
- Garde le chargement différé. Une carte plus bas dans une page ne doit pas retarder le haut de celle-ci.
- Intègre le lien d'invitation, jamais le lien de remise. Une carte sur une page que tu as publiée est une carte sur laquelle les gens sont censés écrire, ce qui n'est pas ce à quoi sert le lien de remise.
Où le trouver dans Noya
Tu n'as rien à copier depuis cette page. Ouvre Intégrer dans la barre d'outils de la carte et l'extrait est là, avec l'identifiant de cette carte déjà dedans, et un bouton qui copie le tout.