Choosing the right Rich Text Editor - BBCode output

pat4 · 2024-11-15T17:52:45.654Z

I have been using the Bubble RTE and it has worked for me for the most part, but I’ve hit a place where I need more control on the formatting choices the user can make. For instance, I do not want the user to change fonts (just an example). But I do need the ability to Bold, List, and few other things. I like the Bubble RTE because the output is BBCode so I can use the result in Bubble Text Elements where controlling the style globally is easy.

Quite a few RTEs have the control functionality I desire, but the output is HTML. It may sound like no big deal, because I could preset the font, fontsize, and other formatting defaults and the HTML will display correctly. But… if I decide to change the font or fontsize (or other options), I have to go make changes to the RTE element on the page… and I use this RTE 50+ times. It isn’t practical. A good example is the ZQ Rich Text Editor form Zerocode (I am happy to pay handsomely for plugins). Great control for formatting choices, but HTML output. (And I am a fan of ZQ plugins.)

It could be if there is a better way for me to get what I need so all recommendations are welcome… but the perfect solution would be a RTE plugin that gives me lots of configuration control of the formatting elements available to the user and also has output that integrates well with Bubble’s text elements.

Advice greatly need. Thanks!

pat4 · 2024-11-15T21:46:31.663Z

I may have solved my problem by reading through lots of posts in the forum as well as using Bing Copilot. I started with Styling the Bubble Rich Text Editor - Please halp posted in Oct 2023 where @ian11 was also trying to customize the styling of the RTE. From there I scrolled through the original plugin announcement of the RTE Plugin Announcement: Rich Text Editor and then turned to Bing Copilot. I needed to eliminate the font picker, the H1-H4 buttons, the strikethrough button, and the link button. This style snippet in the HTML header of the page where I was using Bubble’s RTE multiple times did the trick.

<style>
/* Hide all pickers */
.ql-snow .ql-picker {
display: none;
visibility: hidden;
}
/* Hide the strikethrough button */
.ql-toolbar .ql-strike {
display: none;
visibility: hidden;
}
/* Hide the fourth child element in .ql-formats - H1-H4 buttons */
.ql-formats:nth-child(4) {
display: none;
visibility: hidden;
}
/* Hide the link button */
.ql-toolbar .ql-link {
display: none;
visibility: hidden;
}
</style>

If you end up reading this post and see “gotchas” that I have missed, I will greatly appreciate feedback.

system · 2025-01-24T17:53:43.683Z

This topic was automatically closed after 70 days. New replies are no longer allowed.