Back to No-Code Website Builders

Integrate AI chatbots with STUDIO

The best website builder for designers

Overview

STUDIO is a no-code website builder that empowers users to create and publish websites with ease.

Unique Features:

  • Intuitive UI: Simplifies design layouts for users of all skill levels.
  • Real-time Collaboration: Allows multiple users to edit content simultaneously.
  • One-click Publishing: Instantly publish designs as live websites without coding.
  • SEO Controls: Tailor SEO settings for each piece of content.
  • Custom HTML Integration: Embed custom code blocks to enhance functionality.
  • Figma Import: Easily bring existing designs from Figma into the platform.

Add Custom HTML Documentation

Step-by-Step Guide to Integrate Custom HTML in Studio.Design

  1. Access the Design Editor: Open your project in the Studio.Design Design Editor.

  2. Adding Custom Code Globally:

    • Go to the Site tab for site-wide changes or the Page tab for page-specific changes.
    • Click on Custom Code in the settings panel.
    • Add your HTML code in the End of <head> tag or End of <body> tag section as needed.
    • Click Update to save your changes.

  3. Using an Embed Box:

    • From the Add panel on the left, drag an Embed Box onto your page.
    • Open the settings panel on the right and paste your custom HTML code into the Embed code field.
    • Click Update to apply the changes.

  4. Testing Your Code: After adding your code, check the published site to ensure it functions correctly. Note that the code will not work in the Design Editor or Live Preview.

  5. Editing or Deleting Code: To modify or remove any custom code, return to the settings panel where you added the code, and make your changes accordingly. You can also rearrange the order of code blocks if necessary.

Important Notes:

  • Studio cannot assist with issues related to custom code created independently or from external services.
  • Ensure to use appropriate target attributes for links within your embed code to control navigation behavior.

Integration Guide

For more information on how to add custom HTML to your STUDIO website, please refer to the Custom HTML Documentation.

How to integrate OpenAssistantGPT with STUDIO

  1. Create your OpenAssistantGPT chatbot

    Sign in to your OpenAssistantGPT dashboard and create a new chatbot or select an existing one.

  2. Configure your chatbot settings

    Customize your chatbot's appearance, behavior, and knowledge base to match your website's needs.

  3. Get your embed code

    In your OpenAssistantGPT dashboard, go to the "Deployment" section and copy your unique embed code.

  4. Add the embed code to your STUDIO website

    Log in to your STUDIO account, open your website editor, and add an HTML or Custom Code element to your site. Paste the OpenAssistantGPT embed code into this element.

  5. Publish your website

    Save your changes and publish your website to make the chatbot live.

Advanced Configuration

For more advanced integrations with STUDIO, you can customize the following:

  • Chatbot position and appearance on your website
  • Trigger conditions (e.g., time on page, scroll depth)
  • Custom welcome messages based on the page content
  • Integration with your existing forms and contact systems

Builder Details

No-code Solution

✅ No coding required

Custom HTML Support

✅ Supports custom HTML