๐Ÿ“š Complete Tutorial: Medical Chatbot Configuration with AI Engine

*This is the second part of the complete medical chatbot configuration guide. If you missed the first part where we covered the basic system structure, [you can find it here]**

In the first part, we configured:
โœ… **Token System and Cost Optimization**
โœ… **Medicine Database (JSON)**
โœ… **Dashboard Modules (Client, Server, Admin)**
โœ… **Chatbot Configuration (AI Model, Embeddings, Thresholds)**

## ๐ŸŽจ NOW WE WILL FINALIZE THE INTERFACE:

In this part, we will transform the chatbot from a technical engine into a friendly medical experience by covering:

๐Ÿ”น **”Appearance” Tab** – The visual design of the medical assistant
๐Ÿ”น **”Popup” Tab** – Display methods in the digital clinic
๐Ÿ”น **UI Builder** – Advanced interface customization
๐Ÿ”น **Advanced** – Settings for professional use
๐Ÿ”น **Cross-Site** – Multiple implementation
๐Ÿ”น **Shortcodes** – Quick integration into medical pages
๐Ÿ”น **Actions** – Intelligent automations


5. “APPEARANCE” TAB – MEDICAL INTERFACE DESIGN

๐Ÿ“AI Engine โ†’ Chatbots โ†’ [Chatbot Name] โ†’ “Appearance” Tab


๐ŸŽจ THEME AND DISPLAY CONFIGURATION:

Theme: ChatGPT (โœ… Selected)
Popup: Yes (โœ… Checked)
Full Screen: โŒ Not Checked
Copy Button: Yes (โœ… Checked)

๐Ÿ” INTERFACE SETTINGS ANALYSIS:

๐Ÿค– MEDICAL ASSISTANT CONFIGURATION:

Header Subtitle: "Medical Assistant" (โœ… Text entered)
AI Name: "Medical Assistant" (โœ… Text entered)ย 
Start Sentence: "Hello! How can I help you today?" (โœ… Text entered)
AI Avatar: โœ… Avatar selected (specific letter)

๐Ÿ‘ค AUTHENTICATED USER CONFIGURATION:

User Avatar: โœ… Yes (Checked)
User Name: "User" (โœ… Text entered)
Placeholder: "Write symptoms or n" (โœ… Text entered)
Send: "Send" (โœ… Text entered)ย 
Clear: "Clear" (โœ… Text entered)

๐Ÿšจ GUEST CONFIGURATION:

Guest Name: โœ… Yes (Checked) + "Guest" (text)
Compliance Text: "Always consult a doctor !" (โœ… Text entered)
Guest Avatar: โœ… Avatar selected

๐ŸŽฏ DISPLAY STRATEGY:

๐Ÿ“ฑ FULL SCREEN DISABLED – BENEFITS:

Normal Popup:
ย  - Conversation in a compact window
ย  - User continues to see the site content
ย  - Less intrusive experience
ย  - Ideal for quick medical consultations

๐Ÿ’Š CUSTOM AVATARS:

AI Avatar: โœ… Specific avatar selected
User Avatar: โœ… User Gravatar
Guest Avatar: โœ… Generic avatar selected

Purpose:
ย  - Clear differentiation between participants
ย  - Consistent visual identity

โœ… CONFIGURATION CHECKED CORRECTLY:

 Checked: Popup, Copy Button, User Avatar, Guest Name
โŒ Unchecked: Full Screen
โœ… Avatar: AI Avatar selected, Guest Avatar selected
โœ… Texts: All medical texts completed

The configuration creates a professional, non-intrusive medical chat experience, with clear distinction between authenticated users and visitors.


6. “POPUP” TAB – MEDICAL DISPLAY STRATEGY

๐Ÿ“ AI Engine โ†’ Chatbots โ†’ [Chatbot Name] โ†’ “Popup” Tab


๐ŸŽฏ MEDICAL POPUP CONFIGURATION:

Popup Title: "Medical Assistant" (โœ… Set)
Position: "Bottom Right" (โœ… Selected)
Bubble: "Yes" (โœ… Enabled)
Icon: โœ… Selected (specific image)

๐Ÿ” DISPLAY SETTINGS ANALYSIS:

๐Ÿ“ STRATEGIC POSITIONING:

Position: Bottom Right
Medical Benefits:
ย  - Quick access from any page
ย  - Minimal interference with medical content
ย  - Visible but discreet for patients
ย  - Mobile device compatible

๐Ÿ’ฌ MEDICAL BUBBLE CONFIGURATION:

Bubble: Yes (โœ… Enabled)
Icon Text: "Medical Help" (โœ… Set)
Icon Text Delay: "1" second (โœ… Set)

Functionality:
ย  - Bubble with icon always visible
ย  - Text "Medical Help" appears after 1 second
ย  - Clearly invites medical interaction
ย  - Instant identification of the assistant

๐ŸŽฌ ANIMATION AND DELAY:

Window Animation: "Zoom" (โœ… Selected)
Center: "Yes" (โœ… Enabled)
Open Delay: "0" seconds (โœ… Set)

