Zebra Sticker Printers

Owned by Former user (Deleted)
Last updated: Nov 27, 2020 by Former user (Deleted)
4 min read

This article will walk you through how you can set up zebra label printers such as the Zebra GK420t in both chrome and firefox. 

Creating the Template 

To use sticker printers you first need to create a new template to be used with the messaging. Start by going to the Templates & Design page under System Config. 

This will take you to the Layouts List page where you want to click the Create Layout button to create a new layout. This will bring up the Add Layout model window. 

Name the layout whatever makes sense for you, in this case I will be naming mine layout Zebra Printing. Click Save Changes when you are finished. 

Providing the Sections

Click Toggle Templates to bring up a list of the available sections we can create. For this template we only care about creating the Styles and Scripts sections. 

Copy the styling and scripts found below into each of the sections for the languages you wish to support. 

Styles Section 
<style>
  @media print {
  	@page {
      size: 2.25in 1.25in;  		
  	}
    .sticker-4-1 {
      border: 0px none !important;
    }
  }
  @media screen {
    .sticker-4-1 {
      margin: 100px auto 0px;      
    }
  }
  .sticker-4-1 {
    width: 2.25in; 
    height: 1.22in; 
    border: solid 1px red;
    box-sizing: border-box; 
    padding: 0.15in 0.1in 0.05in; 
    text-align: center; 
    line-height: 1.4;
  }
</style>

Script Section 
<script>
  window.onload = function() {
    window.print();
  };
  window.onafterprint = function() {
    history.back(-1);
  }
</script>

Creating the System Messaging

Next we will need to create the system message that uses our new layout. 

From the Manage System Messaging page click the Create Page/Message button

Complete the fields with the data shown below.

Page Type - This should be message. 

Title - This can be anything you would like and will be the text button that will be displayed when you go to print the permit. 

Identifier - This must start with permitPrintable____ and can include any text after depending on how many printable messages you would like. For example you could have one for the Zebra printer and one for printing on the web. 

Language - This can be whatever language you support in your system. 

Layout - This must be the layout we created previously.

Next we need to include the shortcodes that will be used to display the actual permit information displayed on the sticker. To do this hover over the content box followed by Tools and click Source Code. 

Add the following text to the source code section of your message followed by Save when you are finished. 

System Message Source Code 
<div class="sticker-4-1"><span style="font-size: 14pt;"><strong>[permitpdf user=usertype]</strong></span><br /><span style="font-size: 24pt;"><strong>[permitpdf permit=permitno]</strong></span><br /><span style="font-size: 12pt;">Exp. [permitpdf permit=expiry]</span></div>

Setup the Printer Drivers

This guide will show you how to set up the printer drivers on your machine. We will be showing you how this can be done on Windows machines. Start by going into the Windows Settings followed by Devices

Click Printers & Scanners as well as the printer you wish to manage followed by the Manage button. 

Select the Printer Properties and click the Stocks tab. From there you want to click the New... button to create a new stock to use for printing. 

Next we want to select the Printing Preferences followed by the new stock we just created.

Setup the Browser Print Settings

Before adjusting the browsers print settings we need to go into the layout template of system message and comment out the Scripts section so that the sticker is not automatically printed which will allow us to adjust these settings ourselves. 

Chrome

To make sure that the sticker prints properly on the chrome browser we need to adjust some of the printer properties. Below you can see some of the default properties that will cause problems when trying to print with your device. 

Make sure that you change these settings to match the image seen below 

Firefox

To make sure the sticker prints properly on the Firefox browser we need to go into the print settings from Firefox and adjust some of the properties. To do this click the hamburger followed by Print.

Next you should see some of the default settings used to print in Firefox as seen below. 

We want to adjust the fields so that they match all fields shown in the image below.

You should now be able to begin printing your new labels from the admin side.

Where to Print Permits

Printing permits from the admin side can now be done from the Parking Permit Information page by clicking the green print buttons next to the Update Permit button. 

Related Pages