🖋 Build your own Rich Text Editor [New Plugin]


Now you can build your own native Rich Text Editor using native Bubble Actions.

See Demo | Open Editor | Get Plugin

The plugin has 35+ Bubble’s actions to enable you to build your perfect native text editor.

As we are developing the plugin primarily for the internal use, customer care of high standard is guaranteed.


P.S. The original thread was taken over by the discussion on the Error ‘$jscomp is not defined’.


4 Likes

Can I (1) enable my user to adjust the line height or (2) create a default for the line height? Specifically, we’re looking for it to be 1.3e

It doesn’t appear that Bubble allows to actually change the line height in the “native” text formatting section of the element editor (line font size is currently changed).

However, please could you give us a couple of days to implement this for you?
The time is such so that I can test all other feature still work correctly after I add this option to specify line height.

Hey,

Just to keep you informed, we are struggling to make this work while keeping all other features in accord.

Could you please let me know how critical this line height setting is for you.

I will carry on and keep you informed :slight_smile:

We have some updates :tada:


Line height:

  • Now the default line height may be adjusted
  • Line height can be updated dynamically (pease see the demo here)

Video [availible, but still being tested]

  • Now, by default, when a video is inserted, it dynamically takes the full width of the editor and proportionally adjusts its height
  • Now you can set the video’s width as a % of the editor’s width as well as set a ratio for the video’s height (the default ratio is 16:9) - before you could set the size of the video in px’s only (this option is still available)
  • A little bonus - now you can specify padding for the video (i.e. empty space around it), making it all look a little nicer :slightly_smiling_face:

We have generally tidied up the editor, so we hope you will enjoy it even more.
Please do let us know if there are any requests for additional features and/or if we may be of help to set it up for you.


See the Demo | Open the Editor | Get the Plugin

1 Like

Line height was critical so this is exciting. I’ll take a look. Thanks!

1 Like

HI @funwtp

I have subscribed for this plugin, Is there a way to save output in BBCode format?

because bubble text element can only display rich text in BBcode.

I am not sure, the plugin has a viewer more (by turning off the editing function).

Is this rich text editor reliable? compared to Bubbles legacy Rich Text Editor which we still use…

HI @funwtp

The reason i need BBcode is because there is a bug in the editor, the editor won’t display new data if data source comes from a custom state. (unless the bug could be fixed).

You can visit this page for better visualization of the bug issue. https://www.amhired.com/sandbox2

Illustration 1 :
“sample job 1” was selected / clicked from Repeating Group on the left to pass custom state job post for display on the right constructed using XL-Rich Text Editor

Illustration 2 :
When “sample job 2” was selected and passed to custom state job post for display, you can see the title is changed but XL-Rich Text Editor still displaying description from “sample job 1”.

The answer is yes, but you can always try it for yourself :slight_smile:

Are you convinced that it is a bug with the editor? Did you try to feed the data from records rather than a custom state? Please try again, if you are convinced, I will have a look but the mix of Bubble with Repeating Groups topped with custom states sounds a bit too much for Bubble to handle (in my view…)

Please let us know, and I will try to assist as much as I can (including fixing the bug if there is one :slight_smile: )

It seems your own editor plugin page doesn’t handle videos and images:

Would love this plugin, but I need images to work

I tried feeding data from record but same issue occurs. So i think it needs to be fixed.

What I tried this time is when a row in repeating group is clicked, unique ID of that row get passed to custom state called “Group JobpostB’s unique ID” as text, and XL editor set up as below:

I need to have a repeating group next to XL editor on the same page, so that every time people click on a new row in the repeating group, the XL editor display the relevant info. This is to save people from going back and forth pages.

HI @funwtp

In addition when the Editor is blank, people have to click precisely in the green box area (the first line) to be able to start typing. Whereas red box area won’t let people set focus and start typing when clicked.

Can this be fixed so that the whole area is clickable? because this could affect user experience and cause user abandonment.

I tried to put the Editor in to a Group Element, and created a workflow to set focus on the Editor when Group Element is clicked, please refer below:

But the problem is that it only works the first time clicking, additional clicking may cause:

  1. it to lose focus; or
  2. the text cursor may appear within the editor but soon as you start typing it will lose focus.
1 Like

But, as another user pointed out, it doesn’t handle images ( or videos). This is really the point of having Rich Text Editor simple copy and paste of a chart or image into the box…

@alejandrowunderlich

Could you please go on the demo page and see if you can see an image and a video working with the RTE?

DEMO is here - https://xl-rich-text-editor.bubbleapps.io/

Please let me know if you can or cannot see the image and the video on the demo page like below?

My apologies! I can see the problem. Could you please give me a couple of days to fix it (it used to work properly). I will come back on this.

1 Like

Nope, can’t see the images below the editor. This is how it looks:

No image, no video

Can I ask what browser you use?