Making a document editor: need advice

Need help App Organization
1

Hello,

After playing around with the new responsive layout, I got affected by some creative frenzy and decided I would do some document editor that emulates Google Docs, but with boxed paragraph element like on the WordPress or Wix Blog Post Editor (it lets you add new sections, like paragraphs).

Bubblin’ at zap speed, I got a document directory and a basic document editor page off the ground this afternoon.

image
image1919×823 24.1 KB

image
image1919×842 14.8 KB

However, I stopped dead in my tracks when I had to think of how to implement formatting, such as letting the user customize font, spacing and margins.

I’m able to do this from the back end, but there is no way to create a workflow that will create a new style, and conditions won’t let input dynamic style except color.

So this means I can’t let the app user change some settings that will impact the text style of the text, right?

If so then what way do I have to go about in order to achieve that? Does that mean I need to do HTML? Alternatively I could let the user input some markdown which would turn into HTML.

I just totally didn’t plan that. So now I’m trying to think what the best way to design this app would be. :sweat_smile:

Anyone with some advice?

1 Like
2

I’m pretty sure there is a rich text editor plugin. If you use this to let the user created the document. Then using the same thing, but making sure the content is the current documents data, it should store and retrieve the way it was formatted.

Alternatively, you could still use this same plugin to create the document, but then use a “Text” to display it as that can read HTML :slight_smile: - I hope this helped!,

James

3

Right! There is. In fact Bubble has a Rich Text Editor plugin, but it has the toolbar attached to the text area, which prevents from doing pagination (I’d need the toolbar separated from the text area).

image
image1917×861 40.6 KB

Alternatively I need a Rich Text Input that would have no toolbar and would have some workflow triggers allowing to edit the text.

Or I need at the very very least some plugin that allows to detect the cursor or highlighted text with workflows that allow to add text on either side of the highlighted text or cursor.

With that second one, if I were to implement markdowns for example, I could easily have Ctrl+B add a * before and after the text, which would then be turned into BB Code [b] and appear as bold text on the text area.