All Collections
Printing
How to customize templates
How to customize templates

Create custom packing slips, invoices, purchase orders, and email templates using HTML and variables

Updated over a week ago

Before you get started, we're here for you!

Template customization is hard and requires knowledge of coding HTML. For questions and direct assistance do not hesitate to contact us or send an in-app chat with the name of the template you want to customize, the store(s), and the fields you wish to have on it.
​

Editing store templates

1. From the Settings page, click on the name or edit icon for a store
​

2. Click on the Templates panel

3. Select the template you wish to customize.

4. In the screen that appears, click the "Code view" button on the editor's toolbar.

From here, edit the HTML code as needed or use our custom template variables by adding them to the very bottom of the template (underneath "</div>.")

Repeat this process for each store's templates you want to apply the same changes to.

Replacement Variables

Pick lists

  • NAME_TARGET

  • SKU_TARGET

  • BARCODE_TARGET

  • LOCATION_TARGET

  • QUANTITY_TARGET: Prints ordered quantity.

  • UNSHIPPED_QUANTITY_TARGET: Prints unfulfilled quantity by excluding shipped quantity

  • UNVERIFIED_QUANTITY_TARGET: Prints unverified quantity by excluding verified quantity

  • QUANTITY_BREAKDOWN_TARGET: Includes a column that breaks down quantity per order. Use INCLUDE_ORDER_NUMBER_WITH_BIN_NUMBER to print order number with breakdown quantity.

  • LANDSCAPE: Prints in Landscape orientation

  • SORT_BY_CUSTOMIZATION_METADATA: Sort by line-items customization metadata

Individual pick lists

  • NAME_TARGET

  • SKU_TARGET

  • LOCATION_TARGET

  • QUANTITY_TARGET

  • NAME_AND_SKU_TARGET: Combined name and SKU

  • INCLUDE_ON_HAND: Includes on hand count per location

  • LETTER_SIZE: Formats the template for printing on 8.5"x11" size paper.

  • LANDSCAPE: Prints in Landscape orientation

Packing Slips

  • ORDER_ITEMS_WITH_SKUS: Modifies the default item list to include each item's SKU.

  • ORDER_ITEMS_WITH_BARCODES: Generates a table that includes each item's name, SKU and ordered quantity. If orders are picked using barcode verification, the table will also include the quantity of each item that was verified and/or shipped.

  • ORDER_ITEMS_WITH_BARCODES_AND_LOCATIONS: Generates a table similar to the above but with the addition of the picking locations each item is available in.

  • ORDER_LISTINGS_WITH_BARCODES: Generates a table that includes each listing's name and SKU in the order. In addition, it includes name, SKU and ordered quantity breakdown of each item linked to the listing.

  • ITEMS_WITH_KITS: Prints kit's name, SKU and ordered quantity. It also provides the option to include itemized breakdown of the kit using ITEMIZE_KITS.

  • SHIPMENTS_TABLE: Includes a breakdown of shipments and the items included in each shipment.

  • PER_SHIPMENT_PACKING_SLIPS: Automatically prints the current shipments items on a 4x6 label size page when "Auto-print combined docs" is enabled in your profile settings.

  • SORT_BY_NAME: Lists items ordered by listing name.

  • SORT_BY_SKU: Lists items ordered by listing SKU.

  • SORT_BY_CUSTOMIZATION_METADATA: Sort by line-items customization metadata

  • SORT_BY_LINE_ITEM_SORT_STRING: (BigCommerce only) Relies on a custom line-item sorting string being imported from your sales channel.

  • EXCLUDE_ITEMS_DROPSHIPPED_VIA_CHANNEL: Excludes externally dropshipped items from packing slips.

  • EXCLUDE_ITEMS_DROPSHIPPED_VIA_SKULABS: Excludes items dropshipped via SKULabs

  • ORDER_WEIGHT: Order's total weight

  • TAGS: Includes order tags.

    • To configure only specific tags to appear, you can add the following to the top of your template and fill in the values for the tag_name="example tag name":

