Adding an Order Number Barcode to your native Shopify Packing slips
Adding a barcode to your Shopify Packing slips will make it much faster to search for an order within iPacky.
First you need to upload the Barcode CSS file to your Shop, then edit the packing slip template, test it, and you are ready to go!
Upload the Barcode font
1. Please download the file below, this is a CSS file that has the barcode font embedded. The embedded barcode font is represented as an SVG within the CSS file.
2. Next, upload the CSS file to your Shopify store “Content” area.
3. Once it has been uploaded, click 🔗 (Copy link) to copy the URL of the CSS file.
Adjust the packing slip code
1. Go to your Shopify settings
2. Select “Shipping and delivery”
3. Scroll down to “Packing slip template”
4. Click “Edit”, this is where you can edit the code used to generate your packing slips.
5. At the very top of the packing slip, press enter (or return) to make a gap to add your own code.
6. Now paste your copied Font URL of the CSS to the top of the document.
7. Add the code below as well.
Make sure to replace the section `{Replace with your Font URL}` with the Font URL you pasted already, and then remove the URL from the top of the document.
8. Move down the document and add the code below just after `<div class=”order-title”>` .
Please note that the asterisks (*) are important to make sure that the barcode can be scanned.
Check the packing slip
Now you can click the “Preview template” button to check that the barcode has generated correctly.
We advise using your barcode scanner to check that the barcode scans and returns the expected order number.
If you have any issues please re-check the steps above, making sure the code is correct.
Once you have confirmed that the barcode is working well you are ready to save the template.
Now head back to your Shopify orders and you can print off your Packing slips, then scan the barcode within iPacky to find the order quickly!