devpack
EnglishEspañolPortuguêsBahasa IndonesiaFrançaisРусскийDeutschTiếng Việt
Аудит сайта

Очистка HTML для Webflow Rich Text

Вставьте «грязный» HTML со старого сайта, экспорта из WordPress, Google Docs или Word и получите чистую семантическую разметку, которую элемент Rich Text в Webflow и импорт CMS принимают без лишнего мусора.

Обновлено
Предпросмотр очистки

Чистый HTML (CSV-импорт / API)


    
 Ваши данные никогда не покидают ваш компьютер. Вся обработка выполняется на 100% локально в вашем браузере.
Был ли этот инструмент полезен?0.0 Оценок: 0

    
    
devpack.app — независимый сервис, он не связан с Webflow, Inc. или Figma, Inc. и не спонсируется и не одобряется ими. Webflow и Figma являются товарными знаками их владельцев.

    Конвертируйте Markdown из ChatGPTClaude, Notion или GitHub в форматированный текст для Webflow Rich Text и CMS.Markdown в Webflow Rich Text →
    
    

      
Как пользоваться: HTML в Webflow Rich Text
  1. Вставьте HTML-код или скопируйте отформатированный текст из Google Docs, Word или веб-страницы и вставьте его прямо в поле (форматирование сохранится как HTML).
  2. Инструмент удаляет классы, ID, inline-стили, data-атрибуты и обёртки верстки, а стили жирного и курсивного текста превращает в <strong> и <em>.
  3. Нажмите Копировать rich text и вставьте результат в элемент Rich Text или поле CMS в Webflow либо скопируйте чистый HTML для импорта через CSV.


Зачем очищать HTML перед импортом в Webflow?


Элемент Rich Text в Webflow поддерживает ограниченный набор тегов: заголовки, абзацы, ссылки, жирный и курсивный текст, списки, цитаты, изображения, figure и переносы строк. Контент, перенесённый из WordPress или другой CMS, либо скопированный из Google Docs и Word, приходит обёрнутым в <div> и <span> с классами, inline-стилями (font-family, color, font-size), атрибутами data-* и пустыми абзацами. Если импортировать это как есть, мусор переопределит типографику Webflow, нарушит интервалы и раздует CMS.


Что делает очистка


    

  • Удаляет все классы, id, стили и data-атрибуты (сохраняет href/target/rel у ссылок и src/alt у изображений).
    • 

  • Снимает обёртки div, span, section, font и подобные; блоки с одним текстом превращает в абзацы.
    • 

  • Преобразует стили Google Docs и Word (font-weight:700, font-style:italic) в семантические <strong> и <em>.
    • 

  • Удаляет скрипты, iframe, формы и SVG; при необходимости меняет H1 на H2 (заголовок страницы обычно является H1), а также удаляет пустые абзацы и &nbsp;.
    • 



Массовый перенос


Если нужно перенести целый блог, очистите текст каждой статьи и импортируйте его через CSV-импорт CMS или API Webflow: оба варианта принимают HTML для полей Rich Text. Пишете новый контент в Markdown? Используйте вместо этого Markdown в Webflow Rich Text.
Также ищут как: webflow rich text, очистка html, удалить классы html, удалить inline стили, импорт cms webflow, google docs в webflow, wordpress в webflow, html для webflow.
Инструменты, которые хорошо сочетаются с HTML в Webflow Rich Text
  • HTML в Markdown — Вставьте HTML или скопируйте текст прямо с веб-страницы, из Google Docs или письма, и получите аккуратный Markdown, который можно сразу использовать в README, вики или статическом сайте.
  • HTML форматер — Вставьте минифицированную или неаккуратную разметку и получите чистый HTML с единообразными отступами, включая встроенные блоки <style> и <script>.
  • SVG в Webflow — Вставьте SVG из Figma и скопируйте его в Webflow как настоящие Custom Elements.
  • Умные кавычки → прямые — Код, скопированный из Slack, Notion, Word или блога, не запускается?
Часто задаваемые вопросы
Почему вставленный в Webflow текст сохраняет не тот шрифт?
Контент, скопированный из Docs, Word или других сайтов, часто содержит inline-стили. Сначала очистите его здесь, чтобы применились собственные стили Rich Text в Webflow.
Поддерживает ли Webflow Rich Text таблицы?
Нативно — нет. По умолчанию таблицы заменяются примечанием. Чтобы вернуть их, добавьте таблицу через элемент Embed внутри rich text.
Изображения сохраняются?
Теги изображений сохраняются (только src и alt). Для лучшего результата загрузите изображения в Assets Webflow, чтобы для них создались адаптивные размеры.
Можно ли использовать HTML для API Webflow или CSV-импорта?
Да. Скопируйте чистый HTML из результата и поместите его в колонку поля Rich Text или в тело запроса API.
Можно ли установить HTML в Webflow Rich Text как веб-приложение и пользоваться им офлайн?
Да. HTML в Webflow Rich Text — это веб-приложение (PWA), которое можно установить из браузера, без скачивания из магазина приложений. В Chrome или Edge (Windows, macOS, Linux, ChromeOS) или на Android нажмите вверху этой страницы «Установить приложение»; на iPhone и iPad используйте «Поделиться → На экран «Домой»», а в Safari 17+ на Mac — «Файл → Добавить в Dock». После этого приложение откроется в отдельном окне со своим значком, и так как оно полностью работает в браузере, оно продолжит работать офлайн. Firefox на компьютере не умеет устанавливать веб-приложения. Как работает установка.

      
    

    
    
Похожие инструменты
localMarkdown в Webflow Rich TextВставьте Markdown, проверьте предпросмотр и скопируйте его как форматированный текст. Заголовки, списки,…localHTML в MarkdownВставьте HTML или скопируйте текст прямо с веб-страницы, из Google Docs или письма, и получите аккуратный…localHTML форматерВставьте минифицированную или неаккуратную разметку и получите чистый HTML с единообразными отступами,…localSVG в WebflowВставьте SVG из Figma и скопируйте его в Webflow как настоящие Custom Elements. Каждый <svg>, <path> и <g>…localУмные кавычки → прямыеКод, скопированный из Slack, Notion, Word или блога, не запускается? Обычно виноваты типографские «умные»…localГенератор типографической шкалыВыберите базовый размер шрифта и коэффициент — малая терция, большая терция, чистая кварта, золотое…