Skip to main content
How to use Badge Editior
Updated this week

SIE allows you to build custom badge templates in your account that can be printed automatically for your visitors after they sign-in. The badge editor allows you to add elements specific to each visitor (eg. name, host, photo, etc.) alongside aesthetic flourishes (through HTML) such as logos, banners, and borders.

The sections below include:


Related Content



Creating a New Badge Template

The Badge section is accessed through the badge icon in the left navigation bar. Then, click Create badge in the top-right corner to start from scratch.

Badges-1.png



WYSIWYG Editor

You will be brought to the WYSIWYG (What You See Is What You Get) editor with a default template. You can click into the editor to add or remove certain elements.

Additionally, you can click on the icons within the top-tool bar to control settings such as alignment, font-size, and the additions of guest photos and company logos.

Note: If you'd prefer to use the HTML Editor, click the Switch to HTML Editor button in the bottom-left corner. This allows you to copy and paste pre-made templates and edit the badge template more precisely. See THIS section below for more details.

Badges - WYSIWYG.png



HTML Editor

Badges can be edited directly through HTML code, rather than through the WYSIWYG editor. This allows for more precise control when designing your badge template.

To access it, simply click the Switch to HTML Editor button in the bottom-left corner of the badge editor. You can switch back to the WYSIWYG editor by clicking the same button.

We have created some badge templates that you can download and input into your SIE account via HTML. Check out our knowledge article HERE to learn more and access the HTML snippets.


Badges - Edit Window.png





Badge Tokens

Badge tokens allow you to populate the badge with details collected from a visitor's sign-in. For example, you can add a visitor's full name by having #firstname# and #lastname# added in your template (including the # signs on both ends).

A list of tokens is visible at the bottom of the editor, and includes the below fields. These tokens need to be entered exactly as indicated (case sensitive) for SIE to recognize the field you're looking to pull from:

  • #firstname#

  • #lastname#

  • #company#

  • #email#

  • #hosts#

  • #date#

  • #time#

Badges - Tokens.png




Badge Preview and Date/Time Settings

A Badge Preview button can be accessed in the top-right corner of the editor to display how the badge will look when printed.

Badges - Badge Preview 1.png

The Preview tab shows an approximation of your badge with example visitor names filling your tokens. To change the example names displayed on the badge, click the Tokens tab and enter your sample fields. You can then click back into the Preview tab to see your new examples.

Preview Badge Exampe.png




The Settings tab controls the Date and Time format displayed on your badge.

By default, the date format is set as MM/DD/YYYY. Simply type the day, month, and year format that you'd prefer (eg. DD-MM-YY or MM/DD)

The default time format is set as HH:mm which translates into 24-hour time (eg. 13:00).
If you prefer AM/PM (eg. 01:00 pm), change the time format to hh:mm a

You can click back into the Preview tab to see your example formats in your badge's date/time token fields.


2023-08-02_14-34-15.png




After you've created a few badge templates, you can choose where they are used per location or sign-in flow. For more information on assigning badge templates, check out our knowledge article HERE.

Below are example templates that we've used in the past. You can download the HTML snippet of these badges and more through our Badge Template menu HERE.



Did this answer your question?