This is a short list of our most frequently asked questions. For more information about Magic Mirror, or if you didn't find the answer you were looking for, please contact us.


Magic Mirror

A complex multiplatform and multidevice product visualization solution. Your customers can try on your products using their own pictures or selfies, right on your e-shop’s front page. Decorative cosmetics, apparel, fashion accessories, eyeglasses, lenses are all covered.

2. The mirror was written in HTML5 markup language, that means all browsers, operating systems and devices are supported and will be working flawlessly with the mirror.

A huge advantage of the Magic Mirror is that all makeover computing will be done by our servers, so your page will not be impacted at all!
A simple source code is embedded into your page.

Using our virtual mirror on your e-shop’s front page is very user friendly:

  1. Click the "Add your photo" button and select your picture. (For the most accurate results please use a still, straight, front-on picture of yourself.)
  2. The Magic Mirror will automatically adjust the picture to your face or body, however, you may need to do further adjusting yourself in a later stage.
  3. The "Add your photo" button is now replaced with your virtual try-on picture. You can hover over your photo to view a larger version or click on the small edit button to re-adjust the product to your features.
Most modern web browsers are supported by the Magic Mirror, including mobile browsers. We support Chrome >= 31.0, Firefox >= 27.0, Microsoft Edge, Safari >= 7.0, iOS Safari >= 4.0 and Android browser >= 3.0.

Yes, we store the photos during the current browsing session (max 24 hours), after that the photos are deleted.

No, nobody can. Our system has no capabilities built in to keep, access or view any pictures of customers, only the customer has control over their own uploaded images.

There is no doubt that the industry of virtual try-on solutions is aiming at 3D, but most solutions are FLASH or Desktop based and outdated, resulting in less than ideal investment return. To sum it up, 3D visualization is currently operating in the ‘amuse department’, we operate in the „you will sell a lot more and make profit” one.

Integration of Magic Mirror

  1. You need to create your free or paid account on virtooal.com
  2. Place the widget code on your product's page
  3. Integrate your products (set up the color/photo) in our admin

Our main goal is that our apps and services meet all your needs. So if you need any help with matching your design with our apps, integration, we are here to help. Just email us at support@virtooal.com and we will team up with you to make your app look great and unique!

