...
| Code Block | ||
|---|---|---|
| ||
<script
class="wizart__floating-button"
data-title="Custom button title"
data-token="token"
data-vendor_code=""
data-article_query=""
data-parameters=""
data-background=""
data-color=""
data-image=""
data-tooltip_title=""
data-tooltip_position=""
data-tooltip_disable=""
data-glitter_disable=""
data-width=""
data-height=""
data-border=""
data-border_radius=""
data-class_name=""
data-compact=""
data-tutorial=""
data-tutorial-delay=""
data-on-button-click=""
data-element-selector=""
data-insert-element-position=""
data-iframe-element-selector=""
data-insert-iframe-element-position=""
src="https://wizart-files.fra1.cdn.digitaloceanspaces.com/production/integration/floating-button.min.js"
></script> |
Parameter | Description | Type |
|---|---|---|
class | Required parameter. | required |
src | Link to js-file with integration code. | required |
data-token | api token - generated and issued by Wizart Administrator. | required |
data-title | Text to be displayed on the button (the default value is "Try it in your room in one click!"). | optional |
data-vendor_code | Unique SKU ID of the product uploaded to Wizart system. | optional |
data-article_query | Required in the case if parameter data-vendor_code is not enough for product search in the Wizart system. Parameter value should be a result of the function | optional |
data-background | Button background | optional |
data-color | Button text color | optional |
data-tooltip_disable | If the value is “true”, the tooltip will not be displayed. | optional |
data-tooltip_title | Text to be displayed on the tooltip (the default value is "See it in your room!"). | optional |
data-tooltip_position | Tooltip position towards the button. Available values are top, right, bottom, left (the default value is top) | optional |
data-glitter_disable | If the value is true, glitter will not be displayed | optional |
data-width | Max button width | optional |
data-height | Button height | optional |
data-border | Button border | optional |
data-border_radius | Button border-radius | optional |
data-image | Link to the icon that will be displayed on the button. | optional |
data-class_name | Class to be set for the button element on the page | optional |
data-compact | If the value is true, button will be displayed in the compact mode | optional |
data-tutorial | If the value is true and data-compact is true, button will animate from compact to full and back to compact. Animation fires once. | optional |
data-tutorial-delay | The number of seconds before animation. Available 5,10,20,30. | optional |
data-parameters | Parameter value should be a result of the function | optional |
data-onload-callback | The name of the function to be in the global scope. The function will be called when the visualizer is loaded. | Optional |
data-on-close-callback | The name of the function to be in the global scope. The function will be called after the visualizer is closed. | Optional |
data-element-selector | A CSS selector to select an element on the page to insert a button where you want. | Optional |
data-insert-element-position | The insertion position of the element. Values: append, before, after. default value: append. | Optional |
data-iframe-element-selector | A CSS selector to select an element on the page to insert the fitting room where you want. | Optional |
data-insert-iframe-element-position | The insertion position of the element. Values: append, before, after. default value: append. | Optional |
...