devpack
EnglishDeutschFrançaisEspañolPortuguês (Brasil)
Website-Check

HTML zu Webflow Rich Text Cleaner

Füge unsauberes HTML ein, etwa von einer alten Website, einem WordPress-Export, aus Google Docs oder Word. Du erhältst sauberes, semantisches Markup, das Webflows Rich-Text-Element und CMS-Import ohne Ballast akzeptieren.

Aktualisiert am
Bereinigte Vorschau

Bereinigtes HTML (CSV-Import / API)


    
 Deine Daten verlassen nie deinen Computer. Die Verarbeitung erfolgt zu 100 % lokal im Browser.

    
devpack.app ist ein unabhängiges Tool und steht in keiner Verbindung zu Webflow, Inc. oder Figma, Inc. und wird von diesen weder gesponsert noch empfohlen. Webflow und Figma sind Marken ihrer jeweiligen Inhaber.

    
    

      
So nutzt du: HTML zu Webflow Rich Text
  1. Füge den HTML-Quelltext ein oder kopiere formatierten Text aus Google Docs, Word oder einer Webseite und füge ihn direkt in das Feld ein (die Formatierung wird als HTML übernommen).
  2. Das Tool entfernt Klassen, IDs, Inline-Styles, data-Attribute und Layout-Wrapper und wandelt fette und kursive Formatierungen in <strong>/<em> um.
  3. Klicke auf Rich Text kopieren und füge den Inhalt in ein Webflow-Rich-Text-Element oder CMS-Feld ein. Alternativ kopierst du das bereinigte HTML für einen CSV-Import.


Warum solltest du HTML vor dem Import in Webflow bereinigen?


Webflows Rich-Text-Element unterstützt einen klar begrenzten Satz an Tags: Überschriften, Absätze, Links, Fett, Kursiv, Listen, Zitate, Bilder, Figures und Zeilenumbrüche. Inhalte, die aus WordPress oder einem anderen CMS migriert oder aus Google Docs und Word kopiert wurden, kommen in <div>s und <span>s mit Klassen, Inline-Styles (font-family, color, font-size), data-*-Attributen und leeren Absätzen an. Unverändert importiert, überschreibt dieser Ballast deine Webflow-Typografie, erzeugt inkonsistente Abstände und blättert dein CMS auf.


Was der Cleaner macht


    

  • Entfernt alle Klassen, IDs, Styles und data-Attribute (behält href/target/rel bei Links sowie src/alt bei Bildern).
    • 

  • Löst div, span, section, font und ähnliche Wrapper auf und macht reine Text-Divs zu Absätzen.
    • 

  • Wandelt Google-Docs- bzw. Word-Formatierungen (font-weight:700, font-style:italic) in semantisches <strong> und <em> um.
    • 

  • Entfernt Scripts, iFrames, Formulare und SVGs. Optional wandelt es H1 in H2 um (der Seitentitel ist meist die H1) und entfernt leere Absätze sowie &nbsp;.
    • 



Massenmigrationen


Bei einem ganzen Blog bereinigst du den Inhalt jedes Beitrags und importierst ihn über den CMS-CSV-Import oder die API von Webflow. Beides akzeptiert HTML für Rich-Text-Felder. Schreibst du neue Inhalte in Markdown? Dann nutze stattdessen Markdown zu Webflow Rich Text.
Auch gesucht als: webflow rich text, html bereinigen, klassen entfernen, inline styles entfernen, webflow cms import, google docs zu webflow, wordpress zu webflow, html cleaner webflow.
Passende Tools zu: HTML zu Webflow Rich Text
  • HTML zu Markdown — Füge HTML ein – oder kopiere Rich Text direkt aus einer Webseite, einem Google Doc oder einer E-Mail – und erhalte aufgeräumtes Markdown, das du in eine README, ein Wiki oder eine statische Seite einfügen kannst.
  • HTML Formatter — Füg minifiziertes oder unübersichtliches Markup ein und erhalte sauber und einheitlich eingerücktes HTML – inklusive eingebetteter <style>- und <script>-Blöcke.
  • SVG zu Webflow — Füge ein SVG aus Figma ein und kopiere es als echte Webflow Custom Elements – jedes <svg>, <path> und <g> wird zu einem Element, das du im Navigator auswählen, mit Klassen versehen und bearbeiten kannst.
  • Smart Quotes Fixer — Code aus Slack, Notion, Word oder einem Blog läuft nicht?
Häufige Fragen
Warum behält eingefügter Text in Webflow die falsche Schriftart?
Inhalte aus Docs, Word oder anderen Websites enthalten oft Inline-Styles. Bereinige sie zuerst hier, damit die eigenen Rich-Text-Styles von Webflow greifen.
Unterstützt Webflow Rich Text Tabellen?
Nicht nativ. Tabellen werden standardmäßig durch einen Hinweis ersetzt. Du kannst sie mit einem Embed-Element innerhalb des Rich Textes wieder einfügen.
Bleiben Bilder erhalten?
Bild-Tags bleiben erhalten (nur src und alt). Für beste Ergebnisse lade Bilder in die Assets von Webflow hoch, damit sie responsive Größen erhalten.
Kann ich das HTML für die Webflow-API oder den CSV-Import verwenden?
Ja. Kopiere die bereinigte HTML-Ausgabe und füge sie in die Spalte des Rich-Text-Feldes bzw. in das API-Payload ein.
Kann ich HTML zu Webflow Rich Text als Web-App installieren und offline nutzen?
Ja. HTML zu Webflow Rich Text ist eine installierbare Web-App (PWA) – sie wird über Ihren Browser installiert und nicht aus einem App-Store heruntergeladen. Klicken Sie oben auf dieser Seite in Chrome oder Edge (Windows, macOS, Linux, ChromeOS) auf „App installieren“ oder verwenden Sie auf Android-Geräten „Teilen“ → „Zum Startbildschirm hinzufügen“ auf dem iPhone und iPad bzw. „Datei“ → „Zum Dock hinzufügen“ in Safari 17+ auf einem Mac. Die App öffnet sich dann in einem eigenen Fenster mit einem eigenen Symbol, und da sie vollständig in Ihrem Browser ausgeführt wird, funktioniert sie auch offline. Firefox auf dem Desktop kann keine Web-Apps installieren. So funktioniert die Installation.

      
    

    
    
Ähnliche Tools
localMarkdown zu Webflow Rich TextMarkdown einfügen, die Vorschau prüfen und als formatierten Rich Text kopieren. Überschriften, Listen,…localHTML zu MarkdownFüge HTML ein – oder kopiere Rich Text direkt aus einer Webseite, einem Google Doc oder einer E-Mail – und…localHTML FormatterFüg minifiziertes oder unübersichtliches Markup ein und erhalte sauber und einheitlich eingerücktes HTML –…localSVG zu WebflowFüge ein SVG aus Figma ein und kopiere es als echte Webflow Custom Elements – jedes <svg>, <path> und <g>…localSmart Quotes FixerCode aus Slack, Notion, Word oder einem Blog läuft nicht? Typografische „Smart Quotes“, Gedankenstriche…localSchriftgrößen-Skala GeneratorWähle eine Basisschriftgröße und ein Verhältnis — Kleine Terz, Große Terz, Quarte, Goldener Schnitt — und…