HELPZ.ai Complete User Guide

🚀Getting Started with HELPZ.ai

HELPZ.ai is an AI-powered platform that allows you to create intelligent customer support agents trained on your specific business knowledge. These agents can be deployed as chat widgets on your website to provide instant, 24/7 customer support.

What You Can Do with HELPZ.ai:

🤖 Create AI Agents

Build custom AI assistants tailored to your business needs with specific instructions and behaviors.

📚 Train with Your Data

Upload documents, PDFs, web content, and other materials to create a comprehensive knowledge base.

🎨 Customize Appearance

Match your brand with custom themes, colors, and styling options.

🚀 Deploy Instantly

Embed your AI agent on any website with just one line of code.

💰Pricing Plans

Choose the plan that best fits your business needs. All plans include a 30-day free trial for new users.

Starter

$19/month

1,000 tokens per month
1 AI agent
Basic analytics
Email support
GPT-4o Mini model

Professional

$48/month

Enterprise

$98/month

12,000 tokens per month
Unlimited agents
Full analytics suite
Premium support
API access
Custom integrations

Token Usage: 1 token = 1 text query on GPT-4o Mini. GPT-4o uses 5x tokens but provides more advanced capabilities.

⭐Features Overview

🧠 Multiple AI Models

GPT-4o Mini: Fast, efficient, cost-effective for most use cases

GPT-4o: Most capable model for complex queries and advanced reasoning

📄 File Upload Support

Upload and process multiple file formats:

PDF documents
Text files (.txt, .md)
HTML files
Word documents (.docx)
CSV data files
JSON, XML, YAML

🌐 Web Crawling

Crawl and index content from web pages with JavaScript rendering support for dynamic content.

🎨 Theme Customization

Choose between Day/Night modes or create custom CSS styling to match your brand.

💬 Thread Persistence

Conversations are maintained across page reloads for a seamless user experience.

🔒 Domain Security

Configure allowed domains to prevent unauthorized use of your AI agents.

✍️Step-by-Step Signup Process

1

Visit HELPZ.ai and Choose Your Plan

Go to the HELPZ.ai website and select the pricing plan that best fits your needs. You can start with any plan and upgrade later.

2

Create Your Account

Fill out the registration form with:

Your email address
Company name
Password

3

Start Your Free Trial

New users get a 30-day free trial with tokens included:

Starter: 1,000 trial tokens
Professional: 5,000 trial tokens
Enterprise: 12,000 trial tokens

No Credit Card Required: Start your free trial immediately without entering payment information.

4

Access Your Dashboard

Once registered, you'll be redirected to your dashboard where you can start creating your first AI agent.

🤖Creating Your First Agent

1

Navigate to Agent Creation

From your dashboard, click the "Create New Agent" button. This will open the agent creation form.

2

Configure Basic Settings

Agent Name: Choose a descriptive name like "Customer Support Bot" or "Sales Assistant"

AI Model: Select the appropriate model:

GPT-4o Mini: Recommended for most use cases - fast and cost-effective
GPT-4o: Use for complex reasoning, advanced analysis, or specialized tasks

3

Write Initial Instructions

Define how your agent should behave. If left empty, default instructions will be applied. You can always modify these later.

Example: "You are a helpful customer support assistant for ABC Company. Use the knowledge base to answer questions accurately and helpfully. Always be polite and professional."

4

Create the Agent

Click "Create Agent" and the system will:

Set up the AI assistant on OpenAI's platform
Create a vector store for your knowledge base
Generate unique embed codes for deployment

📚Training Your Agent

Upload Training Documents

1

Access the Agent Management Page

Click on your agent from the dashboard to access its individual management page.

2

Upload Your Files

Use the drag-and-drop upload area or click to browse files. Supported formats:

PDF: Manuals, guides, documentation
TXT/MD: Text files and Markdown documents
HTML: Web pages and documentation
DOCX: Microsoft Word documents
CSV: Data files and spreadsheets
JSON/XML/YAML: Structured data files

File Size Limit: Maximum 10MB per file. For larger files, consider splitting them into smaller sections.

3

Add File Descriptions (Optional)

