Props

You can use properties in lm-ugv-widget to customize it further.

Example

<lm-ugv-widget
        sdk-token="yourTokenHere"
        widget-title="Become a reviewer for Our&nbsp;Company!"
        input-email-label="E-mail"
        use-bubble="left"
        custom-input-checkboxes="{ 'agree_tos': {label: `Accept <a href='#'>Terms & Conditions </a> of Our&nbsp;Company`, required: true}, 'agree_rodo': {label: `Accept Image Rights T&C of Live.Market`, required: true}, 'agree_copyright': {label: `I have full rights to this content`, required: true} }"
></lm-ugv-widget>

Available props

Prop Description Default
sdk-token Insert your SDK token here to use it for API requests. ""
widget-title Title in widget header. ""
input-email-label Label for email input. "Adres e-mail"
input-first-name-label Label for first_name input. "ImiÄ™"
input-last-name-label Label for last_name input. "Nazwisko"
input-social-links-label Label for social_links input "Twój profil social media"
input-files-label Label for short_video file input (as header above dropzone) "Wgraj poniżej swoje filmy"
custom-input-checkboxes Adds new checkboxes and edits the default ones.
See the Custom checkboxes section for more info.		 {}
use-bubble Whether the widget should be hidden in a bubble with position: fixed.
Providing the property without a value sets it on the bottom right by default, but it can be set to "left".
Omitting it will display the widget as a position: static element.		 false
lm-branding-color Whether the LiveMarket logo should be in LiveMarket colors.
Omit to instead use widget content text color.		 false
input-files-no-files Error message if no videos were provided. "Wgraj co najmniej jeden film!"
form-error-msg Error message for errors during the POST request. "Wystąpił błąd."

More information

Custom checkboxes

The custom-input-checkboxes prop allows for adding new checkboxes, editing the default ones, or removing them entirely.

It accepts valid JS objects (as string) with the necessary data.

Example custom checkbox template

{ 'field_name': { label: 'field_label', 'required': true } }

A field is considered required if the field_name.required value is truthy and not "false".

Adding a new checkbox

<lm-ugv-widget
    custom-input-checkboxes="{ 'custom_check': { 'label': 'custom checkbox', required: false }  }"
></lm-ugv-widget>

Default checkboxes

const defaultCheckboxes = {
    agree_tos: {
        label: 'Zaakceptuj <a href="">Regulamin</a> Inglot Sp. z o. o.',
        required: true,
    },
    agree_rodo: {
        label: "Zgoda na przetwarzanie wizerunku przez Live.Market",
        required: true,
    },
    agree_copyright: {
        label: "Zaświadczam, że posiadam pełne prawa do tych treści.",
        required: true,
    }
};

Editing default checkboxes

Providing an existing field name in field_name will override it.

You can change both the label and the required properties.

<lm-ugv-widget
    custom-input-checkboxes="{ 'agree_tos': { 'label': 'custom label here', required: false }  }"
></lm-ugv-widget>

To remove a checkbox entirely, change its label to an empty string:

<lm-ugv-widget
    custom-input-checkboxes="{ 'agree_copyright': { 'label': '' }  }"
></lm-ugv-widget>