iJewel3DDocs

Appearance

Contact supportSign in
ShareEmbed on a website

Set the metal from the page URL ​

Add a layer name and a variation name to the embed address, and the viewer opens with that metal.

The viewer can open with one material already selected. To do this, add a layer name and a variation name to the embed address. This works in an iframe address and in a direct link.

Before you start ​

  • The model must have material options. Refer to Material Configurator. A model with no options has nothing to change.
  • You need the embed address of the model. Refer to Create an embed.

Find the two names ​

Step 1 of 4
  1. Open the model in the editor.
  2. Look at the tabs at the bottom of the configurator. Each tab is one layer, for example Metal.
  3. Right-click a tab and select Edit to see the exact layer name.
  4. Hold the pointer on a variation icon. The editor shows the variation name, for example Gold.

Add the names to the address ​

Step 1 of 4
  1. Add ? to the end of the embed address.
  2. Add the layer name, then =, then the variation name.
  3. For one more layer, add & and the next pair.
  4. If the address already contains ?, start with &.
text
https://ijewel3d.com/drive/files/MODEL_ID/embedded?Metal=Gold
https://ijewel3d.com/drive/files/MODEL_ID/embedded?Band=Rose-Gold&Gem=Ruby
https://ijewel3d.com/drive/files/embedded?tag=pid-12345&scope=FOLDER_ID&Metal=Gold

Names must match exactly

Type each name exactly as the editor shows it. Upper case and lower case letters must match. If a name does not match, the viewer ignores it.

Change the metal with no page reload ​

Use #? in place of ?. The viewer then applies the material immediately and does not load again. Your web developer can connect this to the option buttons on your product page:

html
<button onclick="setMaterial('Metal', 'White-Gold')">White gold</button>
<script>
  const iframe = document.getElementById('viewer-frame');
  function setMaterial(layer, name) {
    const url = new URL(iframe.src);
    url.hash = `?${layer}=${name}`;
    iframe.src = url.toString();
  }
</script>