Add short descriptions to help the AI understand the context and purpose of each file upload.

Example: "Product documentation for XYZ software version 2.1" or "Customer service policies and procedures"

Web Crawling

4

Crawl Web Content

Use the web crawling feature to automatically extract content from web pages:

Enter the URL of the page you want to crawl
Enable "Use prerender" for JavaScript-heavy sites
The system will extract text content and add it to your knowledge base

Tip: Crawl your company's FAQ, product pages, and support documentation for comprehensive coverage.

💡Effective Prompting & Training Guide

Writing Effective Agent Instructions

Your agent's instructions are crucial for defining its personality, behavior, and expertise. Here's how to create instructions that make your agent sound like a real employee:

1. Define the Role and Identity

Start by clearly defining who your agent is and what role they play in your organization.

Good Examples:
• "You are Sarah, a senior customer support specialist at TechFlow Solutions with 5 years of experience helping customers with our project management software."
• "You are Mike, a knowledgeable sales representative at GreenEnergy Co. You're passionate about renewable energy and helping customers find the right solar solutions."
• "You are Dr. Lisa Chen, a certified nutritionist and wellness coach at HealthFirst Clinic. You provide evidence-based advice on nutrition and healthy lifestyle choices."

2. Set the Tone and Personality

Define how your agent should communicate to match your brand voice.

Tone Examples:
• Professional: "Maintain a professional, helpful tone. Use clear, concise language and always address customers respectfully."
• Friendly: "Be warm, approachable, and conversational. Use a friendly tone like you're talking to a friend, but remain professional."
• Expert: "Communicate as a trusted expert. Provide detailed, technical information when appropriate, but explain complex concepts in understandable terms."
• Casual: "Keep it relaxed and conversational. Use everyday language and don't be afraid to show some personality."

3. Define Expertise and Boundaries

Clearly specify what your agent knows about and how to handle topics outside their expertise.

Examples:
• "You specialize in our SaaS platform's features, pricing, integrations, and troubleshooting. For billing issues, direct customers to our billing department."
• "You're an expert in organic gardening, plant care, and sustainable farming practices. For pest control involving chemicals, recommend consulting with a licensed professional."
• "You help customers with product selection, sizing, and care instructions. For returns or exchanges, direct them to our customer service team."

4. Provide Company-Specific Context

Include important information about your company, values, and policies.

Examples:
• "TechFlow Solutions has been serving small businesses since 2018. We pride ourselves on exceptional customer service and user-friendly software."
• "Our company values sustainability and environmental responsibility. Always highlight eco-friendly options when relevant."
• "We offer a 30-day money-back guarantee and free setup assistance for all new customers."

5. Include Behavioral Guidelines

Specify how the agent should handle different situations.

Guidelines Examples:
• "Always ask follow-up questions to better understand the customer's needs."
• "If a customer seems frustrated, acknowledge their concern and focus on finding a solution."
• "When you don't know something, say 'Let me find that information for you' rather than guessing."
• "End conversations by asking if there's anything else you can help with."
• "Use the customer's name when they provide it to personalize the experience."

Complete Example Instructions

You are Jennifer, a senior customer success manager at CloudSpace Solutions, a cloud storage and collaboration platform for small to medium businesses. You've been with the company for 4 years and have extensive knowledge of our products, features, and best practices.

**Your Role:**
- Help customers maximize their use of CloudSpace Solutions
- Provide technical support and troubleshooting assistance  
- Guide users through features and functionality
- Offer tips and best practices for team collaboration

**Your Personality:**
- Professional but warm and approachable
- Patient and thorough in explanations
- Proactive in offering helpful suggestions
- Enthusiastic about helping customers succeed

**Your Expertise:**
- All CloudSpace features (file sharing, collaboration tools, security settings)
- Integration with popular business tools (Slack, Microsoft Office, Google Workspace)
- Team management and permission settings
- Security and compliance best practices
- Pricing and plan recommendations

**Communication Style:**
- Use clear, jargon-free explanations
- Provide step-by-step instructions when needed
- Ask clarifying questions to better understand needs
- Offer multiple solutions when possible
- Always end with asking if there's anything else you can help with

