Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Updated to new version of Order Printer, shipping method not on invoices

Updated to new version of Order Printer, shipping method not on invoices

JasperPine
Tourist
21 0 1

Hi, I updated to the new version of order printer since the legacy version is being phased out.

Now the shipping service is not displayed on the invoice (as it used to be in the previous version).

I tried using order.shipping_method and shipping_method but neither works.

 

Code I am using is below this message.

 

Using order.shipping_method results in  "ShippingLineDrop" being displayed.

Using shipping_method  leaves the field blank.

 

Can someone please help ? 🙂

 

Thank you,

 

tr>
<td colspan="3" style="text-align: right;">Shipping: {{ order.shipping_method }} </td>
<td style="text-align: right;">{{ order.shipping_price | money }}</td>
</tr>

 

 



 

Replies 19 (19)

MakP
Shopify Partner
33 9 13

I had issues with this also but I believe I figured it out. Give this a shot:

 

 

<td colspan="3" style="text-align: right;">Shipping: {{ order.shipping_methods[0].title }}</td>

 

 

Hope this helps.

 

JasperPine
Tourist
21 0 1
Thank you but when I use your code, I get a syntax error:

[image: image.png]
MakP
Shopify Partner
33 9 13

Whoops. Looks like I put a parenthesis instead of a curly brace. Try this:

 

<td colspan="3" style="text-align: right;">Shipping: {{ order.shipping_methods[0].title }}</td>
mina1roshdy
New Member
4 0 0

Hi MakP, can you help me please, i have the same issue but with more details not appearing in  the updated Printer App. 

{% assign totalProductsOrdered = 0 %}
{% for line_item in line_items %}
{% assign totalProductsOrdered = totalProductsOrdered | plus: line_item.quantity %}
{% endfor %}
<h2 style="float: center; text-align: center; margin: 0 0 0 0;"></h3>
{% if shipping_address %}
<h2 style="float: center; text-align: center; margin: 0 0 0 0;"></h3>
<div style="float: left; text-align: center; margin: 0 0 0 0; padding: 0; border: 1px solid black;">
</div>


<div style="float: right; text-align: center; margin: 0 0 0 0; padding: 0; border: 1px solid black;">
{{ "now" | date: "%d/%m" }}-{{ shipping_line.current_price | money_without_currency | money_no_decimals }}
<br/>
{{ customer.orders_count }}{{ shipping_address.province_code }}{{ order_number }}
</div>

<div style="float: left; text-align: center; margin: 0 0 0 0; padding: 0; border: 1px solid black;">
غير مسموح <br/> الفتح او التجربة
</div>

<div style="float: left; text-align: center; margin: 0 0 0 0; padding: 3; border: 3px solid black;">
<strong> {{ total_price | minus: total_paid | money_without_currency | money_no_decimals }} </strong>
<br/> فقط لا غير
</div>

<div style="float: right; text-align: center; margin: 0 0 0 0; padding: 1; border: 2px solid black;">
<strong> {{ shipping_address.province }} <br/> {{ shipping_address.city }} </strong>
</div>

<div style="float: center; text-align: center; margin: 0 0 0 0; padding: 0; border: 1px solid black;">
<strong> {{ shipping_address.name }}</strong> <br/>
<strong> {{ shipping_address.phone }} </strong>
</div>


<div style="float: center; text-align: center; margin: 0 0 0 0; padding: 0; border: 1px solid black;">
<h2 style="float: center; text-align: center; margin: 0 0 0 0;"> </h2>
{{ shipping_address.street }}
</div>

{% endif %}

Screenshot 2024-05-18 152349.png

MakP
Shopify Partner
33 9 13

Looks like the new order printer doesn't like float styling so I converted it to a table instead of individual divs. It doesn't look exactly the same as the screenshot you uploaded, but hopefully it's close enough that you'll be able to modify it from here.

 

{% assign totalProductsOrdered = 0 %}
{% for line_item in line_items %}
{% assign totalProductsOrdered = totalProductsOrdered | plus: line_item.quantity %}
{% endfor %}
{% if order.shipping_address %}

