> For the complete documentation index, see [llms.txt](https://shoppad.gitbook.io/uploadery/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://shoppad.gitbook.io/uploadery/customize-the-app/add-an-image-preview-to-the-order-confirmation-emails.md).

# Add an image preview to the order confirmation emails

Follow the steps below on how to display an image preview in your order confirmation emails.

![](https://1830227525-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FttS2ys9nVT4SeVSaGa3f%2Fuploads%2Fgit-blob-b19b271710a6b928240d66908e6f97ba6e932202%2Fdocsassets555e25e4e4b027e1978e1c9aimages5b23f01b2c7d3a0fa9a30bf2file-bzgpzkl0gx.png?alt=media)

1\. Starting from your Shopify admin dashboard, navigate to the **Settings** tab, then click on **Notifications**.

2\. Click on the link for the **Order Confirmation** email.

![](https://1830227525-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FttS2ys9nVT4SeVSaGa3f%2Fuploads%2Fgit-blob-806b695f60a801b4de7d5a32615dc8ac9f2b790b%2Fdocsassets555e25e4e4b027e1978e1c9aimages5f99e65652faff0016af4b30file-a3jse49ttu.png?alt=media)

3\. Search for this line of code.

```html
 {% if line.variant.title != 'Default Title' %}
```

4\. Copy and paste the following code snippet in the specified location.

```css
{% for p in line.properties %}
  {% if p.first contains '_io_' %}
    {% continue %}
  {% endif %}
  {% if p.last %}
    {% assign name = p.first %}
    {% assign value = p.last %}
  {% else %}
    {% assign name = p.name %}
    {% assign value = p.value %}
  {% endif %}
  {% unless value == blank %}
    <p style='margin-top: 0px; margin-bottom: 0px; font-size: 14px; color: #999;'>
      <br />{{ name }}:
    {% if p.last contains '/uploadery.s3' %}
      {% if p.last contains '.png' or p.last contains '.jpg' or p.last contains '.jpeg' or p.last contains '.gif' %}
         {% assign file_parts = p.last | split:"/" %}
         {% assign file_path = file_parts | last %}
         {% assign file_parts = file_parts | join: "/" | replace: file_path, "" %}
         {% assign preview_image = file_parts | append: "preview_" | append: file_path %}
     {% endif %}
     {% if preview_image %}
         <img src="{{ preview_image }}" alt="{{ item.title | escape }}" style='height: 50px; width: 50px; float:left; border-radius: 3px; margin-right: 5px; object-fit: cover;'>
       {% assign preview_image = false %}
      <br /><a style='font-size: 14px;' href="{{ value }}">Link to your file</a>
      {% endif %}
    {% else %}
      {{ value }}
    {% endif %}
    </p>
  {% endunless %}
{% endfor %}

```

![](https://1830227525-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FttS2ys9nVT4SeVSaGa3f%2Fuploads%2Fgit-blob-c2eaec71e800739cb5d889fe23e4a0e50da3971e%2Fdocsassets555e25e4e4b027e1978e1c9aimages600770002e764327f87c0433file-3zzaev3wkc.png?alt=media)

5\. Save your changes.