We've received this question multiple times since releasing our Bubble and ChatGPT videos. And that is on the topic of how can I insert an opening question or an opening statement into the chat conversation without that actually being part of what is sent to ChatGPT? For example, a welcome message from the AI bot that I'm creating asking the user to ask it a question. Now, we've received this question multiple times in the comments and via email, so please do leave a comment, like and subscribe. We read through every comment and we reply to them in as much detail as we can. But let's move on. How do we add in an opening message into our chat bot?
Recap of our OpenAI ChatGPT Chatbot in Bubble
So I'm going to go back and just examine what I did to create this chat bot, which is we have a Send button which creates a message. This is the message set, the user inputs. We create both a JSON version and a text human readable version. We reset our multiline input. We send all of our messages so that we have that historical conversational awareness, and then we create a new message. And this is the response that Open AI gives us.
I've also got a simple way of navigating through conversations that's done by clicking here and displaying my conversation data into a group. I also have a mechanism in place so that when the page loads, if the conversation count is zero, it creates a new conversation. And if the conversation count is not zero, then the conversation shown is the repeating group's first item. So the first conversation in the repeating group. So when the page loads, let's say I'm on this one here, when the page loads, we go back to what is the capital of France. And it's important to explain that because of what I'm going to demonstrate next, which is how we insert the opening message. So I'm going to create a custom event because I want this to happen on two occasions, both page loads and conversations empty and when a new conversation is created. So I'm going to say this is going to be I call it send first message from bot to user. And this is going to be create a new thing, create a message. I'm going to check in here how I'm... Okay, so my message has a field called conversation.
Creating a Custom Event
So I need to pass in conversation into my custom event here. Spell that correctly. So we create a new message. And we don't actually need to fill in the JSON because we're not going to send this open to OpenAI. This is purely a UI message for our users. It's not ever going to be sent to OpenAI. And so we can say that the conversation is the conversation we feed into the custom event. And then the text is going to be, Hello, my name is Frank. I'm a chatbot. I'm going to also add a field in here which is going to be... Now, do I do it in the negative or the positive? I'll do it in the positive just so it's clear. I'll say, send to Open AI. And this is going to be a yes no field. And I'm going to say no to this because I don't want this message to be sent to Open AI because I'm pretending that it is being sent by the chat bot. So yeah, that's good. I then need to update here where I send my messages to Open AI. Looks like I missed this off the original video.
I need to set the conversation to be parent groups conversation. Otherwise, it's sending all the messages. But I need to add another constraint here, which is to only send the messages where sends the Open AI equals yes. And then I need to add in that here, tend to open AI equals yes, because that's all the messages my user inputs. And then so that Open AI is aware of what it said, this also needs to be yes. Right, to demonstrate this, I'm going to clear out all of the conversations I've got and clear out all the messages. Okay, let's see how this goes. So I'll just refresh that again. On page load... I've not triggered the workflow. I've not triggered my custom event. So my custom event is triggered here. And the conversation is the result of step one. Remember, this is what happens if the page loads and I have no conversations accessible to this user. So it creates a new conversation, and then it's going to run the send first message from bot to user. I also need to add that into New Conversations clicked. Should go custom event. Again, results of step one.
Right, let's try that. Okay, I'm going to debug that. I do like making these videos nice and rough. So on page load, we find that conversations is zero and so we display conversation count is zero. Why is count not zero? Count is one. I think... Okay, delete that. Okay, I've got an issue here, which is that my conversation label is my messages first text. So I'm going to say here that when search for current messages, first item is empty, text is, I'll just call this conversation placeholder. I'm going to check that it's all empty. Yeah, right, let's load it again. Okay, there we go. So it has added in that, Hello, my name is Frank. I'm a chat bot. And now I'm going to reply back saying, What is the capital of the USA?
So what should be happening is from Open AI's perspective, our conversation is only this long. It's not including the Hello, my name is Frank, I'm a chat bot. So I'm going to start a new conversation. And there you go. We start off once more with Hello, my name is Frank, I'm a chat bot. Now, to correct what I've done down and then to the left hand side by way of prompting and guiding my users into what the chat was actually about, I'm going to change this to item two is empty, and I'm going to change this to item two's text.
Again, so there we go. We now have it showing the second message in the conversation from the Bubbles app perspective, which is here. But this is from OpenAI's perspective, the first message and the second message and so on. So I hope that goes to show some way of expanding upon the previous tutorial for a Bubble integration in with OpenAI's ChatGPT, GPT 3.5 turbo. And this is just one way of going about it.
I wanted to go for a way which had the opening message still actually becomes part of the repeating group that shows all the messages. So that's my reasoning behind it. If you're unsure of anything I covered here, do check the previous video where we go through basically building this whole app out in under 30 minutes.
Yeah, if you have any questions, leave them in the comments. If you need one to one help, you can put Bubble coaching through our website. If you like our videos, you can go to our website where we've got videos that are exclusive to members. You can't find them on YouTube, but they will teach you how to build a Bubble app and many things about Bubble.