**Company Values:**
CloudSpace Solutions is committed to making collaboration simple and secure for growing businesses. We offer 24/7 support, 99.9% uptime guarantee, and enterprise-grade security for companies of all sizes.

**When you don't know something:**
If you can't find the answer in the knowledge base, say: "I want to make sure I give you accurate information. Let me connect you with a specialist who can help with that specific question. You can reach our support team at support@cloudspace.com or through the live chat on our website."
                

Tips for Industry-Specific Agents

🏥 Healthcare/Medical

Include disclaimers about medical advice
Emphasize the importance of consulting professionals
Use empathetic, caring language
Be precise with medical terminology

🏦 Financial Services

Emphasize security and privacy
Include appropriate disclaimers
Use professional, trustworthy tone
Be clear about what you can/cannot advise on

🛒 E-commerce

Focus on product benefits and features
Include shipping and return information
Use persuasive but helpful language
Offer alternatives and upsells naturally

💻 SaaS/Technology

Balance technical accuracy with accessibility
Provide step-by-step instructions
Include troubleshooting approaches
Offer multiple ways to accomplish tasks

🎨Customizing Your Agent

Theme Customization

1

Choose Theme Mode

Select between Day (light) and Night (dark) theme modes:

Day Mode: Light background with dark text - professional and clean
Night Mode: Dark background with light text - modern and eye-friendly

2

Custom CSS Styling

For advanced customization, use the CSS manager to:

Match your brand colors
Customize fonts and typography
Adjust spacing and layout
Add custom styling elements

Model Selection

3

Choose the Right AI Model

GPT-4o Mini (Recommended):

1x token usage
Fast response times
Great for most customer support needs
Cost-effective for high-volume usage

GPT-4o (Advanced):

5x token usage
Superior reasoning and comprehension
Better for complex queries and analysis
Ideal for specialized or technical support

Updating Agent Instructions

4

Refine Your Agent's Behavior

You can update your agent's instructions at any time:

Go to your agent's management page
Edit the instructions in the text area
Click "Update Instructions" to apply changes immediately
Test the changes using the built-in testing interface

🚀Deploying to Your Website

1

Copy Your Embed Code

From your agent's management page, copy the provided embed code. It will look like this:

<script src="https://helpz.ai/widget.js"
        data-tenant="a1b2c3d4e5f6789abcdef123456789ab"
        data-agent-id="1"
        data-label="AI Help"
        data-context="rich"
        data-persist-thread="on"></script>
                            

2

Set Allowed Domains (Security)

Before deploying, configure your allowed domains to prevent unauthorized use:

Go to the "Allowed Domains" section
Add your website domains (e.g., "example.com, app.example.com")
Use comma-separated format for multiple domains
Save the settings

Security Note: Without allowed domains configured, your widget could be used on any website, potentially consuming your tokens.

3

Add to Your Website

Paste the embed code into your website's HTML:

WordPress: Add to theme's footer.php or use a code insertion plugin
Shopify: Add to theme.liquid file before </body> tag
Squarespace: Use Code Injection in Settings > Advanced
HTML Sites: Paste before the closing </body> tag
React/Vue/Angular: Add to your main index.html file

4

Test Your Deployment

After adding the code:

Visit your website and look for the AI Help button (usually bottom-right)
Click to open the chat widget
Test with a few questions to ensure it's working properly
Verify that conversations persist when navigating between pages

⚙️Advanced Widget Configuration

Complete Widget Sizing Guide: Learn how to customize the width and height of your chat widget to fit perfectly on your website.

Basic Usage

Add data-width and data-height attributes to your widget script:

<script src="https://helpz.ai/widget.js"
        data-tenant="a1b2c3d4e5f6789abcdef123456789ab"
        data-agent-id="1"
        data-width="500px"
        data-height="700px"
        data-label="AI Help"
        data-context="rich"
        data-persist-thread="on"></script>
                    

Supported Dimension Formats

Pixels

Most common format for precise sizing:

data-width="600px"
data-height="800px"
                        

You can also omit "px" - numbers are automatically treated as pixels:

