To wrap up the day, I quickly created a custom component. For this one, I experimented with adjusting the number of elements using a slider. You can set the number of left and right text bubbles, and they automatically appear alternately in a stacked format. Everything else is customizable (color, radius of the text bubbles, margins, etc.).
Haha, wow, that is pretty cool… nice work!
every time I try to erase a letter in the text it just deletes the component? what am I doing wrong
I just had a quick check and the component is using the standard html tag contenteditable="true" — This won’t work in Elements, and the content won’t be saved.
Bart would need to switch to using the Elements API, @text("greenBubbleText", default: "Hello!") to get this working correctly.
@Bartje if you do update the component, you will probably need to generate a unique ID for each bubble to get them to save/load correctly.
That seems a problem. Maybe someone from RM can have a look at this?
At this moment you can select the text by double clicking the text and than type your own text.
I have a new version with the extra options to display an image and a text under the bubbles. You can hide the image and text if you want.
1 Like
I’ll have a look.
1 Like
The text saves now but when reopening the file, the text in each bubble is the same and you can only type 1 character. What can be wrong?
Chat Bubble CC 1.4
You have it set up correctly now, and each bundle is using a unique ID for the @text attributes you’re creating. Nice work!
However… due to the way Elements processes the hooks file, it doesn’t quite work like you’d/we’d expect — I’m discussing this with @tpbradley to see how we can support this. Stay tuned!
3 Likes
Hey @Bartje,
So… I had a looong chat about this with @tpbradley, and it turns out using the unique ID on the text fields is not going to work and is not a good idea (for many reasons). Anyway, what you really want to do here is use Collections - it’s a feature we’ve not talked about much recently and has taken a backseat while w3 tidy up other more important features in Elements.
We need to give Collections another pass to flesh it out a little more and tidy up the bugs, but the basics are usable. I have recorded a video for you going into a little more detail on the project changes we made.
Watch the video and have a poke around in the Text Bubbles V2.0 project and let us know if you have any questions - we’re here to help 
Keep up the good work on the components, it’s exciting seeing this stuff come to life!
1 Like
Thank you for the quick response and excellent support. The solution in your video is indeed much more robust than the original approach. The only downside is that, from a user’s perspective, it’s not the most user-friendly method. For me personally, it’s a great solution, but if someone wanted to offer such a component commercially, I think it could pose a problem.
In that sense, the original setup (setting the number of bubbles via the slider and entering the text for each bubble through an editable text element) might better suit the needs of a non-technical user. But perhaps that’s exactly what a beta program is for — to evaluate these kinds of aspects.
What’s clear, though, is that Elements is truly shaping up to be a modern environment with endless possibilities, both for users who want to keep things simple and for those who prefer something more complex.
Another solution to keep things a little simpler would be to simplify the Bubble component so it renders just one text message and has an option to choose which side it should be on.
Then you could turn it into a global and place a bunch of them in a flex so they stack up, overriding the text on each one.
The benefit of using a global is that if you change the background color, they’d all change and stay in sync.
1 Like
That is a good idea. I can make a basic version and a pro version 
3 Likes