Ah thats good to know, I’ll dive into it!
How about using assistant API and turning it into an iframe on your web page. Example code generated with GPT as reference for you. This is not using assistant API, but serves the iframe demo concept.
With this chat widget as part of your base.html and a bit more javascript, one could detect which page it is activated from and could navigate the conversation to that context.
Flask backend:
# backend.py
from flask import Flask, request, jsonify
from flask_cors import CORS
import openai
app = Flask(__name__)
CORS(app) # Enable CORS
openai.api_key = 'your-api-key' # Replace with your OpenAI API key
@app.route('/ask', methods=['POST'])
def ask():
data = request.json
response = openai.Completion.create(
engine="text-davinci-003",
prompt=data['prompt'],
max_tokens=150
)
return jsonify(response)
if __name__ == '__main__':
app.run(port=5000) # Run the Flask app on port 5000
html page:
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>AI Assistant</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<style>
iframe {
width: 100%;
height: 500px;
border: none;
}
</style>
</head>
<body>
<iframe id="ai_frame" sandbox="allow-scripts allow-same-origin"></iframe>
<form onsubmit="sendMessageToAI(); return false;">
<input type="text" id="prompt" name="prompt" required>
<input type="submit" value="Ask AI">
</form>
<script>
function sendMessageToAI() {
var prompt = document.getElementById('prompt').value;
$.ajax({
url: 'http://localhost:5000/ask', // Point to the backend endpoint
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({ prompt: prompt }),
success: function(response) {
// Write the AI's response to the iframe
var iframeDocument = document.getElementById('ai_frame').contentDocument;
iframeDocument.open();
iframeDocument.write('<p>' + response.choices[0].text + '</p>');
iframeDocument.close();
},
error: function(xhr, status, error) {
// Handle error
console.error("Error: " + status + " - " + error);
}
});
}
</script>
</body>
</html>
2 Likes
Hi, sorry if this questions is super rookie or unrelated but is it possible to embed the upload document features from Open AI into a website/web app? We are using an API but can this somehow also be embedded so that documents can be scanned as part of the program as they can so easily in Chat. For context, I am building in the education space and want students to be able to upload documents. Thanks.
1 Like
Thanks @engagepy ! I’ll look into this if my limited knowledge allows 
1 Like
@ben.michael.brown so you want to basically upload retreival docs through the API? I haven’t seen this in the documentation or on the forum, but not an expert by far…
1 Like
Thanks for the reply @sfvp . Yeah, just want to use the same system that open ai use in order to upload and read documents - wondering if this might be part of an API or something like that
why don’t you deploy with streamlit and then embed it in wordpress ?
2 Likes
Have one assistant that can call a function to list the assistant to use based on the user query, then pass the query to it using the same thread
This is exactly what I was theorizing about with the GPT’s, since they have API functionality and json output. I’ve been reading the OpenAI docs for API integration, and I really wanted to create an interactable GPT on my website, able to reference other GPT formats or other Docs hosted on the same website. But I do not know enough to set it up on my website, versus the chatgpt link
Plus 1, I’m also looking for the solution to embed a custom GPT into my website.
@sfvp Hey, Did you find a reliable solution for embedding a GPT in wordpress website.
Please share any approaches you used.
There is no “solution” for taking a GPT out of ChatGPT Plus.
Creating and using GPT shares is solely for subscribers of ChatGPT Plus within the ChatGPT web site.
When you share a GPT, you are sharing an ad.
Developers that wish to use OpenAI outside of ChatGPT must use API model products - and pay for the language data usage.
2 Likes
Hi @devbulchandani8 ! The conclusion so far is that you simply create an Assistant (assistant api) instead of a GPT. Then either have someone built the chatbox integration for you, or wait u till one of the plugin builders adds this to their plugin. I just saw this meow plugin commenting thats its on the to do list so that would be perfect: Assistents API | WordPress.org
The one thing open for debate is that the assistant api seems to “talk” a bit different than the GPTs from what im reading, probably needs more instructions and tweaking i guess…
1 Like
A GPT is mostly a context prompt with context data (=embeddings), Avatar image, and potential actions.
If you don’t badly need actions, i.e., external API calls such as weather data, and you run WordPress, I’d recommend the Meow Apps plugin (not affiliated).
In the ‘Chatbots’ section you can set the Context. Simply copy and paste the ‘Instructions’ prompt from the GPTs builder here.
In the ‘Chatbots > Visual Settings’ section, you can set the name and Avatar of your GPT so it feels the same.
In the ‘Chatbots > Embeddings’ section you can set the environment and add external data (e.g., using Pinecone).
Here’s a screenshot:
I’m super happy with the plugin and can generally recommend it. You can see it live on any of our blog posts (bottom right) with what you may call a ‘custom GPT’.
2 Likes
Thanks so much @chris42 !
I indeed ended up doing this exact thing, it works remarkably well and the plugin is super good quality.
I have a feeling the embeddings on native chatgpt assistants api might (or will in the future) blend the knowledge better but for now it’s fine. Meow was planning on adding the assistants API functionality to their plugin so im just waiting on that to happen and then I’ll switch…
1 Like
Great, thanks for letting us know @sfvp! Didn’t know they planned to add assistants API as well. I bet that OpenAI will eventually disrupt them with their own native way of adding a GPT to any website…
1 Like
@chris42 yeah i guess your right, they will swallow up a lot of third party products. Altough being able to add custom css and connect to other “competing” platforms like Bard might be still relevant…
1 Like
The method in this YouTube video (v=Uk5f3ajkfSs) has proven a good solution so far, very easy to setup and seems reliable.
3 Likes
@alden I signed up for your service last week.
I imported sitemap and loaded FAQ. The output looked great, but then I followed the instructions to load Live Chat on my site.
-
When I click on the avatar image in the bottom right corner of my site, it pops up a login instead of the chat. This isn’t helpful if users would have to log in to chat
-
I submitted a ticket in your system last week. The ticket is not even showing anymore.
-
I will try to submit another ticket, hopefully this one stays. Ticket number is #10177
-
There doesn’t seem to be any good way to capture leads within the chat, which would be super helpful for people talking to the chat (after I fix the login prompt issue)
You can embed your GPT into your website here with MOBJAI - Mission Objective
- Choose the assistant
- Copy the code generated into your index.html file.
That’ll be fab feature for sure. One saving many interim steps.