Skip to main content

Short Codes

Mimeeq configurator provides multiple types of short codes. These have different roles in configurator environment and may be required to get access to some data.

Embed short code​

Embed short code is a short code which is used to get data required to render Embed. It helps us get information about customer and type of embed.

You may get this code in some ways. The easiest of them is entering Mimeeq App and getting into Embed Code Snippet modal. There you can find it as part of HTML code.

There is few types of Embed Code Snippets. Each of them generates different type of embed.

  • Product - most basic type of Embed. It's single product embed. It's probably this one you will need if you want to combine our embed with your existing product pages. It's generated from product details admin page.
  • Products - list of all active products with ability to display single product configurator on item click (behaves as Product). In case of authenticated users it may also allow for using Favourites. It's generated on Products page.
  • Product Group - same as Products but displays only products from single product group. It's generated on product group details page.
  • Favourites - list of favourites with ability to display single product configurator on item click (behaves as Product). User needs to be authenticated with Mimeeq Auth to display this type of embed. It's generated on Settings page.
  • Auth - Allows for loading auth utils and rendering authorization related modals like Sign In, User Profile, Forgot Password. It's generated on Settings page.

In case of Product embed short code you may also get it as part of mimeeq-add-to-cart and mimeeq-show-summary events as property embedShortCode. To learn more about them, click here.

Configuration short code​

It's short code generated for each standard product configuration. It refers to product id and configuration code pair. It's unique and constant for each combination of these. You may obtain it in few ways.

As in Embed short code case this short code is available as part of mimeeq-add-to-cart and mimeeq-show-summary events payload as property shortCode. To learn more about them, click here.

You may also generate it on demand by using our Web API. To do that you need to call mimeeqApp.utils.getShortcode method. To learn more about it, click here.

It's one of short codes used to get data from our REST API.

Scene short code​

This is short code generated for Modular scenes. It's used to store information about your current scene. And by using this you may reload previously generated configurations. It's not unique per scene. So the same scene configuration can have multiple different short codes.

As in Embed short code case this short code is available as part of mimeeq-add-to-cart and mimeeq-show-summary events payload as property shortCode. To learn more about them, click here.

It can be also obtained by sharing URL from UI. In that case it will be part of generated URL.

It's one of short codes used to get data from our REST API.

AR short code​

Short code generated for each configuration used to access AR view. Similarly to Configuration short code it's unique for each page-productId-configurationCode combination.

As opposed to other short codes you may get one of these short codes only from URL generated after clicking View in your room. However, at this moment it's only use case is for displaying AR landing page.

Configuration Code Structure​

Configuration codes are string-based representations of product configurations that uniquely identify a specific variant of a product with all its selected options. These codes are used throughout the system for pricing, manufacturing, and order processing.

A complete configuration code follows this pattern: {productCode}={configurationCode}

For example: ALT-B-L=Width-a9&DesktopFinish-b5&FrameFinish-c3

Where:

  • ALT-B-L is the product code
  • Everything after the = is the configuration code containing all selected options

Block-Option Representation​

The configuration code consists of block-option pairs separated by & characters: {block1}-{letter1}{option1}&{block2}-{letter2}{option2}&...

Each block-option pair contains:

  • Block name/code (e.g., "Width", "DesktopFinish")
  • A hyphen delimiter -
  • A letter representing the option set (from letter mappings)
  • The ordinal number of the selected option within that option set

For example, DesktopFinish-b5 means:

  • "DesktopFinish" is the block name
  • "b" is the letter assigned to the option set in that block
  • "5" means the 5th option in that option set is selected

Multichoice Blocks​

For blocks that allow multiple selections (MULTICHOICE widget type), selected options are separated by the pipe character |:

BlockName-a1|a2|a3

This indicates that options 1, 2, and 3 from option set "a" are all selected.

Special Widget Encoding​

Special widgets like engraving, image upload, color picker, and input fields use specialized encoding methods to represent their complex data:

Engraving (ENGRAVE)​

Engraving codes encode text lines and formatting parameters:

BlockName-l0;Text_line_1|l1;Text_line_2|ff;FontFamily|fs;FontStyle|...

Components include:

  • l0;, l1;, etc.: Text lines with index
  • ff;: Font family
  • fs;: Font style
  • Other formatting parameters

Image Upload (IMAGE)​

Image upload codes encode the image and its positioning:

BlockName-s;1.5|i;image_path|uo;0.1|vo;0.2|...

Components include:

  • s;: Scale factor
  • i;: Image path/identifier
  • uo;, vo;: Positioning offsets
  • r;, rv;, ru;: Rotation angles

Color Picker (COLOR)​

Color codes encode the selected color:

BlockName-c;FFFFFF

Where:

  • c; indicates a color value
  • The following part is the hex color code without the # symbol

Input Fields (TEXT, NUMBER)​

Input field codes encode the user-entered value:

BlockName-t;User_entered_text

Where:

  • t; indicates a text value
  • The following part is the encoded text with special characters replaced

Print on demand codes encode image data and positioning:

BlockName-p;image_path|i0;fileId;imageId;width;height;top;left;...

Where the code combines:

  • Main image: p;image_path
  • Additional images with metadata: i0;fileId;imageId;width;height;top;left;...

Character Encoding​

Special characters are encoded to prevent conflicts with delimiters:

  • Spaces become _SP_
  • Hyphens - become underscores _
  • Many other special characters have specific encodings (e.g., ! becomes _EX_)

For example, the text "Hello, World!" would encode as: Hello_CM__SP_World_EX_

Empty Values​

When a block has no selection, it appears with an empty value: BlockName-

This preserves the block in the configuration code while indicating no option is selected.

Example: Complete Configuration Code​

Here's an example of a complete configuration code with various block types:

ALT-B-L=Width-a9&DesktopFinish-b5&FrameFinish-c3&EdgingType-a2&Depth-a1&
ContrastingEdgingFinishMFC-&ContrastingEdgingTypeMFC-&
ContrastingEdgingFinishNanotech-&ContrastingEdgingTypeNanotech-&
CableRiserType-a1&CableRiserCodes-a1&CableRiserFinish-a3&
CableTrayType-a1&CableTrayCodes-a1&CableTrayFinish-a3&
FlexibleContractReturnScreenType-a1&FlexibleContractReturnScreenCodes-a1&
FlexibleContractReturnScreenFinish-c1&
Engraving-l0;Hello_SP_World|ff;Arial|fs;italic&
CustomColor-c;FF5500&
CustomLogo-s;1.2|i;logo123.png|uo;0.1|vo;0.2

In this example:

  • Standard blocks use simple letter-ordinal pairs
  • Some blocks have no selections (empty values)
  • Engraving contains text with font specifications
  • Custom color uses a hex color code
  • Custom logo includes positioning and scaling information