Як поставити листівку на власний сайт
Листівка може жити всередині сторінки, яка в тебе вже є, — сторінки команди, допису в інтранеті, сайту до події, — як рамка з живою листівкою всередині, а не як її картинка.
Що таке вбудована листівка
Та сама листівка, показана без Noya навколо: без шапки сайту, без інструментів редагування, без нічого, що належить тому, хто її зробив. Ті, хто читає твою сторінку, можуть прочитати листівки і додати свої — так само, як за посиланням. Листівка в рамці не індексується пошуковими системами, а все, що з неї веде назад у Noya, відкривається в новій вкладці, а не всередині твоєї сторінки.
Код
Встав це туди, де має стояти листівка, і заміни YOUR_WALL_ID на власний ідентифікатор листівки — ту частину її посилання, що йде після /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>Що можна змінити
Рамка — це звичайний iframe, тож його атрибути можна правити так, як зручно сторінці, на яку він потрапляє.
| Атрибут | Що він робить |
|---|---|
| width | Яка рамка завширшки. Якщо лишити 100%, вона займе ширину тієї колонки, у якій стоїть. |
| height | Яка рамка заввишки, у пікселях. Рамка не росте разом із листівкою, тож вища листівка прокручується всередині неї. |
| title | Як рамка називається для програм читання з екрана і для тих, хто переглядає сторінку без зображень. |
| loading | Якщо лишити lazy, листівка завантажиться лише тоді, коли читач прокрутить сторінку до неї. |
Готовий приклад
Той самий фрагмент із підставленим ідентифікатором листівки і висотою, підібраною під сторінку.
<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>Що варто зробити
- Лиши ширину 100%, щоб листівка йшла за твоєю версткою, а не випирала з неї.
- Обери висоту, всередині якої не шкода прокручувати, і збільш її, коли листівка наповниться.
- Не чіпай lazy. Листівка десь унизу сторінки не має затримувати її верх.
- Вбудовуй посилання-запрошення, ніколи не для вручення. Листівка на опублікованій сторінці — це листівка, на якій мають писати, а посилання для вручення не для цього.
Де це знайти в Noya
Нічого копіювати з цієї сторінки не треба. Відкрий «Вбудувати» на панелі інструментів листівки — фрагмент уже там, з ідентифікатором саме цієї листівки, і поруч кнопка, що копіює все одразу.