<table style="width: 100%;">
    <tr>
        <td style="border: 1px solid black; text-align: center">
            غير مسموح <br /> الفتح او التجربة
        </td>
        <td style="border: 3px solid black; text-align: center">
            <strong> {{ order.total_price | minus: order.total_paid | money_without_currency | money_no_decimals }} </strong>
            <br /> فقط لا غير
        </td>
        <td style="border: 1px solid black; text-align: center">
            <strong> {{ order.shipping_address.name }}</strong> <br />
            <strong> {{ order.shipping_address.phone }} </strong>
        </td>
        <td style="border: 3px solid black; text-align: center">
            <strong> {{ order.shipping_address.province }} <br /> {{ order.shipping_address.city }} </strong>
        </td>
        <td style="border: 1px solid black; text-align: center">
            {{ "now" | date: "%d/%m" }}-{{ order.shipping_price | money_without_currency | money_no_decimals }}
            <br />
            {{ customer.orders_count }}{{ order.shipping_address.province_code }}{{ order.order_number }}
        </td>
    </tr>
    <tr>
        <td style="border: 1px solid black; text-align: center;" colspan="5">
            {{ order.shipping_address.street }}
        </td>
    </tr>
</table>

{% endif %}
AHowes
Visitor
2 0 0

Thank you for this tip. It worked for me. 

francovanvuuren
Visitor
1 0 0

Excellent, thanks!

JasperPine
Tourist
21 0 1
The new version of order printer does not seem to recognize font styling
commands.

The original version, below is what I am shooting for:

[image: C1.JPG]


In the updated version the font is too small especially when printed and
the lines are too thin.

[image: C2.JPG]

I pasted the code for my template below, could you please look at it and
tell me how to make the font larger and the lines thicker like in the first
image?

Thank you


DrillBitsUnlimited.com




Invoice




Order {{ order.order_name }}

{% if order.po_number %}PO # {{ order.po_number }}
{% endif %}
{{ "now" | date: "%B %e, %Y" }}






From

{{ shop.name }}

{{ shop.address | format_address }}
{% if shop.phone %}{{ shop.phone }}{% endif %}

{% if order.billing_address %}

Bill to
{{ order.billing_address | format_address }}

{% endif %}
{% if order.shipping_address %}

Ship to
{{ order.shipping_address | format_address }}
{% if order.shipping_address.phone %}{{ order.shipping_address.phone
}}{% endif %}

{% endif %}



Order Details



Qty
Sku
Item
Price


{% for line_item in order.line_items %}






{% endfor %}




{% for discount in order.discounts %}




{% endfor %}




{% if order.shipping_address %}




{% endif %}




{% if order.net_payment != order.total_net_amount %}




{% endif %}
{% if order.total_refunded_amount > 0 %}




{% endif %}
{% if order.net_payment != order.total_net_amount %}




{% endif %}

{{ line_item.quantity }} {{ line_item.sku }} {{ line_item.title }}
{% if line_item.original_price != line_item.price %}
{{ line_item.original_price | money }}
{% endif %}
{{ line_item.price | money }}
Subtotal {{ order.subtotal_price | money }}
Includes discount {% if
discount.code %}"{{ discount.code }}"{% endif %}
{{ discount.savings | money }}
Tax {{ order.tax_price | money }}
Shipping: {{
order.shipping_methods[0].title }}
{{ order.shipping_price | money
}}
Total {{ order.total_price | money
}}
Total Paid {{ order.net_payment | money }}
Total Refunded {{ order.total_refunded_amount |
money }}
Outstanding
Amount
{{ order.total_price |
minus: order.net_payment | money }}


{% if transactions.size > 1 %}

Transaction Details



Type
Amount
Kind
Status


{% for transaction in transactions %}






{% endfor %}

{{ transaction.gateway | payment_method }} {{ transaction.amount | money }} {{ transaction.kind }} {{ transaction.status }}

{% endif %}

{% if order.note %}

Note


{{ order.note }}


{% endif %}

If you have any questions, please send an
email to Jason at {{ shop.email }}



MakP
Shopify Partner
33 9 13

Hey JasperPine - I'd like to help you, but first could you reply to this message and copy/ paste your template code into a code block? You can do this by clicking the the button with 3 dots, then clicking the "Insert/Edit code sample" button (Looks like this: "</>").

JasperPine
Tourist
21 0 1
      <h1>DrillBitsUnlimited.com</h1>