User Impact:
ย  - Instant opening on click
ย  - Professional zoom animation
ย  - Window centered on the screen
ย  - Modern and fast experience

๐Ÿฅ MEDICAL ACCESSIBILITY STRATEGY:

โšก INSTANT ACCESS FOR EMERGENCIES:

Open Delay: 0 seconds
Medical Purpose:
ย  - Immediate access to the medical assistant
ย  - Important for quick symptom description
ย  - No delays in critical situations
ย  - Prompt response to patient needs

๐Ÿ” EASY RECOGNITION:

Icon Text: "Medical Help"
1-second Delay:
ย  - Avoids initial visual clutter
ย  - Allows the user to orient themselves
ย  - Appears fast enough for guidance
ย  - Clear and concise message

โœ… FINAL CONFIGURATION:

โœ… Popup Title: "Medical Assistant"
โœ… Position: Bottom Right
โœ… Bubble: Yes + Icon selected
โœ… Icon Text: "Medical Help" + Delay 1s
โœ… Animation: Zoom + Center Yes
โœ… Open Delay: 0 seconds

The configuration creates a clear and quick visual access point to the medical assistant, optimized for an efficient user experience in a medical context.


7. “UI BUILDER” TAB – MEDICAL INTERFACE CONSTRUCTOR

๐Ÿ“ AI Engine โ†’ Chatbots โ†’ [Chatbot Name] โ†’ “UI Builder” Tab


๐ŸŽจ INTERFACE COMPONENTS CONFIGURATION:

Container: Standard (โœ… Selected)
Messages: Standard (โœ… Selected)ย 
Footer: Standard (โœ… Selected)
Header: Standard (โœ… Selected)
Input: Standard (โœ… Selected)

๐Ÿ” INTERFACE STRUCTURE ANALYSIS:

๐Ÿ—๏ธ COMPONENT ARCHITECTURE:

Container: Standard
Function: The main frame of the chat window
Characteristics:
ย  - Standard window style
ย  - Container for all other components
ย  - Consistent and professional design

๐Ÿ’ฌ MEDICAL MESSAGES AREA:

Messages: Standard
Function: Displaying the medical conversation
Characteristics:
ย  - Dedicated area for message exchange
ย  - Clear structure between assistant and user
ย  - Optimized format for medical information

๐Ÿฅ INFORMATIVE FOOTER:

Footer: Standard
Function: Displaying compliance text and tools
Content:
ย  - Message "Always consult a doctor !"
ย  - Auxiliary buttons and tools
ย  - Legal and security information

๐Ÿ“‹ PROFESSIONAL HEADER:

Header: Standard
Function: Title bar with controls
Elements:
ย  - Title "Medical Assistant"
ย  - Control buttons (minimize, close)
ย  - Assistant avatar and identifier

โŒจ๏ธ SYMPTOM INPUT FIELD:

Input: Standard
Function: Field for entering symptoms
Characteristics:
ย  - Placeholder "Write symptoms or n"
ย  - "Send" and "Clear" buttons
ย  - Optimized for medical descriptions

๐ŸŽฏ MEDICAL INTERFACE STRATEGY:

๐Ÿ’Š OPTIMIZED USER FLOW:

Header โ†’ Messages โ†’ Input โ†’ Footer
ย  ย  โ†“ย  ย  ย  ย  ย โ†“ย  ย  ย  ย  ย โ†“ย  ย  ย  ย โ†“
Assistant Conversation Symptom Medical
Identification Medical Input Warning

โšก BENEFITS OF STANDARD SETTINGS:

Consistency: Uniform interface across all devices
Accessibility: Clear and easy-to-use elements
Professionalism: Serious and credible medical appearance
Compatibility: Works perfectly with the ChatGPT theme

โœ… CONFIGURATION FINALIZED:

โœ… Container: Standard
โœ… Messages: Standardย ย 
โœ… Footer: Standard
โœ… Header: Standard
โœ… Input: Standard

Image of AI Engine UI Builder Tab Configuration Summary


8. “CROSS-SITE” TAB – PRACTICAL UTILITY

๐ŸŽฏ WHAT THIS TAB DOES:

Main Function: Allows displaying the same chatbot on MULTIPLE sites
Analogy: Like an embedded YouTube video - same content, multiple locations

๐Ÿฅ PRACTICAL MEDICAL SCENARIOS:

๐Ÿข CLINIC WITH MULTIPLE SITES:

Situation: A clinic has:
ย  - Main site: clinicamedicala.ro
ย  - Educational blog: blog.clinicamedicala.roย ย 
ย  Platformฤƒ pacienศ›i: app.clinicamedicala.ro
ย  Branch site: filiala.clinicamedicala.ro

Cross-Site Solution:
ย  - A single configured chatbot
ย  - The same medical assistant on ALL sites
ย  - Centralized conversation history

๐Ÿค MEDICAL NETWORK:

Situation: Medical association with:
ย  - Association site: asociatiamedicala.ro
ย  Conference site: conferinta.asociatiamedicala.ro
ย  Member portal: membri.asociatiamedicala.ro

Benefit: The same medical expert for all members

๐Ÿ’ฐ ECONOMIC BENEFITS:

