Installation Verification

Confirm your TrialClouds widget is correctly installed and functioning before going live. Follow these checks to ensure everything works perfectly.

---

Pre-Launch Verification Checklist

1

Script Installation

Check: Widget embed script is present on product pages

How to Verify:

1. Visit a product page on your site

2. Right-click → "View Page Source" (or Ctrl+U / Cmd+Option+U)

3. Press Ctrl+F / Cmd+F to search

4. Search for: widget.trialclouds.com

Success: You see:

<script src="https://widget.trialclouds.com/script/YOUR_SITE_ID"></script>

Failure: No script found

• Solution: Add script before </body> tag

• Guide: Installation Guides

2

Button Presence

Check: Try-on button appears on product page

How to Verify:

1. Visit product page

2. Look for try-on button (near images or "Add to Cart")

Success: Button visible and styled

Failure: No button visible

• Check 1: Button HTML added?

• Check 2: CSS hiding button? (Inspect element, look for display: none)

• Check 3: JavaScript error? (F12 → Console tab)

3

Button Attributes

Check: Button has all required data attributes

How to Verify:

1. Right-click button → "Inspect" (or F12 → Elements tab)

2. Check button element has:

   • class="trialclouds-trial-widget-trigger-button"

   • data-product-id="..."

   • data-product-name="..."

   • data-images='[...]'

   • data-link="..."

Success Example:

<button
  class="trialclouds-trial-widget-trigger-button"
  data-product-id="shirt-123"
  data-product-name="Blue Denim Shirt"
  data-images='["https://yourstore.com/images/shirt1.jpg"]'
  data-link="https://yourstore.com/products/blue-denim-shirt"
>
  Try On Now
</button>

Failure: Missing attributes

• Solution: Add missing attributes

• Guide: Button Customization

4

JavaScript API Loaded

Check: Widget API is available in browser

How to Verify:

1. Open browser console (F12 → Console tab)

2. It should show "TrialClouds initialized" message

3. Type: window.TrialClouds_API

4. Press Enter

Success: You see object with methods:

{visitorId: "...", sessionId: "..."}

Failure: undefined or null

• Cause: Script not loaded or loading error

• Check: Network tab (F12 → Network) for failed requests to widget.trialclouds.com

• Solution: Verify script tag, check internet connection, check for JavaScript errors

5

Domain Configuration

Check: Your domain is whitelisted in TrialClouds dashboard

How to Verify:

1. Login to https://app.trialclouds.com

2. Go to Sites → Select your site

3. Check "Domains" list includes your exact domain

Success: Domain listed (e.g., yourstore.com or www.yourstore.com)

Failure: Domain not listed or wrong format

• Solution: Add correct domain

• Important: Include www. if your site uses it, or add both variations

• Guide: Managing Sites - Domain Configuration

Test CORS (Advanced):

1. Open Console (F12)

2. Manually trigger widget or look for CORS errors

3. Error like "blocked by CORS policy" = domain not configured

6

Site Status Active

Check: Site is set to "Active" in dashboard

How to Verify:

1. Dashboard → Sites

2. Find your site

3. Check "Status" column shows "Active" (not "Inactive")

Success: Active status

Failure: Inactive

• Impact: Widget won't work, customers see errors

• Solution: Edit site → Toggle status to Active → Save

7

AI Credits Available

Check: Your account has credits for try-on processing

How to Verify:

1. Dashboard → Credits & Billing

2. Check "Current Balance"

Success: Balance > 0 (e.g., 100 credits available)

Warning: Balance < 50

• Recommendation: Purchase more credits to avoid running out

• Guide: Credits & Billing

Failure: Balance = 0

• Impact: Try-ons will fail (uploads succeed, but processing fails)

• Solution: Purchase credit package immediately

8

Product Images Quality

Check: Product images meet AI requirements

How to Verify:

1. Review images in data-images attribute

2. Open first image URL in browser

3. Verify:

   • Model wearing product ✅

   • Model face clearly visible ✅

   • Front-facing or near-front view ✅

   • Good lighting ✅

   • High resolution (>800×800px, preferably 1200px+) ✅

Success: Images meet all criteria

Failure: No model face, low quality, poor lighting, angle issue

• Impact: Poor try-on results, low download rate, customer dissatisfaction

• Solution: Replace images with high-quality model photos

• Guide: Image Quality Best Practices

---

Functional Testing

1

Button Click Opens Widget

Steps:

1. Visit product page

2. Click try-on button

Expected: Widget overlay appears with upload interface

If Fails:

• Check console (F12) for JavaScript errors

• Verify button class and attributes

• Ensure script loaded (check JavaScript API section)

2

Photo Upload

Steps:

1. Click button to open widget

2. Upload a personal photo (clear face, front-facing)

3. Confirm face detected

4. Select product and proceed

Expected:

• Upload completes quickly (<5 seconds)

• Face detected successfully

• Product preview shown

If Fails:

• "No face detected": Use better photo (clear, front-facing)

• Upload hangs: Check internet connection, file size (<5MB recommended)

• Error message: Check console, contact support if unclear

3

AI Processing Completes

Steps:

1. After upload, click "Try On" or equivalent

2. Wait for processing

Expected:

• Processing completes in 5-15 seconds depending on image size

• Result image shows your face on model body with product

• Result looks reasonably realistic

If Fails:

• Processing stuck > 25 seconds: Server issue, retry

• "Insufficient credits": Purchase more credits