<div>
  <div class="columns">
    <h1>Invoice</h1>
     <div>
      <p style="text-align: right; margin: 0;">
      Order {{ order.order_name }}<br />
      {% if order.po_number %}PO # {{ order.po_number }}<br />{% endif %}
      {{ "now" | date: "%B %e, %Y" }}
    </p>
  </div>
</div>
<div class="columns" style="margin-top: 1.5em;">
  <div class="address">
    <strong>From</strong><br/>
    {{ shop.name }}<br/>
    {{ shop.address | format_address }}
    {% if shop.phone %}{{ shop.phone }}{% endif %}
  </div>
  {% if order.billing_address %}
  <div class="address">
    <strong>Bill to</strong>
    {{ order.billing_address | format_address  }}
  </div>
  {% endif %}
  {% if order.shipping_address %}
  <div class="address">
    <strong>Ship to</strong>
    {{ order.shipping_address | format_address  }}
    {% if order.shipping_address.phone %}{{ order.shipping_address.phone }}{% endif %}
  </div>
  {% endif %}
</div>
<hr />
<h2>Order Details</h2>
<table class="table-tabular" style="margin: 1em 0 0 0;">
  <thead>
    <tr>
      <th>Qty</th>
      <th>Sku</th>
      <th>Item</th>
      <th style="text-align: right;">Price</th>
    </tr>
  </thead>
  <tbody>
    {% for line_item in order.line_items %}
      <tr>
        <td>{{ line_item.quantity }}</td>
        <td>{{ line_item.sku }}</td>
        <td>{{ line_item.title }}</td>
        <td style="text-align: right;">
          {% if line_item.original_price != line_item.price %}
            <s>{{ line_item.original_price | money }}</s>
          {% endif %}
          {{ line_item.price | money }}
        </td>
      </tr>
    {% endfor %}
    <tr>
      <td colspan="3" style="text-align: right;">Subtotal</td>
      <td style="text-align: right;">{{ order.subtotal_price | money }}</td>
    </tr>
    {% for discount in order.discounts %}
    <tr>
      <td colspan="3" style="text-align: right;">Includes discount {% if discount.code %}"{{ discount.code }}"{% endif %}</td>
      <td style="text-align: right;">{{ discount.savings | money }}</td>
    </tr>
    {% endfor %}
    <tr>
      <td colspan="3" style="text-align: right;">Tax</td>
      <td style="text-align: right;">{{ order.tax_price | money }}</td>
    </tr>
    {% if order.shipping_address %}
      <tr>
        <td colspan="3" style="text-align: right;">Shipping: {{ order.shipping_methods[0].title }} </td>
        <td style="text-align: right;">{{ order.shipping_price | money }}</td>
      </tr>
    {% endif %}
    <tr>
      <td colspan="3" style="text-align: right;"><strong>Total</strong></td>
      <td style="text-align: right;"><strong>{{ order.total_price | money }}</strong></td>
    </tr>
    {% if order.net_payment != order.total_net_amount %}
      <tr>
        <td colspan="3" style="text-align: right;">Total Paid</td>
        <td style="text-align: right;">{{ order.net_payment | money }}</td>
      </tr>
    {% endif %}
    {% if order.total_refunded_amount > 0 %}
      <tr>
        <td colspan="2" style="text-align: right;">Total Refunded</td>
        <td style="text-align: right;">{{ order.total_refunded_amount | money }}</td>
      </tr>
    {% endif %}
    {% if order.net_payment != order.total_net_amount %}
      <tr>
        <td colspan="3" style="text-align: right;"><strong>Outstanding Amount</strong></td>
        <td style="text-align: right;"><strong>{{ order.total_price | minus: order.net_payment | money }}</strong></td>
      </tr>
    {% endif %}
  </tbody>
</table>

{% if transactions.size > 1 %}
  <h2>Transaction Details</h2>
  <table class="table-tabular" style="margin: 0 0 1.5em 0;">
    <thead>
      <tr>
        <th>Type</th>
        <th>Amount</th>
        <th>Kind</th>
        <th>Status</th>
      </tr>
    </thead>
    <tbody>
      {% for transaction in transactions %}
        <tr>
          <td>{{ transaction.gateway | payment_method }}</td>
          <td>{{ transaction.amount | money }}</td>
          <td>{{ transaction.kind }}</td>
          <td>{{ transaction.status }}</td>
        </tr>
      {% endfor %}
    </tbody>
  </table>
{% endif %}

