Pembersih HTML ke Webflow Rich Text

Tempel HTML yang berantakan dari situs lama, ekspor WordPress, Google Docs, atau Word. Kamu akan mendapatkan markup semantik yang bersih, yang diterima elemen Rich Text Webflow dan impor CMS tanpa sampah kode.

Diperbarui
Pratinjau bersih

HTML bersih (impor CSV / API)

Data kamu tidak pernah meninggalkan komputer kamu. Semua proses berjalan 100% secara lokal di browser kamu.

Apakah alat ini membantu?0.0 0 penilaian

devpack.app adalah utilitas independen dan tidak berafiliasi dengan, disponsori oleh, atau didukung oleh Webflow, Inc. maupun Figma, Inc. Webflow dan Figma adalah merek dagang dari pemiliknya masing-masing.

Ubah Markdown dari ChatGPTClaude, Notion, atau GitHub jadi rich text berformat untuk langsung ditempel ke elemen Rich Text atau field CMS Webflow.Markdown ke Webflow Rich Text →

Cara menggunakan HTML ke Webflow Rich Text

  1. Tempel sumber HTML, atau salin teks berformat dari Google Docs, Word, atau halaman web lalu tempel langsung ke kotak (format akan tertangkap sebagai HTML).
  2. Tool ini menghapus class, ID, inline style, data attribute, dan pembungkus layout, serta mengubah gaya tebal/miring menjadi <strong>/<em>.
  3. Klik Salin rich text lalu tempel ke elemen Rich Text atau field CMS Webflow. Kamu juga bisa menyalin HTML yang sudah bersih untuk impor CSV.

Kenapa perlu membersihkan HTML sebelum impor ke Webflow?

Elemen Rich Text Webflow hanya mendukung sejumlah tag tertentu: heading, paragraf, link, tebal, miring, daftar, kutipan, gambar, figure, dan line break. Konten yang dipindahkan dari WordPress atau CMS lain, atau disalin dari Google Docs dan Word, biasanya dibungkus <div> dan <span> dengan class, inline style (font-family, color, font-size), atribut data-*, dan paragraf kosong. Jika diimpor apa adanya, sampah kode ini akan menimpa tipografi Webflow, membuat jarak antarbaris tidak konsisten, dan membuat CMS menjadi berat.

Apa yang dilakukan pembersih ini

  • Menghapus semua class, id, style, dan data attribute (tetap menyimpan href/target/rel pada link serta src/alt pada gambar).
  • Membuka pembungkus div, span, section, font, dan sejenisnya. Div yang hanya berisi teks diubah menjadi paragraf.
  • Mengubah gaya Google Docs/Word (font-weight:700, font-style:italic) menjadi <strong> dan <em> yang semantik.
  • Menghapus script, iframe, form, dan SVG. Opsional, H1 bisa diubah menjadi H2 (biasanya H1 adalah judul halaman), serta paragraf kosong dan &nbsp; bisa dihapus.

Migrasi dalam jumlah besar

Untuk satu blog penuh, bersihkan isi setiap postingan lalu impor lewat impor CSV CMS Webflow atau API. Keduanya menerima HTML untuk field Rich Text. Kalau kamu menulis konten baru dalam Markdown, gunakan Markdown ke Webflow Rich Text saja.

Juga dicari sebagai: webflow rich text, bersihkan html, hapus class html, hapus inline style, import cms webflow, google docs ke webflow, wordpress ke webflow, html ke webflow.

Tool yang cocok dipakai bersama HTML ke Webflow Rich Text

  • HTML ke Markdown — Tempel HTML, atau salin rich text langsung dari halaman web, Google Doc, atau email, lalu dapatkan Markdown yang rapi untuk README, wiki, atau static site kamu.
  • Formatter HTML — Tempel markup yang berantakan atau sudah di-minify, lalu dapatkan HTML rapi dengan indentasi konsisten — termasuk blok <style> dan <script> di dalamnya.
  • SVG ke Webflow — Paste SVG dari Figma dan salin ke Webflow sebagai Custom Elements asli.
  • Perbaiki Smart Quotes — Kode hasil salin dari Slack, Notion, Word, atau blog tidak bisa dijalankan?

Pertanyaan yang sering diajukan

Kenapa teks yang saya tempel di Webflow memakai font yang salah?
Konten yang disalin dari Docs, Word, atau situs lain sering membawa inline style. Bersihkan dulu di sini agar gaya Rich Text bawaan Webflow bisa diterapkan.
Apakah Webflow Rich Text mendukung tabel?
Tidak secara bawaan. Secara default tabel digantikan dengan catatan. Kamu bisa menambahkannya kembali dengan elemen Embed di dalam rich text.
Apakah gambar tetap dipertahankan?
Tag gambar tetap dipertahankan (hanya src dan alt). Untuk hasil terbaik, unggah gambar ke Assets Webflow agar mendapatkan ukuran responsif.
Bisakah saya memakai HTML ini untuk API Webflow atau impor CSV?
Bisa. Salin HTML bersih dari hasil, lalu masukkan ke kolom Rich Text di CSV atau ke payload API.
Bisakah saya memasang HTML ke Webflow Rich Text sebagai aplikasi web dan memakainya offline?
Bisa. HTML ke Webflow Rich Text adalah aplikasi web (PWA) yang bisa dipasang. Pemasangannya lewat browser kamu, bukan diunduh dari toko aplikasi. Klik Pasang aplikasi di bagian atas halaman ini di Chrome atau Edge (Windows, macOS, Linux, ChromeOS) atau di Android. Di iPhone dan iPad, gunakan Bagikan → Tambahkan ke Layar Utama, dan di Safari 17+ pada Mac, gunakan File → Tambahkan ke Dock. Setelah itu, aplikasi akan terbuka di jendelanya sendiri dengan ikonnya sendiri. Karena berjalan sepenuhnya di browser kamu, aplikasi ini tetap bisa dipakai offline. Firefox di desktop tidak bisa memasang aplikasi web. Cara memasang aplikasi.

Tool terkait