Обеспечьте эквивалент представления читателя Firefox с самого сайта

Я хотел бы предоставить функцию, которая очень похожа на представление читателя Firefox для всех браузеров, встроив ее в сайт, над которым я работаю, чтобы ее можно было включить, щелкнув переключатель или что-то подобное.

Я нашел репозиторий Mozilla Readability, который описывает себя как:

Автономная версия библиотеки удобочитаемости, используемой для Firefox Reader View.

Я импортировал это на свой сайт и добавил переключатель для замены содержимого главной страницы HTML-кодом, полученным из этой библиотеки, но он предоставляет только некоторые функции представления читателя Firefox. Он убрал различные нетекстовые элементы, оставив только простую страницу с текстом и изображениями, но ему не хватает стиля, используемого в представлении читателя Firefox, и, что более важно, ему не хватает плавающей панели инструментов, которая позволяет пользователю динамически настраивать стиль страницы / текста. , или попросите прочитать им текст.

Затем я нашел исходный код для представления Firefox для читателя , но интеграция его с сайтом, над которым я работаю, кажется, по крайней мере, довольно сложной, если не невозможной без значительного переписывания. Есть ли способ встроить представление читателя Firefox на веб-сайт?

Это не дубликат раздела " Как я могу внедрить Mozilla readability.js на свой веб-сайт?", как я уже реализовал readability.jsдля сайта, над которым я работаю. Вот урезанный пример того, как я это делаю:

      import { Readability } from '@mozilla/readability';

function htmlToElement(htmlString) {
    const template = document.createElement('template');
    template.innerHTML = htmlString.trim();
    return template.content.firstChild;
}

document.getElementsByClassName('layoutmain')[0].replaceWith(
    htmlToElement(
        new Readability(document.cloneNode(true)).parse().content
    )
);

Я использую Svelte , который выполняет импорт в приведенном выше коде, но я думаю, что это в значительной степени не имеет отношения к рассматриваемому вопросу.

0 ответов

Другие вопросы по тегам