DEV Community

Marc-Olivier Bouchard
Marc-Olivier Bouchard

Posted on

Build smart AI chatbot with Open AI assistant in few minutes!

Hello dev! In this tutorial we will present how to use OpenAssistantGPT to build smart chatbot for your website. In this developer-friendly guide, we'll walk you through the seamless process of crafting your own chatbot using the OpenAI platform. Whether you're a seasoned coder or just diving into the world of development, our open-source platform provides an accessible and user-friendly approach to integrating chatbots with Open AI Sssistants into your projects.

OpenAssistantGPT goes beyond the ordinary – it learns from custom content, gaining a comprehensive understanding of your business when armed with the right information. Thanks to our website integration, your customers can now pose any question and receive intelligent responses.

If you want to skip the boring stuff you can go directly to our website and start the Onboarding.

OpenAssistantGPT Dashbaord

Getting Started:

Step 1 — Configure your OpenAssistantGPT Account:
Get ready to embark on your chatbot creation journey by setting up two essential accounts:

A Google account or Github account for connecting to OpenAssistantGPT.
An OpenAI account.

  1. Open https://www.openassistantgpt.io/dashboard/settings.
  2. In a new window open https://platform.openai.com/api-keys and create a new secret key.
  3. Set this new secret key in your OpenAssistantGPT settings.

With your account now configured, let’s move on to Step 2.

Step 2 — Upload Your First File:
The magic begins with a file containing the content your chatbot will pull information from. Supported file types include .docx, .txt, .slx, .csv, and more. Create your own file by copying website content or extracting information from a custom source. Remember to use publicly available information for security reasons, as your chatbot will be accessible once added to your website.

Follow these steps:

  1. Open https://www.openassistantgpt.io/dashboard/files.
  2. Upload your file with custom content.

Files Dashbaord

Step 3 — Create Your Chatbot:
Now, let's dive into creating your first chatbot.

  1. Open https://www.openassistantgpt.io/dashboard/new/chatbot.
  2. Fill in the necessary details, including the name, welcome message, OpenAI model, etc.
  3. Press 'Create.'
  4. Visit your chatbot list at https://www.openassistantgpt.io/dashboard/chatbots. Use the triple dots on the right of your new chatbot to choose the 'Chat' option.

Create chatbot form

Engage in Conversation:
After 10–15 minutes, you'll have your very own smart chatbot armed with custom content. To make it public to your customers, embed the chatbot on your website, just like we've done on our homepage. Soon, customers will be interacting, asking questions about your business, and receiving smart answers.

Chat Box

Embed the chatbot in your website
Finally, you can embed the chatbot with few lines of code in your website.

<script>
  window.chatbotConfig = {
    chatbotId: 'clq6m06gc78970114hm42s838g2',
  }
</script>

<body>
  <script src="https://www.openassistantgpt.io/chatbot.js"></script>
</body>
Enter fullscreen mode Exit fullscreen mode

With this code you will get a result like this one on our main page:

Embed chatbox

Stay updated by following OpenAssistantGPT on Twitter! Start your chatbot journey today and make conversations smarter and more engaging. 🚀

Top comments (0)