Include discount code and dollar amount on packing slip

[sfoster95]

I have successfully added subtotal, tax, shipping and final total to my packing slip. I even figured out how to have it show what discounts code was used. However I would like it to show the actual discount amount as well. 

Any advice would be appreciated. I would just print order instead but it is my understanding that we can not hide the timeline info only comments. I don’t need that info to print so am left with customizing my packing slip.

Here is the code I am using 

<div class="wrapper">
<div class="header">
<div class="shop-title">
<img src="https://cdn.shopify.com/s/files/1/0775/6696/8110/files/IMG_2091_56e9f21a-3665-4c3e-97cc-3124b6173262..." style="width: 200px; height: 200px;">
</div>
<div class="order-title">
<p class="text-align-right">
Order {{ order.name }}
</p>
<p class="text-align-right">
{{ order.created_at | date: "%B %e, %Y" }}
</p>
</div>
</div>
<div class="customer-addresses">
<div class="shipping-address">
<p class="subtitle-bold to-uppercase">
Ship to
</p>
<p class="address-detail">
{% if shipping_address != blank %}
{{ shipping_address.name }}
{% if shipping_address.company != blank %}
<br>
{{ shipping_address.company }}
{% endif %}
<br>
{{ shipping_address.address1 }}
{% if shipping_address.address2 != blank %}
<br>
{{ shipping_address.address2 }}
{% endif %}
{% if shipping_address.city_province_zip != blank %}
<br>
{{ shipping_address.city_province_zip }}
{% endif %}
<br>
{{ shipping_address.country }}
{% else %}
No shipping address
{% endif %}
</p>
</div>
<div class="billing-address">
<p class="subtitle-bold to-uppercase">
Bill to
</p>
<p class="address-detail">
{% if billing_address != blank %}
{{ billing_address.name }}
{% if billing_address.company != blank %}
<br>
{{ billing_address.company }}
{% endif %}
<br>
{{ billing_address.address1 }}
{% if billing_address.address2 != blank %}
<br>
{{ billing_address.address2 }}
{% endif %}
{% if billing_address.city_province_zip != blank %}
<br>
{{ billing_address.city_province_zip }}
{% endif %}
<br>
{{ billing_address.country }}
{% else %}
No billing address
{% endif %}
</p>
</div>
</div>
<hr>
<div class="order-container">
<div class="order-container-header">
<div class="order-container-header-left-content">
<p class="subtitle-bold to-uppercase">
Items
</p>
</div>
<div class="order-container-header-right-content">
<p class="subtitle-bold to-uppercase">
Quantity
</p>
</div>
</div>
{% comment %}
To adjust the size of line item images, change desired_image_size.
The other variables make sure your images print at high quality.
{% endcomment %}
{% assign desired_image_size = 58 %}
{% assign resolution_adjusted_size = desired_image_size | times: 300 | divided_by: 72 | ceil %}
{% capture effective_image_dimensions %}
{{ resolution_adjusted_size }}x{{ resolution_adjusted_size }}
{% endcapture %}
{% for line_item in line_items_in_shipment %}
<div class="flex-line-item">
<div class="flex-line-item-img">
{% if line_item.image != blank %}
<div class="aspect-ratio aspect-ratio-square" style="width: {{ desired_image_size }}px; height: {{ desired_image_size }}px;">
{{ line_item.image | img_url: effective_image_dimensions | img_tag: '', 'aspect-ratio__content' }}
</div>
{% endif %}
</div>
<div class="flex-line-item-description">
<p>
<span class="line-item-description-line">
{{ line_item.title }}
</span>
{% if line_item.variant_title != blank %}
<span class="line-item-description-line">
{{ line_item.variant_title }}
</span>
{% endif %}

{% if line_item.sku != blank %}
<span class="line-item-description-line">
{{ line_item.sku }}
<br>
{%- comment -%} ********adding prices to packing slip *********{%- endcomment -%}

{% assign final_price = nil %}
{% for item in order.line_items %}
{% if item.sku == line_item.sku %}
{% assign final_price = item.final_price %}
{% endif %}
{% endfor %}
{% if final_price %}
{{ final_price | money }}
{% endif %}