{% if order.note %}
<h2>Note</h2>
<p>{{ order.note }}</p>
{% endif %}

<p style="margin-bottom: 0;">If you have any questions, please send an email to Jason at <u>{{ shop.email }}</u></p>

Thank you, code is above.

 

I appreciate your help!

MakP
Shopify Partner
33 9 13

Give this a shot. At the top of the template I added some CSS rules that should make it easy to change the font size of certain elements. For example: If you wanted to make the font size of the address line bigger - You would change the ".address" style from "font-size: 12px;" to "font-size: 14px;".

 

<style>
    .order-num-and-ship-date {
        /* Order number and ship date styling */
        font-size: 14px;
    }

    .address {
        /* Address info styling */
        font-size: 12px;
    }

    .table-tabular {
        /* Line item info styling */
        font-size: 14px;
    }
</style>

<h1>DrillBitsUnlimited.com</h1>
<div>
    <div class="columns">
        <h1>Invoice</h1>
        <div>
            <p class="order-num-and-ship-date" style="text-align: right; margin: 0;">
                Order {{ order.order_name }}<br />
                {% if order.po_number %}PO # {{ order.po_number }}<br />{% endif %}
                {{ "now" | date: "%B %e, %Y" }}
            </p>
        </div>
    </div>
    <div class="columns" style="margin-top: 1.5em;">
        <div class="address">
            <strong>From</strong><br />
            {{ shop.name }}<br />
            {{ shop.address | format_address }}
            {% if shop.phone %}{{ shop.phone }}{% endif %}
        </div>
        {% if order.billing_address %}
        <div class="address">
            <strong>Bill to</strong>
            {{ order.billing_address | format_address }}
        </div>
        {% endif %}
        {% if order.shipping_address %}
        <div class="address">
            <strong>Ship to</strong>
            {{ order.shipping_address | format_address }}
            {% if order.shipping_address.phone %}{{ order.shipping_address.phone }}{% endif %}
        </div>
        {% endif %}
    </div>
    <hr />
    <h2>Order Details</h2>
    <table class="table-tabular" style="margin: 1em 0 0 0;"">
<thead>
    <tr>
    <th>Qty</th>
    <th>Sku</th>
    <th>Item</th>
    <th style=" text-align: right;">Price</th>
        </tr>
        </thead>
        <tbody>
            {% for line_item in order.line_items %}
            <tr>
                <td>{{ line_item.quantity }}</td>
                <td>{{ line_item.sku }}</td>
                <td>{{ line_item.title }}</td>
                <td style="text-align: right;">
                    {% if line_item.original_price != line_item.price %}
                    <s>{{ line_item.original_price | money }}</s>
                    {% endif %}
                    {{ line_item.price | money }}
                </td>
            </tr>
            {% endfor %}
            <tr>
                <td colspan="3" style="text-align: right;">Subtotal</td>
                <td style="text-align: right;">{{ order.subtotal_price | money }}</td>
            </tr>
            {% for discount in order.discounts %}
            <tr>
                <td colspan="3" style="text-align: right;">Includes discount {% if discount.code %}"{{ discount.code
                    }}"{% endif %}</td>
                <td style="text-align: right;">{{ discount.savings | money }}</td>
            </tr>
            {% endfor %}
            <tr>
                <td colspan="3" style="text-align: right;">Tax</td>
                <td style="text-align: right;">{{ order.tax_price | money }}</td>
            </tr>
            {% if order.shipping_address %}
            <tr>
                <td colspan="3" style="text-align: right;">Shipping: {{ order.shipping_methods[0].title }} </td>
                <td style="text-align: right;">{{ order.shipping_price | money }}</td>
            </tr>
            {% endif %}
            <tr>
                <td colspan="3" style="text-align: right;"><strong>Total</strong></td>
                <td style="text-align: right;"><strong>{{ order.total_price | money }}</strong></td>
            </tr>
            {% if order.net_payment != order.total_net_amount %}
            <tr>
                <td colspan="3" style="text-align: right;">Total Paid</td>
                <td style="text-align: right;">{{ order.net_payment | money }}</td>
            </tr>
            {% endif %}
            {% if order.total_refunded_amount > 0 %}
            <tr>
                <td colspan="2" style="text-align: right;">Total Refunded</td>
                <td style="text-align: right;">{{ order.total_refunded_amount | money }}</td>
            </tr>
            {% endif %}
            {% if order.net_payment != order.total_net_amount %}
            <tr>
                <td colspan="3" style="text-align: right;"><strong>Outstanding Amount</strong></td>
                <td style="text-align: right;"><strong>{{ order.total_price | minus: order.net_payment | money
                        }}</strong></td>
            </tr>
            {% endif %}
        </tbody>
    </table>

    {% if transactions.size > 1 %}
    <h2>Transaction Details</h2>
    <table class="table-tabular" style="margin: 0 0 1.5em 0;">
        <thead>
            <tr>
                <th>Type</th>
                <th>Amount</th>
                <th>Kind</th>
                <th>Status</th>
            </tr>
        </thead>
        <tbody>
            {% for transaction in transactions %}
            <tr>
                <td>{{ transaction.gateway | payment_method }}</td>
                <td>{{ transaction.amount | money }}</td>
                <td>{{ transaction.kind }}</td>
                <td>{{ transaction.status }}</td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
    {% endif %}

    {% if order.note %}
    <h2>Note</h2>
    <p>{{ order.note }}</p>
    {% endif %}

    <p style="margin-bottom: 0;">If you have any questions, please send an email to Jason at <u>{{ shop.email }}</u></p>

 

