eCommerce Web Services logo
Back to Software

Virtual Try-On for WooCommerce - Documentation

Complete setup and configuration guide for the AI-powered Virtual Try-On plugin

What is Virtual Try-On for WooCommerce?

Virtual Try-On for WooCommerce is an AI-powered WordPress plugin that enables customers to preview products (glasses, sunglasses, jewelry, etc.) on their own photos before making a purchase. The plugin integrates seamlessly with WooCommerce and uses advanced AI image processing to generate realistic try-on previews.

Key Benefits

  • Increased Conversion Rates: Customers can see how products look on them before buying
  • Reduced Returns: Better product visualization leads to more confident purchases
  • Enhanced User Experience: Modern, intuitive interface with camera and upload options
  • Privacy-Focused: All processing happens on your server with your chosen AI provider
  • Multi-Language Support: Built-in translations for English, Greek, and German

Plugin Features

Core Functionality

  • AI-Powered Try-On: Generate realistic product previews using Google Gemini or custom AI endpoints
  • Flexible Image Input: Support for both file uploads and live camera capture
  • Product-Level Control: Enable/disable try-on per product with optional custom frame images
  • Modern Modal Interface: Responsive, accessible UI with smooth animations
  • Generation Counter: Track usage statistics in admin dashboard
  • Debug Mode: Comprehensive logging for troubleshooting
  • User Consent Management: Requests user approval to store their photo for easy reuse across multiple virtual try-ons
  • Virtual Try-On Gallery: Displays all virtual try-ons in a grid format for easy comparison with "Buy Now" buttons for quick ordering
  • Temporary Photo Storage: Photos are stored temporarily for 24 hours with automatic deletion after expiration
  • Bulk Category Activation: Enable virtual try-on for all products within specific categories (major time-saving feature!)

User Interface Features

  • Responsive Design: Works on desktop, tablet, and mobile devices
  • Accessibility: ARIA labels, keyboard navigation, screen reader support
  • Multi-Language UI: Dynamic language switching (English/Greek/German)
  • Consent Management: User consent checkbox before AI processing
  • Real-Time Feedback: Loading states, progress indicators, error messages

Admin Features

  • Settings Dashboard: Centralized configuration in WooCommerce settings
  • License Management: Built-in license validation and status monitoring
  • Category Overrides: Set different store types for specific product categories
  • Product Meta Fields: Per-product try-on settings and custom frame images
  • Usage Analytics: Generation counter and debug logs

System Requirements

WordPress & WooCommerce

  • WordPress: 6.0 or higher
  • WooCommerce: 6.0 or higher (tested up to 9.0)
  • PHP: 7.4 or higher
  • MySQL: 5.6 or higher

Server Requirements

  • SSL Certificate: Required for camera access (HTTPS)
  • File Upload: Minimum 10MB upload limit recommended
  • Memory: 256MB PHP memory limit minimum
  • Execution Time: 60 seconds recommended for AI processing

AI Provider Requirements

  • Google Gemini: API key with Gemini 2.5 Flash Image Preview access
  • Custom Endpoint: RESTful API supporting image processing

Installation Guide

Method 1: WordPress Admin (Recommended)

  1. 1Download the plugin ZIP file from your license portal
  2. 2Go to Plugins → Add New → Upload Plugin
  3. 3Select the ZIP file and click Install Now
  4. 4Click Activate Plugin

Method 2: FTP Upload

  1. 1Extract the plugin ZIP file
  2. 2Upload the virtual-try-on-for-woocommerce folder to /wp-content/plugins/
  3. 3Go to Plugins in WordPress admin
  4. 4Find "Virtual Try-On for WooCommerce" and click Activate

Post-Installation Setup

  1. 1Navigate to WooCommerce → Virtual Try-On
  2. 2Enter your license key and click Validate License
  3. 3Configure your AI provider settings
  4. 4Test the functionality on a product page

Configuration Settings

Access settings via WooCommerce → Virtual Try-On:

License Configuration

  • License Key: Enter your purchased license key
  • License Status: Displays current validation status
  • Actions: Validate and save license buttons

AI Provider Settings

  • Provider: Choose between "Google Gemini" or "Custom"
  • API Key: Your AI provider API key
  • Model: AI model name (default: gemini-2.5-flash-image-preview)
  • Custom Endpoint: URL for custom AI provider (if using Custom)

How Customers Use the Plugin

Customer Experience

  1. 1Product Page: Customer visits a product with try-on enabled
  2. 2Try-On Button: Click the "Try On" button below the add-to-cart form
  3. 3Modal Interface: Upload a photo OR use camera, accept consent checkbox, click "Generate Preview"
  4. 4Processing: Wait 10-30 seconds for AI generation
  5. 5Result: View the try-on preview image
  6. 6Actions: Close modal or try again with different photo

Admin Monitoring

  • Generation Counter: Track total try-on generations in settings
  • Debug Logs: Monitor processing in server error logs (if debug enabled)
  • License Status: Regular validation ensures continued functionality

AI Provider Setup

Google Gemini (Recommended)

Setup:

  • Create a Google Cloud Project: Go to Google Cloud Console, click "Create Project", enter a project name, and click "Create"
  • Enable the Gemini API: In your project dashboard, navigate to "APIs & Services" → "Library", search for "Generative AI API" or "Gemini API", and click "Enable"
  • Generate API Key: Go to "APIs & Services" → "Credentials", click "Create Credentials" → "API Key", copy the generated key, and optionally restrict it for security
  • Set model to gemini-2.5-flash-image-preview in plugin settings

Features:

  • High-quality image generation
  • Fast processing (10-20 seconds)
  • Reliable uptime
  • Built-in safety filters

Limitations:

  • Requires Google Cloud account
  • Usage-based pricing
  • Rate limits apply

Custom Endpoint

Requirements:

  • RESTful API endpoint
  • Accepts POST requests with image data
  • Returns JSON response with generated image

Common Issues & Solutions

Try-On Button Not Showing

  • Check: Product has "Enable Optical Try-On" checked
  • Check: WooCommerce is active and updated
  • Check: Theme compatibility (try default theme)

500 Internal Server Error

  • Check: PHP error logs for specific errors
  • Check: Memory limit (increase to 256MB+)
  • Check: Execution time limit (60+ seconds)
  • Check: File upload limits

Camera Not Working

  • Check: HTTPS is enabled (required for camera access)
  • Check: Browser permissions granted
  • Check: Device has camera available

AI Generation Fails

  • Check: API key is valid and has credits
  • Check: Network connectivity to AI provider
  • Check: Image file size (under 10MB recommended)
  • Check: Debug logs for specific error messages

Debug Mode

Enable debug mode in settings to get detailed logs:

  1. 1Go to WooCommerce → Virtual Try-On
  2. 2Check Debug Mode
  3. 3Save settings
  4. 4Check server error logs for detailed information

Cookie Settings

We use cookies to enhance your browsing experience and analyze our traffic. Please choose your preferences below.