data-width="600"
data-height="800"
                        

Percentages

Size relative to the viewport:

data-width="50%"
data-height="70%"
                        

Viewport Units

Responsive sizing based on screen size:

data-width="40vw"    /* 40% of viewport width */
data-height="60vh"   /* 60% of viewport height */
                        

Em/Rem Units

Font-relative sizing:

data-width="30em"
data-height="35rem"
                        

Common Use Cases

Large Desktop Widget

Perfect for detailed conversations:

<script src="https://helpz.ai/widget.js"
        data-tenant="a1b2c3d4e5f6789abcdef123456789ab"
        data-agent-id="1"
        data-width="600px"
        data-height="800px"
        data-label="Support Chat"
        data-context="rich"
        data-persist-thread="on"></script>
                    

Compact Widget

Smaller footprint for tight layouts:

<script src="https://helpz.ai/widget.js"
        data-tenant="a1b2c3d4e5f6789abcdef123456789ab"
        data-agent-id="1"
        data-width="350px"
        data-height="450px"
        data-label="Quick Help"
        data-context="rich"
        data-persist-thread="on"></script>
                    

Responsive Widget

Adapts to screen size:

<script src="https://helpz.ai/widget.js"
        data-tenant="a1b2c3d4e5f6789abcdef123456789ab"
        data-agent-id="1"
        data-width="40vw"
        data-height="60vh"
        data-label="AI Assistant"
        data-context="rich"
        data-persist-thread="on"></script>
                    

Mobile Customization

Method 1: CSS Override

Add custom CSS to your page to control mobile sizing:

<style>
@media (max-width: 768px) {
  #hb-modal {
    width: 85vw !important;
    height: 60vh !important;
    max-height: 450px !important;
  }
}
</style>
                    

Method 2: Multiple Breakpoints

Fine-tune for different screen sizes:

<style>
/* Tablet */
@media (max-width: 768px) and (min-width: 481px) {
  #hb-modal {
    width: 80vw !important;
    height: 65vh !important;
  }
}

/* Mobile */
@media (max-width: 480px) {
  #hb-modal {
    width: 90vw !important;
    height: 55vh !important;
    max-height: 400px !important;
  }
}
</style>
                    

Method 3: Orientation-Specific

Different sizes for portrait vs landscape:

<style>
/* Mobile landscape */
@media (max-width: 736px) and (orientation: landscape) {
  #hb-modal {
    width: 60vw !important;
    height: 80vh !important;
  }
}

/* Mobile portrait */
@media (max-width: 480px) and (orientation: portrait) {
  #hb-modal {
    width: 90vw !important;
    height: 55vh !important;
  }
}
</style>
                    

Default Behavior

If no dimensions are specified, the widget uses these defaults:

Width: 440px
Height: 620px
Mobile: 95vw × 80vh (overrides desktop dimensions)

Widget Sizing Best Practices

Desktop Sizing

Standard websites: 440px × 620px (default)
Wide layouts: 500px × 700px
Compact areas: 350px × 500px
Full-featured: 600px × 800px

Mobile Considerations

Always test on actual devices
Consider thumb-friendly interaction zones
Account for virtual keyboards
Use viewport units for true responsiveness

Performance Tips

Avoid extremely large dimensions (>1000px)
Test with slow network connections
Consider users with limited screen real estate

Advanced Examples

E-commerce Site

<!-- Large widget for detailed product support -->
<script src="https://helpz.ai/widget.js"
        data-tenant="a1b2c3d4e5f6789abcdef123456789ab"
        data-agent-id="1"
        data-width="550px"
        data-height="750px"
        data-label="Shop Assistant"
        data-context="rich"
        data-persist-thread="on"></script>

<style>
@media (max-width: 768px) {
  #hb-modal {
    width: 88vw !important;
    height: 65vh !important;
  }
}
</style>
                    

SaaS Dashboard

<!-- Responsive widget that adapts to dashboard -->
<script src="https://helpz.ai/widget.js"
        data-tenant="a1b2c3d4e5f6789abcdef123456789ab"
        data-agent-id="2"
        data-width="35vw"
        data-height="70vh"
        data-label="Help Desk"
        data-context="rich"
        data-persist-thread="on"></script>
                    