<style>
.tag {
display: none;
}
span.tag[data-tag_name="example tag name 1"] {
display: block;
}
span.tag[data-tag_name="example tag name 2"] {
display: block;
}
</style>
  • NOTES: Include notes provided by the customer when placing their order on your store

  • CHANNEL_INTERNAL_NOTES: Include internal staff notes imported from the sales channel.

  • SKULABS_CUSTOMER_FACING_NOTES: Include notes added to the order from within SKULabs as customer facing notes.
    ​

  • BOXES: Includes needed HTML tags anywhere you plave this variable. If you prefer to use your on HTML skills, here is what is needed:

                         <span class="boxes"></span>

  • INCLUDE_BARCODE_COLUMN: Includes the dimensions of the memorized shipment box(es) (when available) or dimensions of the box used to ship the order.

  • INCLUDE_IMAGE_COLUMN: Adds a column with each item's or kit's image.

  • INCLUDE_LOCATION_COLUMN: Includes the location name the item is found in.

  • INCLUDE_SERIALS: Adds any scanned serial numbers to the items table.

  • INCLUDE_TOTALS: Includes a column for the total price of an item.

  • INCLUDE_STICKY_FOOTER: To Include footers on packing slips:

    • Include INCLUDE_STICKY_FOOTER this flag

    • Assign the class "order-info-container" to the element that contains the order information and appears at the top of a packing slip.

    • Assign the class "sticky-footer-content" to the container element that includes the content you want to print as a footer.

  • HIDE_SKU_COLUMN: Hides SKUs of items.

  • EXCLUDE_METADATA: Excludes line-items customization metadata.

  • EXCLUDE_IMAGES: Hides product images from lists or tables that include them

  • EXCLUDE_BLANKS: Excludes items that have been shipped.

  • 4x6_SIZE: Formats the template for printing on 4x6 size thermal label paper.

  • A4_SIZE: Formats the template for printing on A4 size paper.

  • LANDSCAPE: Prints in Landscape orientation

  • STORE_LOGO: Includes the logo of the order's store.

  • STORE_ADDRESS: Includes store origin address.

  • CUSTOMER_ADDRESS: Includes shipping address.

  • BILLING_ADDRESS: Includes billing address.

  • ORDER_NUMBER: Includes the orders number.

  • ORDER_BARCODE: Includes barcode of order number

  • ORDER_DATE: Includes the date the order was created.

  • SHIP_DATE: Includes the date of the last shipment. Defaults current date if a shipment does not exist on the order yet.

  • SHIP_METHOD: Includes the shipping method.

  • BATCH_NUMBER: Include the Batch number the order is a part of.

  • BIN_NUMBER: Include the Bin number the order was picked to during batch fulfillment.

  • BATCH_INFO: Includes formatted version of Batch Number and Bin number.

  • PICKER_NAME: Includes the name of the user who printed the packing slip.

  • CLEARED_MESSAGE: Includes a cleared message of "Order packed with 100% accuracy by PICKER_NAME".

  • PRINT_EXTRA_COPY: Prints 2 copies of the packing slip.

  • PRINT_COLLATED_INVOICE: Prints a collated invoice in addition to a packing slip.

Integrated packing slip labels

To include integrated labels on packing slips:

  • Assign the class "order-info-container" to the element that contains the order information and that appears at the top of a packing slip.

  • Add INCLUDE_INTEGRATED_LABEL to your template

The recommended integrated label form that works out-of-the-box is the 8-1/2 X 11" LASER SHEET WITH 1 INTEGRATED LABEL ON THE BOTTOM LABEL SIZE: 3-1/2" X 2

Invoices

  • ORDER_ITEMS_WITH_SKUS: Includes item name and SKU.

  • ORDER_ITEMS_WITH_BARCODES: Generates a table that includes each item's Image, Name, SKU, ordered quantity, and price.

  • ORDER_ITEMS_WITH_BARCODES_AND_LOCATIONS: Generates a table similar to ORDER_ITEMS_WITH_BARCODES but with the addition of the picking locations each item is available in.

  • ORDER_LISTINGS

  • ORDER_WEIGHT: Order's total weight

  • NOTES: Notes provided by customer when placing an order

  • CHANNEL_INTERNAL_NOTES: Internal staff notes imported from the sale channel

  • SKULABS_CUSTOMER_FACING_NOTES: Notes added in SKULabs as customer facing notes

  • EXCLUDE_BLANKS: Removes items that have been fully shipped or no remaining unfulfilled quantity.

  • KIT_WITH_RATE: Generates a table that includes of order line-items and their prices.

  • INCLUDE_TOTAL: Includes a column for the total price of an item.

  • INCLUDE_IMAGE: Adds a column with each item's or kit's image.

  • EXCLUDE_IMAGE: Removes item images.

  • EXCLUDE_LISTING_INFO: Generates a table for the items in the order excluding listing information.

  • SORT_BY_NAME: Sorts by listing name.

  • SORT_BY_SKU: Sorts by listing SKU.

  • SORT_BY_CUSTOMIZATION_METADATA: Sort by line-items customization metadata

  • A4_SIZE: Formats the template for printing on A4 size thermal label paper.

  • LANDSCAPE: Prints in Landscape orientation

  • TAGS: To add tags to invoices add the snip code below where you like to see your tags. To configure only specific tags to appear, you can add the same CSS style tag as the Packing slips template example.

