top of page

Lix Components: Lix AR

Updated: May 15

About

The Interactive Lottie Component lives under the Lix Components library from Threed Software, a library of extensions to Wix basic functionality, using Custom Elements.


With this package, you can effortlessly integrate Augmented Reality (AR) applications directly into your Wix website. This component adds Augmented Reality (AR) capabilities to your web applications using the LitElement library and the @google/model-viewer library.


This component is a part of the Lix Components Library.


Demo

You can see a live example of the Lix Interactive Lottie components below.


Installation and Set Up Guide




Add To Your Site

  1. Click the Install App Button

  2. Add to Site: Look for the "Add to Site" button on the app's details page and click on it.

  3. Choose Your Site: If you have multiple websites associated with your Wix account, a pop-up will appear asking you to select the website where you want to add the app. Choose the relevant website and click "Add to Site."

  4. Configure App Settings: After adding the app, you may be directed to the Wix Editor. If not, go to your Wix Editor by logging into your Wix account and clicking "Edit Site."

  5. Access the App: Once in the Wix Editor, locate the app's icon or element on your website. This could be a widget, button, or other UI element depending on the app's functionality.


Add LixAR Component

  1. Drag and drop the custom HTML element onto your Wix page.

  2. Customize the component properties in the Wix editor or through code.


Add AR Models

  1. Upload your 3D models in .glb format.

  2. Once uploaded, select your model from the drop down options.

  3. Add poster image (optional)

  4. Select model placement

  5. Preview your model design


Additional Features

Extend the component's functionality by adding custom methods or properties to the LixAR class. For example, you might want to add methods for model manipulation or additional properties for enhanced customization.


Customize your LixAR element by setting attributes using the setAttribute() function. For a list of attributes that can be set, check out the documentation here.


37 views0 comments

Recent Posts

See All

Comments


bottom of page