Hi everyone! Doas someone know the following is possible;
My users can design their own chatbot, with their own color, and options, within my bubble app. And when they are done, they get a piece of code (like a snippet) wich they can install on their website?
Hi @jona , if I understand you well. You have a chatbot user interface which your users can configure things like color and other UI designs to suit their taste. After that you want them to be able to get the code snippet of the chatbot user interface according to their configurations so they can just paste it into their website, right?
They could use an iFrame to display a page from inside their own pages, but you wouldn’t be exporting code from Bubble (you need to allow iFrame from Settings–> General (that would only be available on a paid plan)
Your question leaves a few gaps that make it difficult to provide a definitive answer. However, let me address your query assuming you are hosting the chatbot on a Bubble application.
You can package the chatbot within an IFrame and utilize dynamic page values to populate the IFrame URL. To customize the chatbot’s appearance, such as colors, you may consider using a color picker. You can save the color picker’s value within the chatbot’s design settings, then pass that value to the dynamic webpage.
Yes exactly! And also with the stripe account connected to the particular chabtot
Can you explain this a bit more?
iFrame is an HTML element that allows you to load another web page into your page. For example if you have an HTML page and you want to embed a YouTube video, you would put in a code like this:
<iframe width="560" height="315" src="https://www.youtube.com/embed/n_O1B_2tAlk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
If you want your bubble page to be embedded in a customer webpage as a component, they can call your page with and iframe <iframe src="https://yourpage.com"></iframe>.
For that to work efficiently there are things you need to do. Firstly you must allow iFrame in the settings. More generally you need to design your page for iFrame this means thinking about the size of the page, thinking about URL parameters and slugs, thinking about how you are going to send and receive events from the parent page (if needed), etc…
