Applies to app version 2026.02 onwards
Customise visitor passes per building for your organisation. In Setup, you can set up or change the template that is later used by operational users in Operations to print a visitor pass.
Note: Visitor passes are not security credentials. They are convenience passes designed to streamline check‑in and optionally provide temporary QR‑based entry.
Step 1 – Grant permission for Operations users to use Print Pass functionality
To allow Operations users to use the Print Pass function on the Visitors > Summary page, role-level permissions have to be modified in the Monza Platform.
The required permission is ONELENS360.OperationalServices.VisitorPass.
⚠️ While the product name and pages names have changed, we're still working to rename associated permissions.
Step 2 – Get the HTML file for the pass
Prepare an HTML file with a visitor pass template. You can create your own file or use our suggestion.
- Option 1. Open and save our suggestion as an HTML file and give it strictly the name badge.html: 💾 badge file
- Option 2. Or copy it from our code sample:
<!DOCTYPE html>
<html lang="en">
<head>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 10;
background: none;
}
.visitor-pass {
margin: 0px;
padding: 20px;
border: 1px solid #000;
border-radius: 10px;
height: auto;
width: auto;
}
.visitor-pass-title {
margin-bottom: 20px;
background-color: #CC9617;
}
.visitor-pass-info {
font-size: 14px;
}
.visitor-pass-field {
padding-top: 15px;
}
.visitor-pass-label {
font-weight: bold;
line-height: 1;
}
/* Define print styles */
@media print {
@page {
_size: 105mm 58mm;
/* A7 landscape */
/* size: 74mm 52mm; /* A8 landscape */
margin: 1mm;
/* Adjust the margin as needed */
}
.visitor-pass-title {
color: #FFFFFF;
background-color: #000000;
}
_div {
break-inside: avoid;
}
.pageBreak {
page-break-after: always;
}
}
</style>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Visitor Pass</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="visitor-pass">
<h1 class="visitor-pass-title">Visitor Pass</h1>
<div id="visit-logo">c/Badge/Client.png</div>
<div class="visitor-pass-info">
<div class="visitor-pass-field">
<span class="visitor-pass-label">Name:</span>
<span class="value" id="visitor-name">John Doe</span>
</div>
<div class="visitor-pass-field">
<span class="visitor-pass-label">Company:</span>
<span class="value" id="visitor-company">ABC Ltd.</span>
</div>
<div class="visitor-pass-field">
<span class="visitor-pass-label">Date:</span>
<span class="value" id="visit-date">2023-10-09</span>
</div>
<div class="visitor-pass-field">
<span class="visitor-pass-label">Time:</span>
<span class="value" id="visit-time">10:30 - 12:30</span>
</div>
<div class="visitor-pass-field">
<span class="visitor-pass-label">Host:</span>
<span class="value" id="visit-host">Tony Smith</span>
</div>
</div>
</div>
<div class="pageBreak">
</div>
</body></html>⚠️ Important things to note:
- Style your passes within the style tag according to your corporate guidelines or as you wish them to look like. You can also add your style sheet separately. Remember to have unique class names for a visitor pass not to be later overridden by other styling in Operations.
In the example above, we use this prefix for classes: visitor-pass- - Keep the file name strictly as badge.html, including the lower case for the whole name.
- Use the logo image as embedded or referenced style.
- Make sure that the page break (<div class="pageBreak"></div>) is at the very bottom of your HTML code. This is essential for printing several passes in one go.
- Pay attention on how you change the following part as it changes how printer will print out the pass:
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Visitor Pass</title>
<link rel="stylesheet" href="styles.css">Step 3 – Add the HTML file to the IBSS system
Now, the prepared badge HTML file needs to be added to the system for your organisation to use:
- In Setup > File Management > Common, click + Add on the top right.
- Click Select File and locate your HTML file with the visitor pass template and correct file name to add it to the system.
- Indicate the following path for the file to be properly fetched: c/Badge/{building-id}/badge.html
For example: c/Badge/55/badge.html
⚠️ Other file path or name will not work for printing visitor passes. Keep the defined naming. - Click OK.
Next, remember to upload the file with the logo image that you want your passes to fetch. Upload the logo file to the same Badge folder if you are using a referenced image for your logo. Use the same steps to upload it as for the badge HTML template.
Now, operational users of your organisation can print visitor passes with per building templates. In our example it will look like this from the Operations app:
