Встраивание блога на ваш сайт

Как разместить статью блога Papera внутри страницы на вашем собственном сайте. Встраивание это небольшой фрагмент с <iframe>, который вы вставляете один раз. Он подтягивает живую статью из Papera, оформляет себя сам и растягивается под содержимое. Ничего не нужно устанавливать, и не нужно размещать у себя никаких скриптов.

1. Опубликуйте статью

Встраивание указывает на публичный адрес статьи, поэтому статья должна быть опубликована. Откройте узел блога, опубликуйте его и убедитесь, что страница открывается по адресу:

https://papera.dev/blog/<your-slug>

См. Публикация статьи блога про элементы управления публикацией и про выбор slug.

2. Скопируйте код встраивания

В редакторе блога откройте меню Экспорт и выберите Копировать код встраивания. Откроется окно с готовым фрагментом, нажмите Копировать. Вы получите примерно это:

<iframe src="https://papera.dev/embed/blog/my-article"
        title="My article" loading="lazy"
        style="width:100%;border:0;height:600px"></iframe>
<script>
  addEventListener("message", (e) => {
    if (e.data?.type !== "papera:embed:height") return;
    const f = document.querySelector('iframe[src*="/embed/blog/my-article"]');
    if (f) f.style.height = e.data.height + "px";
  });
</script>

3. Вставьте фрагмент на свою страницу

Поместите фрагмент в HTML вашего сайта туда, где должна появиться статья: в блок «произвольный HTML» вашей CMS, в шаблон или в обычный HTML-файл. Встраивание идёт без интерфейса вокруг: только статья и её оформление, поэтому она вписывается в вашу страницу, а не показывает вокруг себя приложение Papera.

Небольшой <script> слушает сообщение о высоте от iframe и подгоняет размер под статью, поэтому внутренней полосы прокрутки не появляется. Если ваш сайт не может выполнить скрипт (или вы его не вставили), iframe просто сохранит фиксированную высоту height:600px, а всё остальное продолжит работать. Ссылки внутри встроенной статьи открываются в новой вкладке, поэтому читателя никогда не уводит с вашей страницы.

Ограничьте круг сайтов, которые могут встраивать статью

По умолчанию встраиваемую статью может показать у себя любой сайт. Чтобы закрыть это, перечислите разрешённые сайты (источники) в настройках встраивания статьи. Только эти источники смогут показать её у себя, а iframe любого другого сайта останется пустым. Публичная страница /blog/<slug> при этом продолжает работать для всех.

Как поддерживать встраивание в актуальном виде

Встраивание всегда отражает последнюю опубликованную версию. Отредактируйте статью и опубликуйте снова, и каждая страница, которая её встраивает, обновится сама. Заново копировать фрагмент не нужно. Если вы снимете статью с публикации, встраивание вернёт обычную ошибку 404, так же как и публичная страница.