Embedding an Ocavu Experience Launcher Button is as simple as adding another button to your webpage in your usual style, then adding specific data-ocavu- attributes.
Step 1
Pick your call to action. This should be tailored to your product and brand to help your users understand what the button will do and encourage them to initiate the immersive experience. Some examples include:
- View in Your Space
- View in Real Life
- View in Your Kitchen
- View in Your Backyard
- View in Your Room
Step 2
Add a typical button with your call to action to your webpage with a position and size that matches the surrounding content. Example:
<button class="action-button">View in Your Space</button>
Step 3
Add the appropriate data-ocavu- attributes. To launch the default OcavuView experience, simply add data-ocavu-key with the model key that corresponds to the product that you wish to show within the experience. Example:
<button class="action-button" data-ocavu-key="default-test-model">View in Your Space</button>
If you wish to launch a customized experience, include the data-ocavu-xp attribute:
<button class="action-button" data-ocavu-key="default-test-model" data-ocavu-xp="auto-rotate">View in Your Space</button>