iJewel3DDocs

Appearance

Contact supportSign in
ShareStore platforms

Viewer on Wix, Magento and BigCommerce ​

Add the iJewel3D viewer to a Wix, Magento or BigCommerce store, or to a different website builder, with one iframe.

Wix, Magento, BigCommerce and other website builders can show the iJewel3D viewer in an iframe. An iframe is one block of HTML. You do not write code, and you do not register your domain.

Before you start ​

  • Visitors must be able to see the model. Make the file public before you embed it.
  • You need permission to add custom HTML to your store pages.
  • You need the embed code of the model. Refer to Create an embed.

Add the viewer to a page ​

Step 1 of 7
  1. In the iJewel platform, open the model in the editor and copy the embed code.
  2. In your store admin, open the page or the product template for the viewer.
  3. Add a block that accepts custom HTML. Each platform has its own name for this block.
  4. Paste the full iframe code into the block.
  5. Save and publish the page.
  6. Open the published page in a private browser window.
  7. Make sure that the model shows and that you can turn it.

If a field accepts only an address ​

Some fields accept a web address and not HTML.

Step 1 of 3
  1. Find src="..." in the iframe code.
  2. Copy only the address between the quotation marks.
  3. Paste that address into the field.

Do not copy the editor address from your browser. That address opens the editor and not the viewer.

Size the viewer ​

If the page cuts off the viewer, give the iframe a full width and a fixed height or an aspect ratio. The standard code uses width: 100%, min-height: 420px and aspect-ratio: 16 / 9.

When your developer needs more control

An iframe is the correct method for most stores. If the page must control the viewer, your developer can use the SDK. The SDK needs a registered domain. Refer to Register a domain for the SDK.

Wedding Band Builder

The Wedding Band Builder has its own pages for Wix, Magento and BigCommerce.