docs.langflux.space
  • Welcome to LangFlux
  • Using LangFlux
    • API
    • Streaming
    • Embed
    • Variables
  • Configuration
    • Auth
      • Chatflow Level
    • Rate Limit
  • Integrations
    • Cache
      • InMemory Cache
    • Chains
      • Conversational Retrieval QA Chain
      • Vectara QA Chain
    • Document Loaders
      • S3 File Loader
      • PDF Files
    • Chat Models
      • Azure ChatOpenAI
      • ChatLocalAI
      • Google VertexAI
    • Embeddings
      • Azure OpenAI Embeddings
      • LocalAI Embeddings
    • Memory
      • Short Term Memory
      • Long Term Memory
        • Zep Memory
      • Threads
    • Text Splitters
      • Character Text Splitter
    • Tools
      • Custom Tool
    • Vector Stores
      • Chroma
      • Pinecone
      • Elastic
      • Qdrant
      • SingleStore
      • Supabase
      • Vectara
    • Utilities
      • Set/Get Variable
      • If Else
    • External Integrations
      • Zapier Zaps
  • Use Cases
    • Web Scrape QnA
    • Webhook Tool
Powered by GitBook
On this page

Was this helpful?

  1. Using LangFlux

Embed

PreviousStreamingNextVariables

Last updated 1 year ago

Was this helpful?

You can embed a chat widget to your website. Simply copy paste the embedded code provided to anywhere in the <body> tag of your html file.

Watch how to do that:

To modify the full source code of embedded chat widget, follow these steps:

  3. Run yarn build

  4. Push changes to the forked repo

  5. You can then use it as embedded chat like so:

Replace username to your Github username, and forked-repo to your forked repo.

<script type="module">
      import Chatbot from "https://cdn.jsdelivr.net/gh/username/forked-repo/dist/web.js"
      Chatbot.init({
          chatflowid: "chatflow-id",
          apiHost: "http://localhost:3000",
      })
</script>
<script type="module">
      import Chatbot from "https://cdn.jsdelivr.net/gh/HenryHengZJ/FlowiseChatEmbed-Test/dist/web.js"
      Chatbot.init({
          chatflowid: "chatflow-id",
          apiHost: "http://localhost:3000",
      })
</script>

Tutorials

  • Watch how to embed LangFlux in a Bootstrap 5 website

  • Watch how to add chatbot to website

You can also customize your own embedded chat widget UI and pass chatflowConfig JSON object to override existing config. See .

Fork the repository

Then you can make any code changes. One of the popular ask is to remove Flowise .

configuration list
Flowise Chat Embed
branding