Documentation — Ask My Docs

Welcome to Ask My Docs!

Ask My Docs is an AI-powered documentation assistant that helps you provide instant answers to your users by allowing them to chat with your documentation.

What is Ask My Docs?

Ask My Docs transforms your static documentation into an interactive, AI-powered chat experience. Users can ask questions in natural language and get instant, accurate answers based on your uploaded documents.

Key Features

AI-Powered Chat: Natural language processing understands context and intent
Easy Integration: Simple script tag installation, no complex setup required
Customizable Widget: Match your brand with custom colors, logos, and themes
Document Management: Upload PDFs, Word docs, and text files with ease
Real-time Answers: Instant responses based on your uploaded documentation

Getting Started in 3 Steps

Create an Account: Sign up at app.askmydocs.co.uk to start your free 7-day trial
Upload Documents: Add your documentation files (PDF, DOCX, TXT) to your project
Install Widget: Add a simple script tag to your website to activate the chat widget

Free Trial

All new accounts start with a free 7-day trial that includes:

100 questions per month
100 MB document storage
Full access to all features
No charge until your 7-day trial ends — cancel anytime

After your trial, choose from our Starter, Pro, or Enterprise plans to continue using the service.

Widget Installation

Installing the Ask My Docs widget on your website is quick and straightforward. Follow these steps to get your chat widget up and running in minutes.

Step 1: Get Your Widget Key

After signing up, navigate to your project settings in the dashboard to find your unique widget key. This key identifies your project and ensures questions are answered using your documents.

Step 2: Add the Script Tag

Add the following script tag to your website, typically in the <head> section or just before the closing </body> tag:

<script 
    src="/widget.js" 
    data-widget-key="YOUR_WIDGET_KEY"
    data-api-url="https://app.askmydocs.co.uk">
</script>

Step 3: Replace Placeholder Values

