Skip to main content

Parameters

Functional Parameters

Required parameters

  • client_id: This is a unique ID that links your Neo Beauty Studio experience to your product catalog in our CMS. You will receive this ID from us and should not modify it.
  • configuration_id: This refers to the CMS ID parameter, which plays a key role in personalizing your Neo Beauty Studio experience. You can locate the ID number within your CMS account under the section titled Applications -> Configurations.

Optional CMS parameters

  • product_id: This optional parameter can be used for iFrame to land on the certain product. You can locate the ID number of particular product within your CMS account
  • product_id_type: This optional parameter can be used to change the product id type. Possible types are id, sku, ean. Where id is default.
  • filter: This optional parameter can be used to filter your product catalog to display a subset of products in the virtual makeup experience. The FILTER-STRING should be a string that matches the filter requirements of our CMS API. If you do not wish to filter your products, you can omit this parameter.
  • locale: This optional parameter can be used to specify locale, for example, locale=fr
  • look_id: This optional parameter can be used if you want iFrame to land on the full look. You can locate the ID number of particular look within your CMS account
  • look_id_type: This optional parameter can be used to change the look id type. Possible types are id, sku, ean. Where id is default.
  • idle_timeout: An idle timeout for the application to reset to the landing page.
  • affiliate_code: An optional unique string code that will be passed back as a parameter through product outbound links (eg. ?affiliateCode='xxxx').

Integration parameters

  • mode: A string value indicating the integration style: either 'modal' (pop-over), 'inline' (PDP), or 'fullscreen'.
  • parent_element: The HTML DOM element inside which the experience will be created. This can be left blank for modal or fullscreen mode or if the parent_id is supplied.
  • parent_id: The ID of the parent HTML DOM element. This can be left blank for modal or fullscreen mode or if parent_element is supplied.
  • message_callback: To receive event messages from the Neo platform, provide a callback function, e.g.,
document.getElementById(/*<insert button id here enclosed in double quotes, eg. "myBtn">*/).onclick = () => { 
neo({
client_id: /*<insert your CMS client id here>*/,
configuration_id: /*<insert your CMS confuguration id here>*/,
message_callback: (msg) => {
/* message data here */
console.log(
`APP: Message event [${msg.message}].data = `,
msg.data
);
},
},
/* <"mode"> */
);
};

Styling Parameters

Borders and Close Button

  • border_color: A hex value that sets the external border color, e.g., '#000'
  • border_radius: Corner edge rounding radius, range 0-5px
  • border_width: Border width, range 0-12px
  • close_color: The close button color, e.g., '#FFF'
  • close_visible: Show or hide the close overlay button, true|false
  • background_color: An RGBA color value that sets the modal background, e.g., 'rgba(0,0,0,0.7)'
  • background_blur: The background modal blur, range 0-5px