<div> <span class="tags"></span> </div>

Commercial Invoices

  • TOTAL_QUANTITY: Total count of items

  • TOTAL_WEIGHT: Total weight of items

  • PRINT_EXTRA_COPY: Prints 2 copies of the commercial invoice.

  • PRINT_THREE_COPIES: Prints 3 copies of the commercial invoice.

  • 4x6_SIZE: Formats the template for printing on 4x6 size thermal label paper.

  • A4_SIZE: Formats the template for printing on A4 size thermal label paper.

Purchase Orders

  • SHOW_MPN_COLUMN: Adds a column with each item's distributor-specific part number to the PO item table. Optionally, you can use SHOW_MPN_COLUMN with INCLUDE_MPN_BARCODE_IMAGE to print barcoded image and text of barcode.

  • SHOW_UNIT_COLUMN: Adds a column with each item's ordering unit to the PO item table.

  • INCLUDE_IMAGE_COLUMN: Adds a column with each item's or kit's image.

  • SHOW_SKU_COLUMN: Adds the SKULabs SKU column.

  • SHOW_BARCODE_COLUMN: Includes the barcode value for each product included on the PO. Optionally, you can use SHOW_BARCODE_COLUMN with INCLUDE_ITEM_BARCODE_IMAGE to print barcoded image and text of barcode.

  • HIDE_RATE_COLUMN: Hide item rate

  • HIDE_AMOUNT_COLUMN: Hide amount column

  • A4_SIZE: Formats the template for printing on A4 size thermal label paper.

  • LANDSCAPE: Prints in Landscape orientation

  • To include your store's logo on a PO, use this code:

<div style="margin-bottom: 10px;" id="logo_target"></div>

Transfer Orders

  • EXCLUDE_IMAGE: Removes item images.

  • SORT_ITEMS_BY_NAME: Lists items ordered by name.

  • SORT_ITEMS_BY_SKU: Lists items ordered by SKU.

  • SORT_ITEMS_BY_SOURCE_LOCATION: Lists items ordered by source location name.

  • SORT_ITEMS_BY_DESTINATION_LOCATION: Lists items ordered by destination location name.



Email


Purchase order email subject

  • STORE

  • PO_NUMBER

  • TOTAL

Purchase order email body

  • PORTAL_LINK

  • SUPPLIER_NAME

  • SENDER_NAME

  • PO_NUMBER

  • TOTAL

  • STORE

  • PO_LINK

  • CONFIRM_RECEIPT_LINK

  • SEND_TRACKING_LINK

  • INCLUDE_DROPSHIPMENT_PACKING_SLIP: Includes a PDF attachment of a packing slip that contains dropshipped items in the Purchase Order email sent to the supplier.

Shipped and partially shipped email subject

  • ORDER_NUMBER

Shipped and partially shipped email body

  • ORDER_NUMBER

  • ORDER_DATE

  • STORE_NAME

  • STORE_LOGO

  • CUSTOMER_FIRST_NAME

  • CUSTOMER_NAME

  • CUSTOMER_ADDRESS

  • CUSTOMER_PHONE

  • CUSTOMER_EMAIL

  • CARRIER

  • METHOD

  • TRACKING_CODE

  • TRACKING_URL

  • INCLUDE_ITEMS_IN_LAST_SHIPMENT: Includes a list of items in the most recent shipment of an order.

  • INCLUDE_SERIALS: Adds any scanned serial numbers to the items table.

  • SHIPMENTS_TABLE: Includes a breakdown of shipments and the items included in each shipment.

  • SHIPMENTS_TABLE_WITHOUT_ITEMS: Includes a list of shipments only

  • USE_LISTING_NAMES: Replaces the item names with the ordered listing names on the items table.

Did this answer your question?