Yes, it does. Since the mirror is integrated by embeding a source code, basically just some space is necessary on your product`s page, where the mirror can be fitted.

<script charset="utf-8" id="gallery-widget" src="http://widget.virtooal.com/{your username}/{your API key}/{language}/{product id or sku}" async> </script>
<div class="virtooal-widget">
<div class="gw-container"
data-modal_color = "{color}"
data-plus_color = "{color}"
data-modal_opacity = "0.8"
data-thumbwidth="{width in px}">

This code should be embedded on your product's front end page. All parentheses will be replaced automatically, as you enter your settings and copy the code from your user account admin on virtooal.com, except the {product id or sku}. This needs to be replaced on your site programmatically with your current product id. If you are not sure how to replace it, please ask your webmaster or email us on support@virtooal.com

You can add products 3 ways:

  1. In Virtooal's Admin in Products listing by "Add new product" button
  2. In Virtooal's Admin, upload an xml feed and add all products at the same time (we recommend this solution, since it is the easiest).
  3. From Virtooal's Admin Settings page, use the Admin code to set up your products directly from your site’s admin. Paste the Admin code or ask your webmaster to place it to your site’s back end page and replace the {product id or sku} programmatically with your product ID.

If you encounter any issues with adding a product, just contact us using support@virtooal.com.

If your products are already added/imported in our admin, you can set them up.

Beauty products:

  1. Click on the product in the Products Listing menu. On the product page, click on the product image or color wheel and choose the right color for your product.
  2. Click Publish and Save.

Other products:

  1. Upload product image and set it up on our model picture (resize, move, rotate or cut the white background with our tools).
  2. Click Publish and Save.

The best results can be achieved by PNG images with a transparent background, otherwise you will have to use a photo editing software (like photoshop, etc.) or our simple built in background removal tool to remove the white background around the product.

If you have any troubles with setting up a product, just contact us using support@virtooal.com and we can set up 5 products for free for you.

Of course, you can order product integration from our admin, our professionals will do it for you.

In the Product Listing menu, select all the products which you would like to integrate and click on Order integration, or choose one of our setup packages for even better pricing.

  1. Do you have a mirror code on your product's front-end page?
  2. Does your replaced Product ID match with the Product ID uploaded in our admin?
  3. Is your product published in our admin?

If the answers did not help you, just contact us on support@virtooal.com and we will make it work.

It is possible to make it work by your product's URL, in this case please contact us at support@virtooal.com and we will make it work for you.
  • Just write us an email on support@virtooal.com.
  • We will create a free account for you
  • Please include your link to your XML feed if you have one
  • We will set it up and send you the code to embed the plugin, or help you with placing the mirror into your product's front end.
Yes, you can. Our professionals have done it countless times with 100 percent satisfaction. They are top notch IT professionals, with many years of experience.
Each new product you add can be integrated. For cosmetics it takes no more than 10-20 seconds, with a bit longer for eyeglasses, fashion accessories and all other. Or we can do all of it for you – just contact us about or offers at sales@virtooal.com.

Yes, we have our dedicated apps for these platforms:

Our virtual try-on software is can also be easily installed in any other platform, only by adding a script and some html snippets. If you do not have a developer, we can do it for you free of charge.

Big Mirror

The Big Mirror is a complex multiplatform and multidevice product visualization solution.  In addition to the Magic Mirror, your customers can try everything on in real time while browsing your products. Another advantage of the Big Mirror is that it is possible to try multiple products at the same time. Decorative cosmetics, apparel, fashion accessories, eyeglasses, lenses are all covered.

The Big Mirror can be placed on the product listing/catalog page, product page or on a new page as a standalone app.

Integration of the Big Mirror

For integration, please follow the steps for Magic Mirror. If you integrate your products at the same time, they will be available for both mirrors.

The only difference is in placing the embedding code – it needs to a single page (for example yourdomain.com/mirror)


<iframe src="//mirror.virtooal.com/app/{your API key}/{your username}?c={color}&l={language}" width="100%" height="660" scrolling="no" frameborder="0" id="virtooal-mirror"></iframe>
<script src="//mirror.virtooal.com/assets/js/widget.js"></script>

All parentheses will be replaced automatically as you enter your settings and copy the code from your user account admin on virtooal.com - Big Mirror code.

This mirror can be placed in the catalog’s front-end page (product list), as well as the product front-end page. Example of a virtual mirror here.

The mirror is also suitable for responsive desktop & mobile sites. When browsing on a phone, the mirror is hidden by default and will open to full screen after clicking the Try On button.

Code integration

Mirror Code

Should be placed before </body> end tag

<div id="virtooal-mirror-fix-container"><div id="virtooal-mirror-fix-content"><div id="virtooal-mirror-title"></div><div id="virtooal-mirror-fix-iframe"></div></div></div>
var virtooalMirrorSettings = {
userName: "{your username}",
apiKey: "{your API key}",
mirrorWidth: 260,
lang: "en",
title: "Virtual Mirror",
titleLeft: "Virtual",
titleRight: "Mirror",
color: "E20074",
color2: "E20074",
side: "left",
maxContentWidth: 0,
marginFromContent: 10,
} </script>
<script src="https://mirror.virtooal.com/assets/js/widget.js"></script>
<script src="https://mirror.virtooal.com/assets/js/crossmirror.php"></script>

All parentheses will be replaced automatically as you enter your settings and copy the code from your user account admin on virtooal.com. It is possible to customize the the color, width, language and other parameters, except the userName and apiKey.

Try On Button

Under every product we suggest to add a Try on button. It can be any html element (for example <button>), styled by you.

This element must have a class=”virtooal-tryon-btn” and attribute data-virtooal_id=”{product id or sku}”, where {product id or sku} has to be replaced programatically with your product ID.

We also suggest adding style=”display:none” to the button, so it will be hidden by default, and when our script detects that the product is set up in the mirror, it will make the button visible on your site.


If you need any help with matching your design with our apps, change the models or need any special functions, we are here to help. Just email us at support@virtooal.com and we will team up with you to make your app look great and unique!
Cookies help us deliver our services. By using our services, you agree to our use of cookies Learn more