Virtual Try-On Documentation

Getting Started

↑ Back to top

Virtual Try-On for WooCommerce allows your customers to visualize products in their own photos before making a purchase. Whether it’s seeing how a t-shirt looks on them or how a couch fits in their living room, this plugin provides an interactive shopping experience that increases confidence and reduces returns.

Requirements

↑ Back to top

• WordPress 6.0 or higher
• WooCommerce 8.0 or higher
• PHP 7.4 or higher
• Google Gemini API key (required for AI functionality)

Installation

↑ Back to top

1. Purchase and Download
   • Purchase the plugin from WooCommerce.com
   • Download the plugin ZIP file from your account
2. Install the Plugin
   • Go to WordPress Admin → Plugins → Add New
   • Click “Upload Plugin”
   • Choose the downloaded ZIP file
   • Click “Install Now”
   • Click “Activate Plugin”
3. Verify Installation
   • Go to WooCommerce → Settings → Virtual Try-On
   • You should see the configuration page

Configuration

↑ Back to top

Google Gemini API Setup

↑ Back to top

Get Your API Key

• Visit Google AI Studio
• Sign in with your Google account
• Click “Create API Key”
• Copy your API key

Configure the Plugin

• Go to WooCommerce → Settings → Products → Virtual Try-On
• Paste your Google Gemini API key in the “API Key” field
• Click “Save changes”

Global Settings

↑ Back to top

Navigate to WooCommerce → Settings → Products → Virtual Try-On to configure:

API Settings

• Google Gemini API Key (required): Your API key for AI image generation
• Daily Generation Limit: Maximum number of virtual try-ons allowed per day (default: 100)
• Test Connection: Button to verify your API key is working

Display Settings

• Enable Virtual Try-On: Global toggle to enable/disable the feature site-wide
• Button Text: Customize the text displayed on the Virtual Try-On button (default: “Virtual Try-On”)
• Button Position: Choose where the button appears on product pages (before/after add to cart)

Advanced Settings

• Image Quality: Control the quality of generated images (low, medium, high)
• Generation Timeout: Maximum time to wait for image generation (default: 30 seconds)
• Enable Usage Statistics: Track how many virtual try-ons are generated

Usage

↑ Back to top

For Store Owners

↑ Back to top

Enabling Virtual Try-On for Products

Edit a Product

• Go to Products → All Products
• Click on a product to edit

Configure Virtual Try-On

• Scroll to the “Virtual Try-On” tab in the product data section
• Check “Enable Virtual Try-On for this product”
• Enter a custom prompt (optional but recommended)

Setting Custom Prompts The prompt describes how the product should appear in customer photos. Examples:

• Fashion: “Show this {product_name} being worn by the person in the photo”
• Furniture: “Place this {product_name} in the room shown in the photo”
• Accessories: “Display this {product_name} on the person in the photo”

Save Changes

• Click “Update” to save your product settings

For Customers

↑ Back to top

Your customers will see a “Virtual Try-On” button on enabled product pages. The experience is simple:

1. Click the “Virtual Try-On” button
2. Upload a photo from their device
3. Wait a few seconds while AI generates the visualization
4. View the result showing the product in their photo
5. Download or share the result (optional)

Product Settings

↑ Back to top

Virtual Try-On Tab

↑ Back to top

When editing a product, you’ll find a “Virtual Try-On” tab with these options:

Enable Virtual Try-On

Toggle to enable/disable virtual try-on for this specific product.

Example Prompts:

Fashion & Apparel:

Show this product being worn by the person in the photo,
maintaining natural lighting and perspective

Furniture:

Place this product in the room shown in the photo,
ensuring proper scale and perspective with existing furniture

Accessories:

Display this product on the person in the photo,
positioned naturally and realistically

Home Decor:

Position this product in the space shown in the photo,
matching the room's lighting and style

Customization

↑ Back to top

Styling the Modal

↑ Back to top

You can customize the Virtual Try-On modal appearance using CSS. Add custom CSS to Appearance → Customize → Additional CSS.

Translating the Plugin

↑ Back to top

Virtual Try-On is translation-ready and includes support for 16 languages:

• Arabic, Danish, German, Greek, English, Spanish, Finnish, French, Hebrew, Indonesian, Japanese, Korean, Dutch, Portuguese, Russian, Swedish