{%- comment -%} ********done adding prices to packing slip *********{%- endcomment -%}
</span>
{% endif %}
</p>
</div>
<div class="flex-line-item-quantity">
<p class="text-align-right">
{{ line_item.shipping_quantity }} of {{ line_item.quantity }}
</p>
</div>
</div>
{% endfor %}
{%- comment -%} ******** adding totals to packing slip *********{%- endcomment -%}
<div class="flex-totals">
<p class="text-align-right">
<br>
Subtotal {{ order.subtotal_price | money }}
<br>
-discount{% for discount_application in order.discount_applications %}
{{ discount_application.title  }}
{% endfor %}
<br>
Taxes {{ order.tax_price | money }}
<br>
Shipping {{ order.shipping_price | money }}
<br>
Total {{ order.total_price | money }}
</p>
</div>
{%- comment -%} ******** done adding totals to packing slip *********{%- endcomment -%}
</div>
{% unless includes_all_line_items_in_order %}
<hr class="subdued-separator">
<p class="missing-line-items-text ">
There are other items from your order not included in this shipment.
</p>
{% endunless %}
<hr>
{% if order.note != blank %}
<div class="notes">
<p class="subtitle-bold to-uppercase">
Notes
</p>
<p class="notes-details">
{{ order.note }}
</p>
</div>
{% endif %}
<div class="footer">
<p>
Thank you for choosing Foster's creations.
</p>
<p>
<strong>
{{ shop.name }}
</strong>
<br>
{{ shop_address.address1 }}, {{ shop_address.city }}, {{ shop_address.province_code }}, {{ shop_address.zip }}, {{ shop_address.country }}
<br>
{{ shop.email }}
<br>
{{ shop.domain }}
</p>
</div>
</div>
<style type="text/css">
body {
font-size: 15px;
}
* {
box-sizing: border-box;
}
.wrapper {
width: 831px;
margin: auto;
padding: 4em;
font-family: "Noto Sans", sans-serif;
font-weight: 250;
}
.header {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
flex-direction: row;
align-items: top;
}
.header p {
margin: 0;
}
.shop-title {
-webkit-box-flex: 6;
-webkit-flex: 6;
flex: 6;
font-size: 1.9em;
}
.order-title {
-webkit-box-flex: 4;
-webkit-flex: 4;
flex: 4;
}
.customer-addresses {
width: 100%;
display: inline-block;
margin: 2em 0;
}
.address-detail {
margin: 0.7em 0 0;
line-height: 1.5;
}
.subtitle-bold {
font-weight: bold;
margin: 0;
font-size: 0.85em;
}
.to-uppercase {
text-transform: uppercase;
}
.text-align-right {
text-align: right;
}
.shipping-address {
float: left;
min-width: 18em;
max-width: 50%;
}
.billing-address {
padding-left: 20em;
min-width: 18em;
}
.order-container {
padding: 0 0.7em;
}
.order-container-header {
display: inline-block;
width: 100%;
margin-top: 1.4em;
}
.order-container-header-left-content {
float: left;
}
.order-container-header-right-content {
float: right;
}
.flex-line-item {
display: -webkit-box;
display: -webkit-flex;
display: flex;
flex-direction: row;
align-items: center;
margin: 1.4em 0;
page-break-inside: avoid;
}
.flex-line-item-img {
margin-right: 1.4em;
min-width: {{ desired_image_size }}px;
}
.flex-line-item-description {
-webkit-box-flex: 7;
-webkit-flex: 7;
flex: 7;
}
.line-item-description-line {
display: block;
}
.flex-line-item-description p {
margin: 0;
line-height: 1.5;
}
.flex-line-item-quantity {
-webkit-box-flex: 3;
-webkit-flex: 3;
flex: 3;
}
.subdued-separator {
height: 0.07em;
border: none;
color: lightgray;
background-color: lightgray;
margin: 0;
}
.missing-line-items-text {
margin: 1.4em 0;
padding: 0 0.7em;
}
.notes {
margin-top: 2em;
}
.notes p {
margin-bottom: 0;
}
.notes .notes-details {
margin-top: 0.7em;
}
.footer {
margin-top: 2em;
text-align: center;
line-height: 1.5;
}
.footer p {
margin: 0;
margin-bottom: 1.4em;
}
hr {
height: 0.14em;
border: none;
color: black;
background-color: black;
margin: 0;
}
.aspect-ratio {
position: relative;
display: block;
background: #fafbfc;
padding: 0;
}
.aspect-ratio::before {
z-index: 1;
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
border: 1px solid rgba(195,207,216,0.3);
}
.aspect-ratio--square {
width: 100%;
padding-bottom: 100%;
}
.aspect-ratio__content {
position: absolute;
max-width: 100%;
max-height: 100%;
display: block;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
}
</style>

[FDS1]

Hi, thank you so much for this. I will use your code. I am not good with these codes at all. Before seeing this I asked chatgpt to make me a code (yours is better) and this code gave me an actual dollar amount like you asked. However I was not able to combine it with your discount code. Let me know if you were able to combine it and also if you know a code that hides the discount line, if the customer did not use a discount code. Thanks

 <!-- Add a section for Discount and Discount Code --> <div class="discount"> <p class="subtitle-bold to-uppercase">Discount</p> {% if order.total_discounts > 0 %} <p>-{{ order.total_discounts | money }}</p> {% else %} <p>No discount applied</p> {% endif %} <!-- Add a section for Discount Code --> {% if order.discount_codes.size > 0 %} <p class="subtitle-bold to-uppercase">Discount Code</p> {% for discount in order.discount_codes %} <p>{{ discount.code }}</p> {% endfor %} {% endif %} </div>

[mandadee]

This is the code I used in mine and it shows discount name followed by amount on the same line

Discount {% for discount_application in order.discount_applications %}
{{ discount_application.title }}  -{{ discount_application.total_allocated_amount | money }}
{% endfor %}

[FDS1]

Great, that worked, Thank You! Do you have a code where if the customer doesn't us a discount code, it hides the "discount" line on the packing slip?

[mandadee]

Good idea, this seems to be working for me. Just update the original code I posted with this (or add in the the first and last line)

{% if discount_application.title != blank %}
Discount {% for discount_application in order.discount_applications %}
{{ discount_application.title }}
-{{ discount_application.total_allocated_amount | money }}
{% endfor %}
{% endif %}

[FDS1]

Thanks, I tried it, but now it doesn't show the discount code even when the customer applied one

[mandadee]

Sorry, just got around to messing with the code again. Looks like I was just missing an else tag. Just change the first line to this -

{% if discount_application.title != blank %} {% else %}

I checked orders both with and without discounts and it's working correctly for me.