In this discussion, we provide a free solution for businesses looking to transform their visitor management services.
This solution provides:
- A mobile compatible form (web page) with the ability to enter visitor details or scan QR codes provided to visitors in meeting invitations.
Assumptions:
- Your business has a registered instance with a valid license.
- An employee will sign into the web page for authentication purposes (e.g. reception staff).
- A Service Offer exists catering for 'Registration' under a 'Visitor Management' process.
Instructions:
- Download the ZIP file attached to this discussion. It contains code you can copy into a new web style and web page.
- After signing into eservicemanager as an Administrator, click on the left menu, then select Administration, Designer Toolbox, Web Styles, then click the Add button.
- Provide a name for your new web style, for example 'Visitor Registration', and ensure Public is checked.
- Click Save when you have entered all your web style details.
- Click Edit CSS to the right of the web style you just created. Open the downloaded file with the CSS extension and copy the contents into the provided editor, then click Save.
- Click on the left menu, then select Administration, Designer Toolbox, Web Pages, then click the Add button.
- Provide a name for your new web page, for example 'Visitor Registration', ensure Public and OOTB Includes are checked, and the Web Style is populated with the name you provided in step 3.
- Click Save when you have entered all your web page details.
- Click Edit Page to the right of the web page you just created. When the web page editor opens, click on the Import button on the toolbar. Open the downloaded file with the HTML extension and copy the contents into the provided editor.
- In the HTML code, find and replace the following 3 blocks of code marked X with valid ID numbers from your system:
Block 1 (QR Code Scan Event)
...$.ajax({url: "../../api/v1/postticket?token=" + localStorage.getItem("esm-token"),type: "POST",data: JSON.stringify({ "ref": 0, "cboPerson": result.data.ORGANISER_REF, "cboOrganisation": localStorage.getItem("esm-organisation-id"), "cboLocation": localStorage.getItem("esm-location-id"), "cboSource": 2, "cboServiceOffer": X, "cboServiceType": X, "txtQuantity": 1, "cboBusinessProcess": X, "clientTimezoneOffset": d.getTimezoneOffset(), "dateImpStart": new Date(result.data.EVENT_START_DATE_TIME + 'Z').toLocaleDateString('en-US'), "timeImpStart": new Date(result.data.EVENT_START_DATE_TIME + 'Z').toLocaleTimeString('en-US'), "dateImpEnd": new Date(result.data.EVENT_END_DATE_TIME + 'Z').toLocaleDateString('en-US'), "timeImpEnd": new Date(result.data.EVENT_END_DATE_TIME + 'Z').toLocaleTimeString('en-US'), "txtTitle": "Visitor Registration", "txtDescription": description, "cboAssignToSupportGroup": X, "cboTicketStatus": X,}...
Block 2 (Window Load Event)
...else{ $('#loginModal').modal('show'); localStorage.setItem("esm-organisation-id", X); localStorage.setItem("esm-location-id", X); }...
Block 3 (Register Button Event)
...$.ajax({url: "../../api/v1/postticket?token=" + localStorage.getItem("esm-token"),type: "POST",data: JSON.stringify({ "ref": 0, "cboPerson": $("#visitorHostId").val(), "cboOrganisation": localStorage.getItem("esm-organisation-id"), "cboLocation": localStorage.getItem("esm-location-id"), "cboSource": 2, "cboServiceOffer": X, "cboServiceType": X, "txtQuantity": 1, "cboBusinessProcess": X, "clientTimezoneOffset": d.getTimezoneOffset(), "dateImpStart": today, "timeImpStart": $("#timeStart").val(), "dateImpEnd": today, "timeImpEnd": $("#timeFinish").val(), "txtTitle": "Visitor Registration", "txtDescription": description, "cboAssignToSupportGroup": X, "cboTicketStatus": X,}... - Click the Import button when you're ready. The web page should populate and display the pre-coded form. Click the Save button on the toolbar.
- Back in the Web Pages tab, click on the Share button against the new web page you just created. This will provide a unique URL to the web page. Try opening the link into a new browser window. Take note of the page name that is allocated to use later on.
https://www.eservicemanager.com.au/saas/page/mybusiness/pagename
mybusiness=your division name
pagename=your web page name - It is recommended you create a workflow for the Service Offer you specify in your code to perform tasks such as sending a push notification or email to the host. We'll leave it up to your imagination.
Your visitor registration form is ready to go!