Troubleshooting

↑ Back to top

Common Issues

↑ Back to top

Virtual Try-On Button Not Appearing

Problem: The button doesn’t show on product pages.

Solutions:

1. Check that Virtual Try-On is enabled globally (WooCommerce → Settings → Virtual Try-On)
2. Verify that the specific product has Virtual Try-On enabled
3. Check that your API key is configured correctly
4. Clear your site cache

API Key Not Working

Problem: Error message about invalid API key.

Solutions:

1. Verify you copied the entire API key without spaces
2. Check that your API key is for Google Gemini (not another Google service)
3. Ensure your API key has not been revoked
4. Test the connection using the “Test Connection” button

Generation Takes Too Long

Problem: Virtual try-on generation times out.

Solutions:

1. Check your internet connection speed
2. Try using a lower image quality setting
3. Ensure uploaded images are not excessively large (recommend under 4MB)

Generated Images Don’t Look Good

Problem: The AI-generated results are not realistic.

Solutions:

1. Write more detailed prompts with specific instructions
2. Ensure product images are high quality and well-lit
3. Advise customers to upload clear, well-lit photos
4. Avoid photos with complex backgrounds initially

Daily Limit Reached

Problem: Users see “daily limit reached” message.

Solutions:

1. Increase the daily limit in settings
2. Reset statistics if needed
3. Consider getting a higher-tier API plan
4. Monitor usage patterns to set appropriate limits

Error Messages

↑ Back to top

Error	Meaning	Solution
Invalid API Key	API key is incorrect or revoked	Re-enter your API key
Daily Limit Reached	Generation limit exceeded	Increase limit or wait for reset
Upload Failed	Image upload error	Check file size and format
Generation Timeout	AI took too long	Increase timeout or reduce quality
Invalid Image	Uploaded file is not an image	Use JPG, PNG, or WebP format

FAQs

↑ Back to top

General Questions

↑ Back to top

Q: Does this work with variable products?
A: Yes, you can enable Virtual Try-On for variable products. Each variation uses the same prompt by default, but you can customize prompts per variation.

Q: What image formats are supported for customer uploads?
A: JPG, JPEG, PNG formats are supported. Maximum file size is 4MB.

Q: How many virtual try-ons can I offer per day?
A: This depends on your daily limit setting and your Google Gemini API plan. The default is 100 per day, but this is configurable.

Q: Can customers save or share their virtual try-on results?
A: Yes, customers can download their generated images. Sharing functionality depends on your theme and device.

Q: Does this work on mobile devices?
A: Yes, the Virtual Try-On feature is fully responsive and works on smartphones and tablets.

Technical Questions

↑ Back to top

Q: Does this slow down my site?
A: No, the plugin is lightweight. Image generation happens asynchronously via Google’s API and doesn’t impact your site performance.

Q: Is customer data stored?
A: No, uploaded images are sent directly to Google Gemini API and are not stored on your server. Generated images are shown to the customer but not saved unless they download them.

Q: Can I use this with product bundles?
A: Currently, Virtual Try-On works best with individual products. Bundle support may be added in future updates.

Q: Does this work with page builders?
A: Yes, as long as your page builder uses standard WooCommerce product templates, the Virtual Try-On button will appear.

Q: Can I customize the modal design?
A: Yes, you can customize the appearance using CSS. See the Customization section.

Billing Questions

↑ Back to top

Q: How much does the Google Gemini API cost?
A: Google Gemini has a free tier and paid plans. Visit Google AI Pricing for current rates.

Q: Am I charged per virtual try-on?
A: The plugin itself doesn’t charge per use. However, Google Gemini API usage may incur costs based on your API plan.

Q: Can I track API costs?
A: Enable usage statistics in the plugin settings to track the number of generations. For detailed API costs, check your Google Cloud console.

Support

↑ Back to top

Need help? Here’s how to get support:

1. Documentation: Review this documentation thoroughly
2. WooCommerce.com Support: Submit a ticket through your WooCommerce.com account
3. Community Forums: Ask questions in the WooCommerce community
4. API Issues: For Google Gemini API issues, consult Google AI documentation

When requesting support, please include:

• Plugin version
• WordPress version
• WooCommerce version
• PHP version
• Description of the issue
• Screenshots (if applicable)
• Any error messages