โœ… A single AI Engine subscription
โœ… A single medical configuration
โœ… Centralized maintenance
โœ… Simultaneous updates on all sites

๐Ÿšซ WHY IT IS NOT USED:

The Reason : ONE single medical site
Simplification:ย 
ย  - Single site = Cross-Site unnecessary
ย  - Better to disable for security
ย  - Avoids unnecessary complexity

๐ŸŽช EASY-TO-UNDERSTAND ANALOGY:

โŒ WITHOUT Cross-Site:ย 
ย  - Each site has a SEPARATE chatbot
ย  - Like having different assistants in each room

โœ… WITH Cross-Site:
ย  - The same assistant in all rooms
ย  - He knows all your medical history
ย  - Consistent and efficient


9. “SHORTCODES” TAB – FLEXIBLE IMPLEMENTATION

๐Ÿ“ AI Engine โ†’ Chatbots โ†’ [Chatbot Name] โ†’ “Shortcodes” Tab


๐Ÿ“‹ AVAILABLE SHORTCODES:

๐ŸŽฏ SIMPLE SHORTCODE (RECOMMENDED):

[mwai_chatbot id="chatbot-n368a7"]

Benefits:

  • Uses all settings from the graphical interface

  • Automatic updates upon modifications

  • Minimal and easy to use

โš™๏ธ ADVANCED SHORTCODE (CUSTOM):

[mwai_chatbot ai_name="Medical Assistant"ย 
ย text_input_placeholder="Write symptoms or medicine..."
ย text_compliance="Always consult a doctor!"
ย start_sentence="Hello! How can I help you today?"
ย window="true"
ย # ... + all other settings]

Usage:

  • Override default settings

  • Customization for specific pages

  • Maximum flexibility


๐ŸŽฏ IMPLEMENTATION STRATEGY:

๐Ÿฅ FOR SPECIFIC PAGES:

"Medical Emergencies" Page:
ย  - More urgent start sentence: "Hello! What symptoms do you have?"
ย  - More visible compliance text

"General Consultations" Page:
ย  - Standard start sentence: "Hello! How can I help you today?"

๐Ÿ’Š SHORTCODE BENEFITS:

โœ… Flexibility: Different settings on different pages
โœ… Portability: You can easily move the chatbot
โœ… Testing: You can test different variations
โœ… Backup: If the graphical interface gives an error, the shortcode works

๐Ÿ”ง PRACTICAL UTILITY:

๐Ÿ“ WHERE TO USE:

In the WordPress Editor:
ย  - "Shortcode" Block
ย  - Paste [mwai_chatbot id="chatbot-n368a7"]
ย  - Save and the chatbot displays

In PHP Templates:
ย  - <?php echo do_shortcode('[mwai_chatbot id="chatbot-n368a7"]'); ?>


10. “ACTIONS” TAB – ADMINISTRATIVE OPERATIONS

๐Ÿ“ AI Engine โ†’ Chatbots โ†’ [Chatbot Name] โ†’ “Actions” Tab


๐Ÿ› ๏ธ AVAILABLE ACTIONS

Duplicate: โœ… Creates an identical copy of the chatbot
Reset: โœ… Restores default settings (DANGEROUS)
Delete: ๐Ÿ—‘๏ธ Permanently deletes the chatbot (IRREVERSIBLE)

๐Ÿ” ACTIONS ANALYSIS:

๐Ÿ“‹ DUPLICATE – SMART CLONING:

Utility:ย 
ย  - Testing new settings without risk
ย  - Variants for different specializations
ย  - Backup before major modifications

Medical Scenarios:
ย  - Duplicate for "Pediatric Assistant"
ย  - Duplicate for "Chronic Disease Consultant"
ย  - Test new prompts on the copy

โš ๏ธ RESET – RESTORING SETTINGS:

Attention: THIS IS A DANGEROUS BUTTON
What it does:
ย  - Deletes ALL custom settings
ย  - Reverts to default configurations
ย  - You lose the custom medical prompt
ย  - You lose database connections

When to use:
ย  - Only if you have corrupted the configuration
ย  - Never after you have configured everything

๐Ÿ—‘๏ธ DELETE – PERMANENT ELIMINATION:

Attention: IRREVERSIBLE ACTION
What happens:
ย  - The chatbot is permanently deleted
ย  - All settings are lost
ย  - Conversation history is kept (if enabled)

When to use:
ย  - Abandoned projects
ย  - Obsolete tests
ย  - Administrative cleanup

Image of AI Engine Actions Tab with Duplicate, Reset, and Delete buttons

 

๐Ÿ“š CONTINUATION IN PART 3

We have successfully finalized the interface and integration system configuration. In the next article, we will move on to advanced monitoring and optimization:

๐Ÿ”น “Discussions” Tab – Viewing and analyzing all conversations
๐Ÿ”น “Knowledge” Tab – Managing knowledge bases and PDF uploads
๐Ÿ”น “Insights” Tab – Real-time cost monitoring and query logs
๐Ÿ”น “Settings” Tab – Global API configurations and environment management

[๐Ÿ‘‰ Read Part 3: Advanced Monitoring and Optimization here]