.png)
3 months ago
6
RayEditor is a modern, customizable, and lightweight WYSIWYG content editor built with pure JavaScript.
It offers a seamless writing experience with support for rich text formatting, code blocks, media uploads, and more.
Perfect for blogs, CMS platforms, documentation tools, and any web application requiring rich content editing.
Editor Preview
Editor preview will appear here once initialized.
Features
Text Formatting
- Bold, Italic, Underline
- Strikethrough, Case Transformations
- Subscript & Superscript
Headings & Lists
- H1 to H6 headings
- Ordered & Unordered lists
- Nested list support
Code Support
- Inline code snippets
- Syntax-highlighted code blocks
- Multiple language support
Media Support
- Image upload & resizing
- File attachments
- Drag & drop support
Tables
- Create and modify tables
- Add/remove rows & columns
- Responsive by default
Advanced Features
- Full undo/redo history
- Text & background colors
- Customizable toolbar
Setup Guide
1. Include RayEditor via CDN
2. Add an Editor Container
3. Initialize RayEditor
Upload Endpoint Requirements
Your '/upload-file/' endpoint should return JSON with a url property containing the path to the uploaded file.
📥 setRayEditorContent(content)
This function sets the content of the editor dynamically. It replaces the current content with the provided HTML string.
Usage:
Note: Use valid HTML to ensure proper rendering in the editor.
📤 getRayEditorContent()
This function retrieves the current HTML content of the editor. It's useful for saving or previewing the editor content.
Usage:
Returns: A string containing the editor's inner HTML.
Why Choose RayEditor?
Lightweight
Zero external dependencies, fast loading.
Customizable
Adaptable toolbar, features & appearance.
Framework Agnostic
Works with any JavaScript framework.
Benefits
Lightweight
Minimal footprint with zero external dependencies, fast loading times.
Customizable
Toolbar, features, and appearance can be tailored to your needs.
Framework Agnostic
Works with any JavaScript framework or vanilla JS projects.
