Help! How do I include "Notes" and "Additional Details" into my Order Confirmation Email?

ccsg
New Member
2 0 0

I had a customer who selected a wrong delivery timing, as reflected in the "additional details" section. As the order confirmation email does not have the "notes" and "additional details" section, she had no idea it was incorrect and didn't contact us to rectify.

As a result, we delivered her order when she was unavailable and received a complaint for it.

 

Does any one know what html code I can use to include these 2 bits of information under the payment method of the default order confirmation template? 

 

Kind Regards!

This is my order confirmation email preview.This is my order confirmation email preview.

I would like the information (circled in red) to be included in the order confirmation email. There is no information on how to do it.I would like the information (circled in red) to be included in the order confirmation email. There is no information on how to do it.

0 Likes
Ninthony
Shopify Partner
1973 296 782

You can do it in the checkout in the Additional Scripts section. It accepts HTML and it also has access to the cart.note and cart.attributes. 

 

So to put it in the order confirmation page go to Settings > Checkout. Scroll down to additional scripts and you can place some code like this:

 

<style>
.order-note, .attributes{
font-size: 1.3em;
margin-top: 20px;
}
</style>
<div class="order-note">
Order Note: {{ note }}
</div>
<div class="attributes">
Attributes: {{ attributes.authorize-dropoff }}
</div>

Where "authorize-dropoff" is the name of my attribute on the cart page. So replace that with whatever the name is in the html element. You'll get something like this in the order confirmation page, my note accepts a birthday and the attribute is for authorizing unattended dropoff:

 

Where you put it:

Order_Confirmation_Page.jpg

What you get:

 

Order_Conf_In_Action.jpg

 

You can use the same code on the order conf email. Go to Settings and Notifications, click Order Confirmation and you could place it at the end of the line-item table:

 

Where to put it:

 

Email_Confirmation.jpg

 

What you get:

Email_Confirmation_In_Action.jpg

Try it out and let me know if you need any help.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
PartopiaMedical
New Member
8 0 0

Hi, thank you for posting this here. I have the same issue and was able to add your code to make the

Notes:

PO Number (in our case): 

Show up, but it isn't pulling the additional details data for me on my order confirmation page and email. 

 

Here is what I have:

<style>
.order-note, .PO Number{
font-size: 1.0em;
margin-top: 20px;
}
</style>
<div class="order-note">
Order Note: {{ note }}
</div>
<div class="PO Number">
PO Number: {{ PO Number.authorize-dropoff }}
</div>

Thanks in advance!

0 Likes
ccsg
New Member
2 0 0
Thank you so much! Will try it out
0 Likes
lucybelle
New Member
2 0 0

I'm similar: On my product page cart I have a product.customizable text field "your-text".

Screen Shot 2020-12-31 at 9.13.46 am.png

your-text is passed to the checkout :

Screen Shot 2020-12-31 at 9.15.05 am.png

 where there is an additional info box and datepicker.

"your-text" is passed to checkout but neither additional info ot date appear:

Screen Shot 2020-12-31 at 9.28.41 am.png

I need all three to be included on the order confirmation page, the checkout, in the order confirmation email and in the customer's order record.

 

I need some guidance to try this.... please

0 Likes
dorforman23
New Member
4 0 0

Hi, did you figure out how to make that possible? I could use some help and I could also help you because I know code.

0 Likes
PartopiaMedical
New Member
8 0 0
So sorry, but our coding team did this for us so we are not sure….
0 Likes