Shopify Order Printer Pro Quote Design A - Set up Guide

This guide will provide you with all the steps required to add your new Shopify Order Printer Pro Quote template to your Shopify site. If you have not yet purchased the quote template, you can do so by clicking here.

To complete this set up process you will need to have an image for your business logo and have downloaded the template code, which will have been emailed to you following your purchase (shopify_order_printer_pro_quote_design_a.txt).

 

Step 1 - Log into Shopify

Ensure you are logged into the Shopify Admin area

 

Step 2 - Install the Shopify Order Printer Pro App

If you do not already have the Order Printer Pro app installed on your store, head over to https://orderprinterpro.com/appstore?ref=artisan-it-ltd and install/add the application.

 

Step 3 - Upload your business logo to Shopify

  1. Within the Shopify Admin area, click on Settings in the bottom left-hand corner of the screen
  2. Select Files from the left-hand menu
  3. If you do not already have a logo image uploaded, click Upload Files and upload your business logo image (for best results, ensure the logo is cropped, so whitespace around the image is removed)
  4. Within the file table, click the link icon to the right of the logo and copy the image URL
    File Upload Image for Shopify
  5. Paste the link copied in part D somewhere that can be easily accessed later on in the process

Examples of where you could paste the links are Notepad or Word applications. It does not matter what you choose, as the links only need to be held temporarily, whilst you set up this template

 

Step 4 - Add the new template code

  1. Open the Order Printer Pro app from within the Apps menu (left-hand menu within the Shopify admin area)
  2. Click Manage Templates
  3. Click Create Template
  4. Select the Blank template option
  5. Enter a name for your quote template in the Name field
  6. In the Pre-selected for section, select Draft orders
  7. Make a note of the template number in the Code section on line 1 (example: template-478505)
  8. Open the downloaded shopify_order_printer_pro_quote_design_a.txt file
  9. Highlight and copy the code for your new invoice template beneath the dashed line
  10. Paste the copied code into the Code section of the Order Printer Template Details in Shopify on line 1

 Screenshot of code being added to the Shopify Order Printer Pro invoice template

 

Step 5 - Update the template number

On line 7 {% assign templ-number = "UPDATE TEMPLATE NUMBER HERE" %}, replace UPDATE TEMPLATE NUMBER HERE with the template number noted in Step 4 Part 7 (do not delete the speech marks)

 

Step 6 - Add your business logo to the new template

  1. On line 8 {% assign logo-url = "PASTE LOGO URL HERE" %}, replace PASTE LOGO URL HERE with the image URL that was copied in Step 3 Part 4 (do not delete the speech marks)
  2. Adjust the logo width and height values on lines 9 and 10
  3. If you wish to display the logo on the left hand side, on line 11 change {% assign logo-position = "right" %} to {% assign logo-position = "left" %}

 

Step 7 - Add a prefix to the quote number (if applicable)

If you would like to add a prefix for the quote number enter a value in between the speech marks on line 13

For example {% assign quote-prefix = "ART21A-QT" %} will display a quote number of ART21A-QT10 for Draft order 10 in Shopify.

 

Step 8 - Set the quote expiration (in days)

To edit the quote expiration period, on line 14 edit adjust the default value of 30 to the number of days the quote is valid for.

For example, to make a quote valid for 90 days, line 14 would look like this {% assign expiry-days = 90 %}

 

Step 9 - Change the horizontal line colour (if applicable)

If you wish to change the colour of the invoice horizontal lines, change the hexadecimal colour value on line 15 (do not delete the speech marks)

 

Step 10 - Change the footer text

Edit the text within the speech marks for lines 16 - 19

If you wish to leave a line blank, remove the text leaving only the speech marks, for example:

{% assign footer-line-one = "" %}

 

Step 11 - Save the template

Click the Save button

 

Printing the documents

  1. Click Orders within the left hand menu of Shopify Admin
  2. Click Drafts
  3. Select all of the draft orders that you would like to print documents for
  4. Click the ... ellipses button
  5. Click Print with Order Printer Pro
  6. Select the document templates you would like to print for each order (if applicable)
  7. Click Print
  • To save the documents as a PDF, change the print destination to the relevant PDF setting
  • If the colours are not correct on the printout, on Google Chrome, click More Settings and within Options ensure Background graphics is checked
  • If you wish to remove the webpage header and footer generated by the browser, within Options uncheck Headers and footers

 

Creating a downloadable quote link within Shopify automated confirmation emails (optional)

  1. Within the Apps menu, click on Order Printer Pro and then Automated PDFs
  2. Select the template that you would like to create a link for
  3. Click Setup PDF link
  4. Set the PDF paper size to A4
  5. Select the Draft Order Invoice Email notification
  6. Update the text displayed to the email recipient in the Text for the PDF link field (if applicable - i.e. Download PDF Quote
  7. Click Next step
  8. Copy the generated code
  9. Follow the on screen instructions to complete the process