Landing Page

<!-- Compact widget that doesn't overwhelm -->
<script src="https://helpz.ai/widget.js"
        data-tenant="a1b2c3d4e5f6789abcdef123456789ab"
        data-agent-id="3"
        data-width="380px"
        data-height="500px"
        data-label="Questions?"
        data-context="rich"
        data-persist-thread="on"></script>
                    

Widget Label Customization

Change the button text that appears on your website:

data-label="Ask Our AI Assistant"
data-label="Get Help Now"
data-label="Chat with Support"
data-label="Need Help?"
                    

Troubleshooting Widget Sizing

Widget Too Small

If your widget appears too small:

Check for CSS conflicts on your page
Ensure valid dimension formats
Test with default dimensions first
Use browser dev tools to inspect

Mobile Issues

If mobile sizing isn't working:

Add !important to your CSS rules
Check media query syntax
Test on multiple devices and orientations

Invalid Dimensions

The widget will fall back to defaults if:

Invalid CSS units are used
Negative values are provided
Non-numeric values are used without proper units

⭐Best Practices

Content Organization

📁 Structure Your Knowledge Base

Organize files by topic or category
Use descriptive filenames
Add context descriptions for uploads
Keep documents focused and concise

📄 Document Quality

Use clear, well-formatted text
Include FAQs and common questions
Keep information current and accurate
Remove outdated content regularly

Training Data Tips

What to Include:

Product Documentation: Features, specifications, user guides
FAQ Documents: Common questions and answers
Company Policies: Return policies, terms of service, privacy policy
Support Articles: Troubleshooting guides, how-to articles
Product Catalogs: Pricing, descriptions, availability
Contact Information: Support hours, phone numbers, email addresses

What to Avoid:

Duplicate content across multiple files
Personal or sensitive customer information
Internal company documents not meant for customers
Outdated pricing or product information
Very large files (split into smaller sections instead)

Performance Optimization

💰 Token Management

Monitor your token usage regularly
Use GPT-4o Mini for cost efficiency
Reserve GPT-4o for complex queries
Set up usage alerts

🎯 Response Quality

Test your agent regularly with real questions
Update instructions based on performance
Add new content as questions arise
Remove irrelevant or confusing information

Security Best Practices

Always configure allowed domains before deployment
Review uploaded content to ensure no sensitive information is included
Regularly audit your knowledge base for outdated information
Monitor usage patterns to detect any unusual activity
Use specific instructions to prevent the agent from discussing inappropriate topics

🔧Troubleshooting

Common Issues and Solutions

❌ Widget Not Appearing

Possible Causes & Solutions:

Domain not allowed: Add your domain to the allowed domains list
Incorrect embed code: Copy the latest embed code from your dashboard
JavaScript conflicts: Check browser console for errors
Ad blockers: Some ad blockers may prevent the widget from loading

💬 Agent Not Responding

Check These Items:

Credit balance: Ensure you have sufficient tokens remaining
Agent status: Verify the agent is active and properly configured
Knowledge base: Ensure relevant documents are uploaded and processed
Network connectivity: Check for internet connection issues

📄 Poor Response Quality

Improvement Strategies:

Review instructions: Make them more specific and detailed
Add more context: Upload additional relevant documents
Remove confusion: Delete outdated or contradictory information
Upgrade model: Consider switching to GPT-4o for better performance
Test thoroughly: Use the built-in testing interface to refine responses

💰 High Token Usage

Cost Control Measures:

Monitor usage: Check your dashboard regularly for usage patterns
Optimize model choice: Use GPT-4o Mini for routine queries
Review domains: Ensure only authorized sites can use your widget
Set boundaries: Configure your agent to handle only relevant topics

Getting Support

If you need additional help:

Email Support: Contact support@helpz.ai
Live Chat: Use the chat widget on the HELPZ.ai website
Documentation: Check the help articles in your dashboard
Community: Join our user community for tips and best practices

Response Times: Starter plan users receive email support, Professional users get priority support, and Enterprise users have dedicated support channels.