You can additionally adjust specific elements using inline styles. For example: If you wanted to increase the size of only the Total row, you could change just that row from this:

<tr>
   <td colspan="3" style="text-align: right;"><strong>Total</strong></td>
   <td style="text-align: right;"><strong>{{ order.total_price | money }}</strong></td>
</tr>

 

To this:

<tr style="font-size: 16px;">
   <td colspan="3" style="text-align: right;"><strong>Total</strong></td>
   <td style="text-align: right;"><strong>{{ order.total_price | money }}</strong></td>
</tr>

 

JasperPine
Tourist
21 0 1

Thank you, that is much better!

 

How can I increase the line weight of the order details table?  They are too faint.

 

Thanks again,

 

Jason

MakP
Shopify Partner
33 9 13

You can add a font-weight style such as "font-weight: bold;" to the .table-tabular css block:

 

    .table-tabular {
        /* Line item info styling */
        font-size: 14px;
        font-weight: bold;
    }
JasperPine
Tourist
21 0 1

Thanks Mak, but I meant the lines of the table are too thin, not the text.  Please see image:

 

ltt.JPG

MakP
Shopify Partner
33 9 13

Ah, gotcha. You can add this to the top of your template (inside the <style> tags):

 

tr {
   border: 2px solid black;
}

 

 

If it's too dark you can always change "black" to something else.

JasperPine
Tourist
21 0 1

I hate to keep bugging you,

 

it made the outside border thick which is good.  But I also wanted all the horizontal lines bold as well:

Thank you 🙂

 

ltt.JPG

MakP
Shopify Partner
33 9 13

Odd, it seems to be working for me...

 

Alright. Disregard my last message - Just completely delete that small css block of code I gave you in the last reply and put this in it's place:

 

    table.table-tabular td,
    table.table-tabular th {
        border-bottom: 1px solid black;
    }

That should give you the inside lines.

 

For the outside border, you'll need to modify the .table-tabular block I gave you earlier. Change ".table-tabular" to "table.table-tabular", then add this inside the curly braces: "border: 1px solid black;". My whole block looks like this, for example:

    table.table-tabular {
        /* Line item info styling */
        font-size: 14px;
        font-weight: bold;
        border: 1px solid black;
    }

 

Give that a shot and see what happens.

JasperPine
Tourist
21 0 1

Perfect!  Thank you so much for your help.  You're a lifesaver!

 

AHowes
Visitor
2 0 0

I'd also like to have this put back on the invoice. How am I to know which shipping method is chosen unless I go back to the order online? I've tried adding the same code from the legacy version to the new version but it doesn't fetch the method.