# How to add live chat to a Base44 app

Canonical: https://orka.chat/how-to-add-live-chat-to-a-base44-app
Updated: 2026-09-21

[← Installation guides](/installation) BASE44 · PRACTICAL INSTALLATION GUIDE 

# How to add live chat to a Base44 app. 

 Your Base44 app can have real customer support, with the same shared inbox as the rest of your portfolio.

[Install it step by step ↓](#install) Web apps · Updated September 2026 

 Base44 Your next product ● ● ● 

 A membership app built in Base44 

 How do I invite another member?

 Sent to your Orka inbox ✓ 

 Same inbox. One more product aboard.

 [The steps](#install)[Copy the prompt](#copy-prompt)[Test it](#test)[Fix a problem](#troubleshoot)[FAQ](#faq)

 YOU NEED An Orka project + permission to edit and publish your Base44 app 

 YOU WILL ADD One official widget script in the shared app layout 

 YOU WILL CHECK A real message, a real reply and navigation between pages 

 FROM FIRST PROMPT TO FIRST HELLO 

## Bring your Base44 app aboard.

 01 

### Copy your project’s snippet

 Open [Orka](http://dashboard.orka.chat/) → Settings → your project → Installation. Under How to embed, click Copy Code. For a new product, create its own project first. This keeps the welcome, knowledge and conversations tied to the right app.

 02 

### Ask Base44 to install it

 Open your Base44 app and use the AI chat to request the integration. Paste the prompt below and the complete Orka snippet. Ask the AI to mount a small browser-only integration in the shared app layout, rather than adding a separate chat page.

 03 

### Choose the right shared location

 Use the layout actually present in your app, not an assumed file name. Ask Base44 to append the external script once, after the browser document is ready, and guard against duplicate installation when the layout renders again. You do not need a Base44 backend function just to display the chat widget.

 04 

### Review the change

 Open the Code tab from your app dashboard to review the layout and any component added by the AI. Base44 also provides a Code changes view for AI edits. The widget should remain available as you move between the app’s pages.

 05 

### Publish the app

 Click Publish in the top bar to send the current changes to your live Base44 app. Open the published .base44.app address or your custom domain and complete a test conversation. Code changes in the editor still need to be published.

### Your project ID matters.

 The example below uses a placeholder. Copy the full snippet from your own Installation screen before asking Base44 to use it.

 ORKA WIDGET · EXAMPLE Copy example 

```html
<script type="text/javascript">window.ORKA_APP_ID="YOUR_PROJECT_ID";(function(){d=document;s=d.createElement("script");s.src="//widget.orka.chat/app.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();</script>
```

 The project ID identifies your widget. An OpenAI, Anthropic or other private API key does not belong in this code. Configure AI separately in Orka.

[Using client-side routes? Read the SPA guide ↗](/how-to-add-orka-to-single-page-application) 

 LESS GUESSWORK FOR YOUR ASSISTANT 

## Copy this prompt. Add your real snippet. 

 It tells Base44 what to install, what to preserve and how to avoid common mistakes. Replace the final placeholder before sending it.

 BASE44 INSTALLATION PROMPT Copy prompt 

```html
Install the real Orka live chat in this Base44 web app using the complete snippet I paste below.

1. Inspect the framework and shared layout first. Tell me where you will install it.
2. Preserve my ORKA_APP_ID and the official widget.orka.chat/app.js URL.
3. Load the widget once, asynchronously, in the browser after the document body exists. Keep it across client-side route changes. Prevent duplicate scripts or iframes.
4. If this is Next.js, use next/script with a stable ID and afterInteractive loading, or a browser-only client integration. Never access window during server rendering.
5. Keep the current design, authentication and backend. Do not create an imitation chat UI, install a second chat service or expose any private API key.
6. Check the build and explain how I can test a message and reply on the published app. Show the changed files. Do not publish until I have reviewed the change.

Here is the complete snippet copied from Orka → Settings → my project → Installation:
[PASTE YOUR COMPLETE ORKA SNIPPET HERE]
```

 DON’T STOP AT “DONE” 

## Make the first conversation yours.

 Use a test visitor on the published app. The assistant saying it has installed chat is only the beginning of verification.

 Open the public URL. Check desktop and mobile. If the app requires login, test the intended signed-in experience. Send “Base44 installation test”. Confirm it arrives in the correct Orka project, then reply and check the visitor receives it. Navigate without refreshing. Visit two inner pages, use Back, then reload an inner URL. Check for duplicate bubbles or a lost conversation. Check the rest of your app. The chat should not cover a save button, checkout action or mobile navigation. Correct the placement if it does. 

 IF SOMETHING FEELS OFF 

## Three checks before another prompt.

### The assistant created a visual imitation of a chat box instead of installing Orka.

 Ask it to remove the imitation and use the supplied external widget script. The success criterion is a message reaching your real Orka project and a reply returning to the visitor.

### The widget is missing everywhere.

 Confirm you used the complete snippet with the correct project ID. Check that the release includes the changed file. Review console errors, content security policy and consent settings; do not disable your site’s security rules to make the widget appear.

### The message arrives under the wrong product.

 Compare the installed ORKA_APP_ID with this product’s Installation screen. Replace the incorrect installation instead of adding another one. Then publish and send a new test message.

## The next step: useful customer context.

 Once chat works, your app can send membership level, organization and remaining credits through the Orka SDK. Choose fields that help support; the widget does not infer them for you.

[Explore the visitor-data SDK ↗](/sdk)

[Start free · No card required](http://dashboard.orka.chat/signup)

 YOUR BEARINGS, BEFORE YOU DIVE IN 

## Live chat in Base44: your questions.

 Still wondering about something? [Ask a human at Orka ↗](mailto:hello@orka.chat)

 Can I add live chat to a Base44 app without knowing how to code? + Yes, an AI-assisted installation is a reasonable starting point. Copy your real Orka snippet, give Base44 the prompt in this guide and review the result. You still need access to edit and publish the project, and you should test a complete conversation. Ask for help if the integration fails instead of repeatedly pasting the script.

 Where is the Orka installation code? + In your Orka dashboard, go to Settings, choose the project and open Installation. Click Copy Code under How to embed. Use a separate project for each product whose branding and support context you want to keep separate.

 Is this a native Base44 integration? + This guide installs the standard Orka JavaScript widget into your web app. It does not require a dedicated marketplace connector. Platform editing permissions, publishing limits and support for custom code still apply.

 Will the chat survive navigation in my app? + It should if the loader is installed once in a persistent shared layout. Test several client-side routes and a direct reload of an inner page. Use the SPA guide if you also need controlled loading and user-session data.

 Does this guide install live chat in a native mobile app? + No. These steps are for a browser-based web app. A native iOS or Android app needs an appropriate embedded web integration; do not paste a browser script into a native view and expect it to run. See our mobile-app guides.

 Can I manage several AI-built apps in one inbox? + Yes. All Orka plans include unlimited projects. Give each product its own project and snippet, then answer together in the shared inbox or filter by project. Solo is free for one person; AI usage is separate.

 Does adding the widget give Orky access to my entire app database? + No. The widget does not automatically turn your database into AI knowledge. Configure help articles and AI behavior separately. For support context such as a plan or onboarding stage, explicitly send the relevant fields through the Orka SDK.

 Your question for Orka ↗ 

 Ask Orky · AI answers from our website, with sources. Your question is sent to OpenAI; please leave out personal information. [Privacy](/privacy) 

 [Email your question ↗](mailto:hello@orka.chat) 

 OFFICIAL DOCUMENTATION 

## Check the details at the source.

 Updated 21 September 2026. This is Orka’s installation guidance using the platform’s documented editing and publishing workflow, not a claim of a native partnership. Menus and plan limits can change. Corrections: [hello@orka.chat](mailto:hello@orka.chat).

 [Base44: Code tab ↗](https://docs.base44.com/developers/app-code/editor/code-tab) [Base44: building and publishing a website ↗](https://docs.base44.com/Getting-Started/building-a-website) [Base44: layouts ↗](https://docs.base44.com/Building-your-app/Design-foundations-and-layout) 

 BUILT WITH AI. SUPPORTED BY YOU. 

## Pick the tool you build with.

 A practical installation guide for each builder, with a prompt you can copy.

 [ Lovable Add live chat ↗ ](/how-to-add-live-chat-to-a-lovable-app)[ Bolt Add live chat ↗ ](/how-to-add-live-chat-to-a-bolt-app)[ Replit Add live chat ↗ ](/how-to-add-live-chat-to-a-replit-app)[ Base44 Add live chat ↗ ](/how-to-add-live-chat-to-a-base44-app)[ v0 Add live chat ↗ ](/how-to-add-live-chat-to-a-v0-app)