Rico

A Rich Text Editor for basic WYSIWYG HTML editing on the web.

Try Rico now here inside your browser!

Features for editors:

• Basic text editing:
  • Bold, italic, small, striketrough, links.
  • Headings, subheadings, ordered and unordered lists, blockquotes and code sections.
  • Undo and redo.
• Enter starts a new paragraph.
• Shift + Enter starts a new line in the same paragraph.
• The editor height expands automatically with text without scrollbars. No more scrollbars within scrollbars, because those are very annoying.
• Intuitive and accessible user interface.
• All toolbar actions are accessible using the keyboard shortcuts (see below).
• Just text. No images, attachments, uploads or anything else.

Features for developers:

• Only HTML5 Semantic tags, so no div tags inside the editor text.
• p tag is the default tag, for normal paragraphs.
• Bring your own CSS (basic CSS included). No CSS inside javascript.
• Smallish size (for a web rich text editor): 125 KB minified.
• To use it, upload the provided file dist/rico.iife.min.js to your server and include it in your html.

Screenshot:

You can customize the look of Rico using CSS. This is how it looks with the default styling:

Keyboard shortcuts:

Action	Icon	Keys	Tag
Bold		Command + B	<strong>
Italic		Command + I	<em>
Small		Command + Shift + B	<small>
Strikethrough		Command + Shift + I	<del>
Link		Command + Shift + K	<a>
Undo		Command + Z
Redo		Command + Shift + Z
Heading T1		Command + G	<h1>
Heading T2		Command + Shift + G	<h2>
Quoted text		Command + E	<blockquote>
Preformatted text		Command + Shift + E	<pre>
Bulleted list		Command + B	<ul>
Numbered list		Command + B	<ol>
Indent		Tab
Unindent		Shift + Tab

Note: Linux and Windows users use Control instead of Command.

Rico is a fork of Trix.

Motivation:

We've been using Trix since 2017, and it was our editor of choice because it is open source, extensible, intuitive and much nicer overall than the alternatives.
But we had different needs and made lots of changes, so we decided to fork it.

Changes we've made:

• Remove all attachment and image upload code and assets.
• Remove all CSS and SVG from the javascript.
• Use <p> instead of <div> for default text blocks.
• Add <h2> for subheadings.
• Add <small> for small text.
• Remove the ability to nest <blockquote>.
• Pressing Shift + Enter inserts a <br>.
• Pressing Enter inside a <p> adds a new paragraph.
• Rename all code instances of Trix and trix by Rico and rico, respectively.
• Keep most of the tests and update them to make them pass with our changes.

Thank you:

Trix was created by Javan Makhmali and Sam Stephenson, with development sponsored by Basecamp.

Thanks to Alberto Fernández-Capel for the translation from coffeescript to javascript.

Copyright and licensing

Trix is copyright of 37signals, LLC. and has a MIT license.

Rico is copyright of setastart.com.
Rico is licensed with the EUPL 1.2 license.

© 2024 setastart.com