Back to No-Code Website Builders

Integrate AI chatbots with Flatsome Theme

Flatsome theme features a no-code UX Builder with custom HTML integration capabilities.

Overview

Flatsome Theme: A powerful and versatile WordPress theme designed for WooCommerce.

It features a user-friendly UX Builder for drag-and-drop customization, responsive design, and extensive pre-built elements.

Key highlights include parallax effects, AJAX-driven navigation, and high performance, making it ideal for various online stores.

Add Custom HTML Documentation

Step-by-Step Guide to Integrate Custom HTML in Flatsome Theme

  1. Create an HTML Block:

    • Navigate to UX > Blocks > Add New in your WordPress dashboard.

  2. Add Content:

    • Enter a title for your block and insert your custom HTML content in the content area.

  3. Save the Block:

    • Click Save to store your new block.

  4. Insert the Block:

    • Copy the shortcode provided (e.g., [block id="your-block-id"]).
    • Paste this shortcode into the page or widget area where you want the HTML to appear.

  5. Using Custom CSS:

    • To style your HTML, go to Advanced > Custom CSS in the theme options and add your CSS rules as needed.

Integration Guide

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

How to integrate OpenAssistantGPT with Flatsome Theme

  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 Flatsome Theme website

    Log in to your Flatsome Theme 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 Flatsome Theme, 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