• Error message: Check console, note error for support

• Poor quality result: Product image issue (see Product Images Quality)

Note: This test consumes 1 AI credit (expected)

4

Download Works

Steps:

1. After try-on completes

2. Click "Download" button

Expected: Image downloads to device

If Fails:

• Browser blocks download (pop-up blocker): Allow for this site

• Console error: Note error, contact support

5

Analytics Tracking

Steps:

1. Complete full try-on (from button click to download)

2. Wait 5-10 minutes

3. Login to Dashboard → Analytics

Expected:

• Widget Opens: +1

• Try-Ons Completed: +1

• Downloads: +1 (if you clicked download)

• Visitors: +1 new visitor

If Fails:

• No data after 30 minutes: Check domain configuration, site active status

• Partial data: Some events tracked, others not—check console for errors

• Wait 24 hours: Initial data may be delayed

---

Multi-Device Testing

Test widget on various devices and browsers:

Desktop Testing

Chrome (Windows/Mac):

1. Open product page in Chrome

2. Complete full try-on flow

3. Expected: Works smoothly

Firefox (Windows/Mac):

1. Repeat test in Firefox

2. Expected: Works smoothly

Safari (Mac):

1. Repeat test in Safari

2. Expected: Works smoothly

Edge (Windows):

1. Repeat test in Edge

2. Expected: Works smoothly

---

Mobile Testing

iOS (Safari):

1. Visit site on iPhone/iPad

2. Complete try-on

3. Test camera access vs photo library upload

4. Expected: Works smoothly, button accessible

Android (Chrome):

1. Visit site on Android device

2. Complete try-on

3. Test camera access vs photo library upload

4. Expected: Works smoothly, button accessible

Mobile-Specific Checks:

• Button visible without zooming

• Button touch target large enough (min 44×44px)

• Widget overlay fits screen

• Upload options (camera vs gallery) work

• Result image displays properly

---

Performance Verification

Page Load Impact

Method 1: Browser DevTools:

1. Open DevTools (F12) → Network tab

2. Reload page (Ctrl+R)

3. Look for script/YOUR_SITE_ID request

4. Check load time

Expected: <100ms for script load

Method 2: Lighthouse Audit:

1. Open DevTools → Lighthouse tab

2. Select "Performance" category

3. Click "Analyze page load"

4. Check overall score

Expected: Score >85 (widget should not significantly impact)

---

Widget Responsiveness

Test:

1. Click button to open widget

2. Time from click to overlay appearance

Expected: <500ms (nearly instant)

Test:

1. Upload photo

2. Time from upload complete to try-on processing start

Expected: <1 second

Test:

1. Processing time

Expected: 2-5 seconds (depends on server load, normal)

If Slow:

• 10 seconds processing: Check credits, server status, contact support

• 2 seconds to open: Check page performance, optimize images/scripts

---

Security & Privacy Verification

HTTPS Check

Requirement: Your site MUST use HTTPS

How to Verify:

1. Visit your product page

2. Check URL starts with https:// (not http://)

3. Look for padlock icon in browser address bar

Success: Secure connection

Failure: HTTP site

• Impact: Camera access won't work on mobile, security warnings

• Solution: Enable SSL/TLS certificate on your hosting

---

Pre-Launch Checklist Summary

Before making widget live to all customers, ensure:

• Widget script installed on all product pages

• Try-on button visible and styled

• All button attributes correct (product-id, images, etc.)

• JavaScript API loaded (window.TrialClouds_API exists)

• Domain configured in dashboard

• Site status = Active

• AI credits available (recommend >100 for launch)

• Product images high quality with model faces

• Tested full try-on flow (open, upload, process, download)

• Analytics tracking working

• Tested on desktop (Chrome, Firefox, Safari, Edge)

• Tested on mobile (iOS Safari, Android Chrome)

• Performance acceptable (page load <3s total)

• HTTPS enabled on your site

• Privacy policy updated

• Support familiar with how to assist customers

---

Ongoing Monitoring

After launch, monitor:

Daily:

• Credit balance (low balance alert)

• Widget usage (Analytics → Widget Opens)

• Any error reports from customers

Weekly:

• Analytics review (opens, completions, downloads)

• Product performance (which products used most?)

• Download rate (quality indicator: >30% is good)

Monthly:

• Device/browser breakdown

• Geographic distribution

• Conversion rate (try-on users vs non-users)

• Performance metrics (Lighthouse audit)

---

Troubleshooting Failed Verification

If Multiple Checks Fail

Check: Is widget script actually loading?

1. F12 → Network tab → Filter for "widget.trialclouds"

2. Reload page

3. Look for request

If No Request:

• Script tag not present in HTML

• JavaScript error blocking script load

• Ad blocker blocking request (disable to test)

If Request Fails (404, 500, etc.):

• Site ID incorrect (double-check)

• TrialClouds service down (check status page if available)

• Network/firewall issue

---

If Widget Works Locally But Not on Live Site

Possible Causes:

• Domain mismatch (dev domain vs production domain)

• Cache (clear browser cache, try incognito)

• Different Site ID used in dev vs production

• CDN/caching layer serving old version

Solution:

• Verify Site ID matches between dev and production

• Add production domain to site configuration

• Clear all caches (browser, CDN, server)

• Test in incognito mode

---

Related Guides:

• Common Issues

• Installation Guides

• Managing Sites

Verification failing? Email verification checklist results to [email protected]