Skip to main content

2D/3D Configurator

Get started​

Generate code snippet under Admin Panel -> Product -> Copy Embed Code (button). Copy and paste embed code onto your website.

There are two ways to load embed on your page.

Web component​

We provide web component which allows you may easily add to any website or web application. Since it's framework-agnostic it should work fine with any frontend framework.

<mmq-embed short-code="F95SNI" locale="en" with-history></mmq-embed>

To learn more about it, click here.

data-mimeeq element​

Deprecation

This way of using Mimeeq Embed is deprecated. Please use above method.

Embed will be inserted exactly where you put the snippet (specifically, data-mimeeq element).

<div data-mimeeq data-mimeeq-short-code="F95SNI" data-withhistory data-locale="en"></div>
<script
  src="https://jrdgrq09nk.execute-api.eu-central-1.amazonaws.com/api/cpq/get-embed-short-code-data?shortCode=F95SNI&html=1"
  rel="script"
  type="application/javascript"
  async></script>

Parameters​

When you generate the code snippet, you can customize things like:

  • disabling UI elements
  • changing localization
  • customizing brand colors
  • customizing font
  • customizing display style

To see list of parameters, click here.

Controlling visibility​

There is multiple ways to control configurator visibility

Display​

  1. render-at-mount attribute on mmq-embed element. This will display embed as soon as it's loaded.
  2. data-mimeeq-render-at-mount attribute on element with data-mimeeq attribute. This will display embed as soon as it's loaded.
  3. Trigger mimeeq-show-configurator event on your document. This allows you to enable it on demand but requires a bit of coding on host site. You can find full example here.
  4. Call mimeeqApp.utils.showConfigurator method. This works similar to previous option. Learn more about this way here.
  5. Call show method on mmq-embed element.

Hide​

  1. Call mimeeqApp.utils.closeConfigurator method. It will hide any configurator on page. Learn more here.
  2. Trigger mimeeq-unmount event on element with data-mimeeq attribute.
  3. Call hide method on mmq-embed element.