YOUR_WIDGET_KEY: Replace with your actual widget key from the dashboard
data-api-url: The API URL (https://app.askmydocs.co.uk for production)

Example: Complete HTML Page

<!DOCTYPE html>
<html>
<head>
    <title>My Website</title>
</head>
<body>
    <h1>Welcome to My Site</h1>
    <p>Your content here...</p>
    
    <!-- Ask My Docs Widget -->
    <script 
        src="/widget.js" 
        data-widget-key="abc123xyz"
        data-api-url="https://app.askmydocs.co.uk">
    </script>
</body>
</html>

Alternative: Global Configuration

You can also set the API URL globally before loading the widget:

<script>
    window.ASK_MY_DOCS_API_URL = 'https://app.askmydocs.co.uk';
</script>
<script 
    src="/widget.js" 
    data-widget-key="YOUR_WIDGET_KEY">
</script>

Verification

After installation, the widget should appear in the bottom-right corner of your website. Click on it to test the chat functionality.

Platform-Specific Instructions

WordPress

For WordPress sites, you can add the script tag using:

Theme Editor: Add to your theme’s header.php or footer.php
Plugin: Use a plugin like “Insert Headers and Footers” to add custom scripts
WordPress Plugin: Install our official WordPress plugin for easier integration

Static HTML Sites

Simply add the script tag to your HTML files as shown in the examples above.

React/Next.js

Add the script tag in your _document.js or _app.js file, or use the next/script component:

import Script from 'next/script'

export default function Layout({ children }) {
  return (
    <>
      {children}
      <Script 
        src="/widget.js"
        data-widget-key="YOUR_WIDGET_KEY"
        data-api-url="https://app.askmydocs.co.uk"
      />
    </>
  )
}

Widget Integration

Learn how to integrate and customize the Ask My Docs widget to match your website’s design and requirements.

Widget Appearance

The widget appears as a floating chat button in the bottom-right corner of your website (by default). It’s designed to be non-intrusive and only loads when needed, ensuring it doesn’t impact your site’s performance.

Basic Configuration

The widget accepts several configuration options via data attributes:

data-widget-key: (Required) Your unique widget key
data-api-url: (Required) The API endpoint URL

Widget Behavior

Lazy Loading: The widget loads asynchronously and doesn’t block page rendering
Session Management: Conversations are maintained per session
Responsive Design: Automatically adapts to mobile and desktop screens
Theme Detection: Supports light and dark themes, with automatic detection

Programmatic Control

The widget exposes a global API for programmatic control:

// Open the widget
AskMyDocsWidget.open();

// Close the widget
AskMyDocsWidget.close();

// Send a message programmatically
AskMyDocsWidget.sendMessage("What is your return policy?");

Event Listeners

You can listen to widget events for custom integrations:

// Listen for widget open
window.addEventListener('askmydocs:open', function() {
  console.log('Widget opened');
});

// Listen for widget close
window.addEventListener('askmydocs:close', function() {
  console.log('Widget closed');
});

Performance Considerations

The widget script is lightweight and optimized for fast loading
Chat functionality is loaded on-demand when the widget is opened
No impact on Core Web Vitals or SEO
Works with content delivery networks (CDNs) for optimal performance

Widget Customization

Customize your widget’s appearance, behavior, and branding to match your website’s design. Available options depend on your subscription plan.

Available Customization Options

All plans include basic customization, while Pro and Enterprise plans unlock advanced branding options.

Color Customization (All Plans)

Customize the widget’s color scheme to match your brand:

Primary Color: The main accent color for buttons and highlights
Background Color: Chat window background color
Text Color: Text color within the chat interface

Position Customization (All Plans)

Choose where the widget appears on your website:

Bottom Right: Default position
Bottom Left: Alternative position

Theme Options (All Plans)

Light Theme: Bright color scheme
Dark Theme: Dark color scheme (default)
Auto: Automatically matches user’s system preference

Advanced Customization (Pro & Enterprise)

Custom Logo

Upload your own logo to replace the default Ask My Docs branding. This is available on Pro and Enterprise plans.

Welcome Message

Customize the initial message users see when they open the widget.

How to Customize

Log in to your Ask My Docs dashboard
Navigate to your project settings
Go to the “Styles” or “Customization” tab
Make your changes using the visual controls
Save your settings – changes apply immediately

Custom CSS (Enterprise)

Enterprise plan users can apply additional custom CSS for advanced styling needs. Contact support for more information about CSS customization options.

Best Practices

Ensure sufficient contrast between text and background colors for accessibility
Test your customizations on both light and dark backgrounds
Keep your logo file size small for optimal performance
Preview changes on mobile devices to ensure responsiveness

Preview Before Publishing

The dashboard includes a live preview of your widget, so you can see exactly how it will look on your website before making changes live.

Troubleshooting

Having issues with your widget? This guide covers common problems and their solutions.

Widget Not Appearing

If the widget doesn’t appear on your website, check the following:

1. Verify Widget Key

Ensure your widget key is correct (found in your project dashboard)
Check for typos or extra spaces in the data-widget-key attribute
Verify the widget key matches the active project

2. Check Domain Configuration

Verify your domain is added to the allowed domains list in your dashboard
For development, localhost domains are allowed by default
Ensure you’re using the exact domain (including www if applicable)

3. Browser Console Errors

Open your browser’s developer console (F12) and check for JavaScript errors. Common errors include:

Widget key not found: Verify the data-widget-key attribute is present
CORS errors: Check that your domain is allowed in the dashboard
Network errors: Verify the API URL is correct and accessible

Widget Not Responding

If the widget appears but doesn’t respond to clicks or messages:

Check Subscription Status: Ensure your subscription is active (free trial or paid plan)
Verify API URL: Confirm the data-api-url attribute is correct
Check Network Tab: Look for failed API requests in the browser’s Network tab
Test API Access: Ensure the API endpoint is accessible from your domain

No Answers or Incorrect Answers

If the widget isn’t providing helpful answers:

Check Document Uploads: Ensure you’ve uploaded relevant documents to your project
Verify Document Processing: Wait a few minutes after uploading for documents to be processed
Review Question Format: Try rephrasing questions in different ways
Check Document Content: Ensure your documents contain relevant information

Styling Issues

If the widget doesn’t match your customizations:

Clear Browser Cache: Hard refresh (Ctrl+F5 or Cmd+Shift+R) to load updated styles
Verify Settings: Check that your customization settings are saved in the dashboard
Check for CSS Conflicts: Your site’s CSS might be overriding widget styles

Performance Issues

If the widget is affecting your site’s performance:

Check Loading Time: The widget should load asynchronously and not block rendering
Review Network Requests: Ensure API calls are not causing delays
Verify Script Placement: Widget script should be in the footer, not the header

Mobile-Specific Issues

Test the widget on actual mobile devices, not just desktop browser responsive mode
Check touch interactions – ensure the widget button is large enough for mobile taps
Verify the chat interface displays correctly on small screens

Getting Additional Help

If you’ve tried the solutions above and are still experiencing issues:

Check Documentation: Review other documentation sections for detailed information
Contact Support: Reach out through our contact form with details about your issue
Include Details: When contacting support, include:
- Your widget key (first 8 characters)
- Your domain
- Browser and version
- Console error messages (if any)
- Steps to reproduce the issue

Common Error Messages

“Widget key is required”: Add the data-widget-key attribute to your script tag
“Invalid widget key”: Check that your widget key is correct
“Domain not allowed”: Add your domain to the allowed domains list in your dashboard
“Subscription expired”: Renew your subscription or start a free trial