This plugin allows you to dynamically highlight different set of keywords in an html text using different colors, one per set. You can specify what set of keywords should be highlighted, the highlighted background color and text color of each set. Furthermore, the highlight could be based on case sensitive or case insensitive.
IMPORTANT NOTE: If you just want to highlight words using one UNIQUE highlight color, it is recommendable to use the plugin 'Word Highlighter', since it has simpler usage.
After installing the plugin, you will have two new elements: 'Html Word MultiHighlighter' and ‘Highlighter Parameter'.
For each set of words you want to highlight in a different color, add a new ‘Highlighter Parameter’ element in your page and parametrize it.
Then, add an ‘Html Word MultiHighlighter’ element that has a ‘highlight_parameters’ parameter, which expects all of the ‘Highlighter Parameter’ configuration values as a text list (‘highlighter_parameter’ state of ‘Highlighter Parameter’ element).
Since it seems hard to create a text list from scratch in Bubble, there’s an ‘empty_text_list’ published state from ‘Highlighter Parameter’ element that is a ‘text list’ type, being an empty text list. You can use it as a starting point for adding the different highlighter parameters. See the ‘MutliHtmlWordHighlighter A’ element in the Editor for more details.
Finally, use an HTML element for displaying the ‘highlighted_text’ state of 'Html Word MultiHighlighter' element as a result. That’s all!
Types
This plugin can be found under the following types:
Built on Bubble
