iJewel3D Docs

Appearance

Create an iJewel viewer embed ​

An embed lets you place an interactive iJewel3D viewer on a website without building a JavaScript integration. Configure the viewer in iJewel Drive or iJewel Design, then copy either the complete <iframe> code or only its embed URL.

Choosing an integration

Use an iframe embed when you want the quickest setup and the viewer can run as a self-contained element. Use the Mini Viewer SDK when your website must control the viewer directly or connect it closely to other page interactions.

Before you begin ​

You need:

  • An account on iJewel Drive or iJewel Design
  • A model that visitors are allowed to view, such as a public or unlisted model
  • Permission to add an iframe or URL to the destination website

Step 1: Open the model in the editor ​

From iJewel Drive ​

Select the model, open its actions menu, then choose Open In → Playground. Depending on your Drive layout, you may also be able to right-click the model to open the same menu.

The iJewel Drive model actions menu with Open In and Playground selected

Open the selected Drive model in Playground.

From iJewel Design ​

Open your profile, find the design, and select the pencil icon on its card.

An iJewel Design card with the edit pencil icon visible

The pencil icon opens the design in the editor.

Step 2: Configure the embed ​

In the editor, select the Embed (</>) tool. Choose the size and the viewer controls you want to make available. Preview the result before copying it.

The iJewel editor Embed panel showing Copy HTML code, View code, preview, and viewer settings

The Embed panel generates the viewer code from your selected settings.

Some branding controls depend on your iJewel plan.

Step 3: Copy the right value ​

Choose the output required by the destination website:

Destination acceptsWhat to copy
HTML or an embed blockSelect Copy HTML code and paste the complete <iframe> element
A URL field, such as a Shopify URL metafieldSelect View code and copy only the URL inside the iframe's src="..." attribute

The generated iframe code with its src URL underlined

For a URL-only field, copy the complete value between the quotation marks after src=.

Do not copy the editor URL from the browser address bar. The embed URL comes from the generated iframe and opens the viewer without the editor interface.

Set initial material selections

You can add material selections to the embed URL. See Apply materials through the URL.

Use the embed ​

Troubleshooting ​

  • If the viewer asks visitors to sign in, confirm that the model is public or unlisted.
  • If the website rejects the code, check whether it accepts HTML or only a URL.
  • If the viewer is cropped, use a responsive container and give it an explicit height or aspect ratio.
  • If your configuration changes, generate the embed again and replace the existing code or URL.
Contact

For embedding or licensing assistance, email contact@ijewel3d.com.