Proof of Delivery (Photos, E-Signature, Notes)

EasyRoutes allows your driver to attach multiple photos, an e-signature, and an optional note as proof of delivery. You can optionally share this information with your customers via our Customizable Tracking Link. This feature requires an EasyRoutes Premium plan. Learn about how to change or upgrade your plan to get access.

See How do I attach proof of delivery? for instructions on getting directions with EasyRoutes Delivery Driver.

Make Proof of Delivery Required

Make Proof of Delivery mandatory in the General tab of your EasyRoutes settings.


How do Proof of Delivery attachments work?

You can attach up to four proof of delivery photo and one e-signature to any stop with a Shopify order. Once your photos are taken and attached, EasyRoutes then provides URLs to the photos that are stored and accessible via an order's attributes (under Additional Details). You can then use these photos in your order delivery notifications. Your drivers can also use just the note feature to attach a note regarding the delivery.

If you're running into issues with taking or uploading a photo, you likely need to update your mobile device's permission settings for access to the camera in your browser or in the Shopify App. Review Troubleshooting Steps for Proof of Delivery for more.

Once you've added this onto a stop or order in your driver app, you can view the photos, signatures and notes attached under the Proof column on the Route Detail page:

922116ec4cfde43e0624ee49acc44d13.png

Integrating with your Shopify Email Notification Templates

You can show your Photo Proof of Delivery in any of your email notifications using Shopify's order attribute tags once the photo is taken and uploaded. Since it's for confirming a delivery, this works best with the Delivered or the Missed delivery notifications.

Here is a sample that you can copy and paste directly into your template:

<br>{% if attributes["EasyRoutes Delivery Photo"] %}
  <p>Proof of delivery:</p>
  <img src="{{attributes["EasyRoutes Delivery Photo"]}}"
       alt="EasyRoutes Delivery Photo"
       width="480">
  <p style="font-size: 12px">Powered by <a style="font-size: 12px" href="https://easyroutes.app/?utm_source=shopify&utm_medium=email&utm_campaign=pod">EasyRoutes</a></p>
{% endif %}<br>

Note: if you are using multiple photos then, the 2nd, 3rd and 4th photos can be added by replacing the "EasyRoutes Delivery Photo" attribute with "EasyRoutes Delivery Photo 2", "EasyRoutes Delivery Photo 3", "EasyRoutes Delivery Photo 4" like in this snippet below:

<br>{% if attributes["EasyRoutes Delivery Photo"] %}
  <p>Proof of delivery:</p>
  <img src="{{attributes["EasyRoutes Delivery Photo"]}}"
       alt="EasyRoutes Delivery Photo"
       width="480">
{% endif %}<br>
{% if attributes["EasyRoutes Delivery Photo 2"] %}
  <img src="{{attributes["EasyRoutes Delivery Photo 2"]}}"
       alt="EasyRoutes Delivery Photo 2"
       width="480">
{% endif %}<br>
{% if attributes["EasyRoutes Delivery Photo 3"] %}
  <img src="{{attributes["EasyRoutes Delivery Photo 3"]}}"
       alt="EasyRoutes Delivery Photo 3"
       width="480">
{% endif %}<br>
{% if attributes["EasyRoutes Delivery Photo 4"] %}
  <img src="{{attributes["EasyRoutes Delivery Photo 4"]}}"
       alt="EasyRoutes Delivery Photo 4"
       width="480">
{% endif %}<br>
{% if attributes["EasyRoutes Delivery Photo"] %}
  <p style="font-size: 12px">Powered by <a style="font-size: 12px" href="https://easyroutes.app/?utm_source=shopify&utm_medium=email&utm_campaign=pod">EasyRoutes</a></p>
{% endif %}


Steps

  1. Visit your Notification Settings.
  2. Click on any of the Delivered or Missed delivery email templates.
  3. In the Email body (HTML) input box, locate the following line of code:
    {% capture email_body %}
    	
  4. Underneath that you will see a bunch of code for other information already included in that notification email. At the bottom of which you will find:
    {% endcapture %}
      {% endif %}
    {% endif %}
    	
    This is will be above where it says:
    <!DOCTYPE html>
    <html lang="en">
    	

    ...with a bunch more HTML code underneath.

  5. Just above the endcapture block of code, paste the code snippet for below which would add the proof of delivery This is before the HTML content and after your order's email snippets.
  6. Click the Save button.

How Proof of Delivery Works With Shopify SMS Notification Templates

There are upcoming changes with Shopify's SMS notification offering -- starting Mar 25, 2022, SMS notifications sent by your business through Shopify will default to a non-customizable template. 

This means that any copy edits applied to transactional text messages – such as the order confirmation SMS – will revert to their original format, such as shown below.

Hi  {Jane}, thanks for your purchase of {Snowboard} from {Snowdevil}. {We’re getting your order ready for delivery. We’ll notify you when it ships}. View order<

Note that the {variables} will change based on the order details, store name, and the method of delivery (pickup or shipping). Learn more about it with help docs.

Your EasyRoutes Proof of Delivery details will be shown to a customer via the order status page (follow the instructions below). Your Customer Tracking Link will also show the Proof of Delivery Photo. 

Integrating with your Order Status Page

  1. Visit your Checkout Settings page.
  2. Scroll down to the Order processing section.
  3. In the Additional Scripts text box, paste in the code snippet shown below: 
{% if order.attributes["EasyRoutes Delivery Photo"] %}
<script>
 var photoUrl = "{{order.attributes["EasyRoutes Delivery Photo"]}}"
 var photo = '<img src="'+ photoUrl+ '"alt="EasyRoutes Delivery Photo" width="480" />' + '<p style="font-size: 12px">Powered by <a style="font-size: 12px" href="https://easyroutes.app/?utm_source=shopify&utm_medium=email&utm_campaign=pod">EasyRoutes</a></p>'
 Shopify.Checkout.OrderStatus.addContentBox(
  '<h2>Proof of Delivery</h2>', photo, 
)
</script>
{% endif %}

or use the following snippet for multiple photos:

{% if order.attributes["EasyRoutes Delivery Photo"] %}
<script>
 var photoUrl = "{{order.attributes["EasyRoutes Delivery Photo"]}}"
 var photo = '<img src="'+ photoUrl+ '"alt="EasyRoutes Delivery Photo" width="480" />' 

{% if order.attributes["EasyRoutes Delivery Photo 2"] %}
var photoUrl2 = "{{order.attributes["EasyRoutes Delivery Photo 2"]}}"
photo = photo + '<img src="'+ photoUrl2+ '"alt="EasyRoutes Delivery Photo 2" width="480" />' 
{% endif %}

{% if order.attributes["EasyRoutes Delivery Photo 3"] %}
var photoUrl3 = "{{order.attributes["EasyRoutes Delivery Photo 3"]}}"
photo = photo + '<img src="'+ photoUrl3+ '"alt="EasyRoutes Delivery Photo 3" width="480" />' 
{% endif %}

{% if order.attributes["EasyRoutes Delivery Photo 4"] %}
var photoUrl4 = "{{order.attributes["EasyRoutes Delivery Photo 4"]}}"
photo = photo + '<img src="'+ photoUrl4+ '"alt="EasyRoutes Delivery Photo 4" width="480" />' 
{% endif %}


photo = photo + '<p style="font-size: 12px">Powered by <a style="font-size: 12px" href="https://easyroutes.app/?utm_source=shopify&utm_medium=email&utm_campaign=pod">EasyRoutes</a></p>'
 Shopify.Checkout.OrderStatus.addContentBox(
  '<h2>Proof of Delivery</h2>', photo, 
)
</script>
{% endif %}
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.