Plugin Announcement: Rich Text Editor

sam8 · January 29, 2020, 3:15pm

We are excited to announce that we’ve just released the Beta version of an updated Rich Text Editor plugin by Bubble! For the duration of this Beta phase, please report any feedback or bugs you encounter on this thread. The new Rich Text Editor has a modern look and dynamic toolbar options to make the input highly customizable. Here’s an overview of the latest features:

Customizable Editor Properties

Select complexity based on your needs
Not every Rich Text use case requires the full suite of toolbar options. Select ‘Basic’ or ‘Full’ complexity in the property editor to meet your needs as you see fit.

Toolbar vs. Tooltip
Show the full toolbar menu on the page, or use the subtle tooltip menu to access rich text options when highlighting the text you wish to enhance.

Media Features

A picture’s worth a thousand words…
Upload an image to the rich text input right from your computer. The image will be saved to the Bubble database, so you never have to worry about losing it. You can resize your images in the rich text input by clicking on them and dragging the corners.

Actions and Events

Set your focus
Set the focus (cursor) to the end of your rich text content.

Reset the input
Clear out your rich text input or reset it to initial content.

Text change event
Trigger an event when the value of a rich text input changes.

**Note: The legacy version of the Rich Text Editor by Bubble will eventually be deprecated. However, it is still available at the present time, and users that have this plugin installed on their app will still have access to it even after it is deprecated.

gf_wolfer · January 29, 2020, 3:59pm

Perfect timing for me, trying it out asap

gf_wolfer · January 29, 2020, 4:05pm

Can we have more granular control over the toolbar options?

Use case: I want the Basic options (bold, italic, links) but also the Image option. Using the ‘Full’ toolbar is a little too much for my use case

avern87 · January 29, 2020, 4:06pm

I agree with this! And, noticed that the rich text input being used on the forum seems to have this level of control. Maybe it’s possible or coming for the plugin as well! Would love to be able to only show the tools I want to make available.

eli · January 29, 2020, 4:06pm

Can we get the element name changed on one of the plugins? When replacing a legacy input element with the new one they both show up in the dropdown as ‘Rich Text Input’ and there is no way to tell which is the new one and which is the old one.

eli · January 29, 2020, 4:14pm

This works very nicely! Huge improvement, thanks!

boston85719 · January 29, 2020, 4:22pm

I believe this will make it a more valuable component. I’d like if it was possible to have checkboxes for each of the controls to really customize it so we only have the options available we want our users to have access to.

lockymadera · January 29, 2020, 4:23pm

The ability to add custom fonts would be absolutely amazing.

lantzgould · January 29, 2020, 4:40pm

Agree that custom font support would make this worth using. Also adding that the ability to copy and a paste a photo into the editor, rather than uploading would be a big bonus too.

AliFarahat · January 29, 2020, 5:42pm

Great one! Several questions please,

What is the output being generated here (HTML / BBCode)?
Can we have an option to limit fonts and/or set a default font style from the list of fonts we have?
Can we enable tables?

Thanks team…

sam8 · January 29, 2020, 10:18pm

Hi! To address your questions:

The output being generated is in BBCode, so the saved output from the Rich Text Editor can be used in Bubble text elements.
If no font is specified by the Rich Text Editor, you can use the Bubble text element styles to define a default font when you display your rich text. In the editor, you can limit font by choosing the basic complexity option.
Tables are not available in this editor unfortunately

sam8 · January 29, 2020, 10:19pm

This is great feedback! I’ll change the name of the legacy element for clarity.

maryfox20 · January 30, 2020, 1:40am

Second this. - Custom fonts.

duke.severn · January 30, 2020, 2:56am

+1 fonts. We’re at 3.

Also if at all possible, the native “set focus” action on inputs.

keith · January 30, 2020, 4:54am

Via-a-vis fonts: Bubble just uses Google’s font loader lib, right? (I do the same thing in CG Pro to allow custom font support — meaning any Google font OR any Adobe Fonts / “TypeKit” bundle which is all that matters at this point.) Just do that and people will be fine.

(For extra credit, let plugins instantiate multiple of the default styling interface input set. What people are really asking for/complaining about here are artificial limitations of Bubble’s editor interface API. You know what I’m saying.)

linhduynguyen · January 30, 2020, 7:51pm

Could we have an option to center everything as a default? I’m utilizing the “basic” complexity and I would like all of the icons to be centered as well as the text by default.

sam8 · January 30, 2020, 9:16pm

The set focus option is available in this plugin!

michaelchang5161 · January 31, 2020, 2:22am

This is exciting!!

A bug I discovered:

“Extend to Fit” doesn’t quite work

troy.roberge · January 31, 2020, 3:57am

This is a very exciting new feature. I’ll need this fairly soon. I also would love to see custom fonts!

luke2 · January 31, 2020, 7:12am

Great update to the editor @sam8. Is this due to replace the rich text editor in the Bubble editor as well once stable? Cheers