Skip to content

Lit, Alpine, htmx…

Anything that can print HTML can use the <owe-editor> tag: Lit, Alpine.js, htmx, Turbo, Ember, Qwik, WordPress and PHP. It fires input and change and takes part in forms.

On this page
Packageopen-wysiwyg-editor(opens in a new tab)

Install

Terminal
npm install open-wysiwyg-editor

Usage

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/open-wysiwyg-editor@1.0.2/dist/style.min.css"
  integrity="sha384-M7pJYu9d/6az43r7DEu11V2wYVSim/wfYwQjrNdn2lOz7ZEiPSh4lW4jwhjKC4RP" crossorigin="anonymous" />
<script src="https://cdn.jsdelivr.net/npm/open-wysiwyg-editor@1.0.2/dist/open-wysiwyg-editor.global.js"
  integrity="sha384-nj2QvSEBeAy8VfG/L3M7Hq+IbVQVrj5RyDnuO0Hy3p7EJrIaMo2Dku4YJoqUiK89" crossorigin="anonymous"></script>

Good to know

  • Load the CDN script and stylesheet once (or import open-wysiwyg-editor/element and style.css), then put the tag in your markup.
  • In Qwik, import the element inside a visible task so it never runs on the server. In WordPress, esc_attr() keeps user content from breaking out of the attribute.

Always sanitize on the server

The editor sanitizes what it loads and produces, but that is not a security boundary: anyone can post any string to your API. Sanitize the HTML again with a library you trust before you store it or render it for other users.

Edit this page on GitHub