Order modals
Overview
When an order is placed from a service the user is presented with a pop-up. If you want to customize the information presented to the user and/or change what options the user is presented with you can do so by creating your own custom modal.
Order modal info
| Attribute | Description |
|---|---|
| Current Language | Translatable content such as display fields will be translated to this language. The information will have to be added in each language |
| Name | Name of the order modal |
| Identifier | This is the order modal name, mainly used when you want to modify the field using JavaScript |
| Description | A descriptive text that is shown to the right in the order modal list |
| Title | The text shown in the title of the modal |
| Body | The text shown in the body of the modal |
| Show close icon | Show a cross icon in the top-right that closes the modal |
| Close modal when clicking outside | Close the modal when the user clicks outside the modal |
Note
If both checkboxes are unchecked the user will not be able to close the modal except by using the Escape key or through JavaScript in a button.
Using variables in the Title and Body
When creating an order modal, you can insert the value of variables as part of the text by using an @. If your service has a variable called "name" you can add "@name" in either the Title or Body for that word to be replaced by the value of that variable at the time of ordering.
Button editor
Create buttons that appear inside your modal that executes JavaScript when clicked.
| Attribute | Description |
|---|---|
| Name | Name of the button and the text shown to the user |
| Edit JavaScripts... | Opens a JavaScript editor that is executed when clicked |
| Duplicate | Creates a copy of the button |
| Delete | Removes the button |
JavaScript Editor
Write the JavaScript you want executed when the button is clicked. Regular JavaScript is supported and also some built-in functions you can call.
| Function | Description |
|---|---|
| closeModal() | Closes the modal |
| goToOrder() | Opens the order in the activity feed in a new tab |
| goToStore() | Returns the user to the homepage of the current store |
