Logo and product photos not shown on order confirmation email

Eywa
Visitor
3 0 0

Hi, I could use some help

When I used localization for my country(Croatia) and translated all my notification emails and sent myself a test email I see that when I used localization my logo and product photos are not shown.

Also "view your order" button is not working.

I didn't change anything in the codes, I used automatic translation.

When I used English and sent myself a test email everything is normal, logo and product photos are shown and "view your order" button is working.

Thanks

Replies 6 (6)
GemPages
Shopify Partner
5587 1260 1161

Hello @Eywa ,

 

It's GemPages support team and glad to support you today.

 

To provide you with the most precise solution in this case, could you please share the Order Confirmation Email code?

 

Thank you and hope to hear from you.

 

Best regards,
GemPages Support Team

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center
Eywa
Visitor
3 0 0

Hi,

Thank you for reaching out. I found mistakes in the code, was comparing it with the english version. There was "no translate parts" (see below code for invoice mail notification).

I had to change it manually for shipping and order confirmation email, it's time consuming.

Here is the example of the invoice email code. Will I have to change the code for each notification manually ?

 

<title> &lt;span class='notranslate'&gt;{{ email_title }}&lt;/span&gt; </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="/assets/notifications/styles.css">
<style>
.button__cell { background: <span class='notranslate'>{{ shop.email_accent_color }}</span>; }
a, a:hover, a:active, a:visited { color: <span class='notranslate'>{{ shop.email_accent_color }}</span>; }
</style>
<table class="body"><tr><td>
<table class="header row"><tr><td class="header__cell"><center><table class="container"><tr><td><table class="row"><tr>
<td class="shop-name__cell"> {%- if shop.email_logo_url %} <img src="&lt;span%20class='notranslate'&gt;%7B%7Bshop.email_logo_url%7D%7D&lt;/span&gt;" alt="&lt;span class='notranslate'&gt;{{ shop.name }}&lt;/span&gt;" width="&lt;span class='notranslate'&gt;{{ shop.email_logo_width }}&lt;/span&gt;"> {%- else %}<h1 class="shop-name__text"> <a href="&lt;span%20class='notranslate'&gt;%7B%7Bshop.url%7D%7D&lt;/span&gt;">{{ shop.name }}</a>
</h1> {%- endif %}
</td> <td class="order-number__cell">
<span class="order-number__text">Faktura {{ order_name }}</span> </td>
</tr></table></td></tr></table></center></td></tr></table>
<table class="row content"><tr><td class="content__cell"><center><table class="container"><tr>
<td> {% if payment_terms.type == 'receipt' and payment_terms.next_payment.due_at == nil %} {% assign due_date = 'now' %} {% else %} {% assign due_date = payment_terms.next_payment.due_at | default: nil %} {% endif %}<h2> Plaćanje od {{ order.total_outstanding | money }} dospijeva {{ due_date | date: format: 'date' }}
</h2> {% if custom_message != blank %} <p>{{ custom_message }}</p> {% endif %} {% if checkout_payment_collection_url %}<table class="row actions"><tr><td class="actions__cell"><table class="button main-action-cell"><tr><td class="button__cell"> <a href="&lt;span%20class='notranslate'&gt;%7B%7B%20checkout_payment_collection_url%20%7D%7D&lt;/span&gt;" class="button__text">Plati sada</a>
</td></tr></table></td></tr></table> {% endif %}
</td> </tr></table></center></td></tr></table>
<table class="row section"><tr><td class="section__cell"><center>
<table class="container"><tr><td><h3> Sažetak narudžbe</h3></td></tr></table>
<table class="container"><tr><td>
<table class="row"> {% for line in subtotal_line_items %}<tr class="order-list__item"><td class="order-list__item__cell"><table>
<td> {% if line.image %} <img src="&lt;span%20class='notranslate'&gt;%7B%7B%20line%20%7C%20img_url:%20'compact_cropped'%20%7D%7D&lt;/span&gt;" align="left" width="60" height="60" class="order-list__product-image"> {% endif %}
</td> <td class="order-list__product-description-cell">
{% if line.product.title %} {% assign line_title = line.product.title %} {% else %} {% assign line_title = line.title %} {% endif %} {% if line.quantity &lt; line.quantity %} {% capture line_display %} {{ line.quantity }} od {{ line.quantity }} {% endcapture %} {% else %} {% assign line_display = line.quantity %} {% endif %} <span class="order-list__item-title">{{ line_title }} × {{ line_display }}</span> <br>{% if line.variant.title != 'Default Title' %} <span class="order-list__item-variant">{{ line.variant.title }}</span><br> {% endif %} {% if line.selling_plan_allocation %} <span class="order-list__item-variant">{{ line.selling_plan_allocation.selling_plan.name }}</span> <br>{% endif %} {% if line.refunded_quantity &gt; 0 %} <span class="order-list__item-refunded">Povrat</span> {% endif %} {% if line.discount_allocations %} {% for discount_allocation in line.discount_allocations %} {% if discount_allocation.discount_application.target_selection != 'all' %} <img src="&lt;span%20class='notranslate'&gt;%7B%7B%20'notifications/discounttag.png'%20%7C%20shopify_asset_url%20%7D%7D&lt;/span&gt;" width="18" height="18" class="discount-tag-icon"> <span>{{ discount_allocation.discount_application.title | upcase }} (- {{ discount_allocation.amount | money }} )</span> {% endif %} {% endfor %} {% endif %}
</td>
<td class="order-list__price-cell"> {% if line.original_line_price != line.final_line_price %}<del class="order-list__item-original-price"> {{ line.original_line_price | money }}</del> {% endif %} <p class="order-list__item-price">{% if line.final_line_price &gt; 0 %} {{ line.final_line_price | money }} {% else %} Besplatno {% endif %}</p>
</td>
</table></td></tr> {% endfor %}
</table>
<table class="row subtotal-lines"><tr>
<td class="subtotal-spacer"></td>
<td> <table class="row subtotal-table">
{% for discount_application in discount_applications %} {% if discount_application.target_selection == 'all' %} {% capture discount_title %} {% if discount_application.title %} {{ discount_application.title | upcase }} {% else %} Popust {% endif %} {% endcapture %}<tr class="subtotal-line">
<td class="subtotal-line__title"><p> <span>Popust</span> <span class="subtotal-line__discount"><img src="&lt;span%20class='notranslate'&gt;%7B%7B%20'notifications/discounttag.png'%20%7C%20shopify_asset_url%20%7D%7D&lt;/span&gt;" width="18" height="18" class="discount-tag-icon"> <span class="subtotal-line__discount-title">{{ discount_title }}</span></span></p></td>
<td class="subtotal-line__value"> <strong>- {{ discount_application.total_allocated_amount | money }}</strong>
</td> </tr>
{% endif %} {% endfor %}<tr class="subtotal-line">
<td class="subtotal-line__title"><p> <span>Međuzbroj</span></p></td>
<td class="subtotal-line__value"> <strong>{{ subtotal_price | money }}</strong>
</td>
</tr>
<tr class="subtotal-line">
<td class="subtotal-line__title"><p> <span>dostava</span></p></td>
<td class="subtotal-line__value"> <strong>{{ shipping_price | money }}</strong>
</td>
</tr>
<tr class="subtotal-line">
<td class="subtotal-line__title"><p> <span>Procijenjeni porezi</span></p></td>
<td class="subtotal-line__value"> <strong>{{ tax_price | money }}</strong>
</td>
</tr> {% if total_tip_received and total_tip_received &gt; 0 %}<tr class="subtotal-line">
<td class="subtotal-line__title"><p> <span>Savjet</span></p></td>
<td class="subtotal-line__value"> <strong>{{ total_tip_received | money }}</strong>
</td>
</tr> {% endif %}
</table>
</td>
</tr></table>
<table class="row subtotal-lines"><tr> {% if total_price &gt; total_outstanding %}<td class="subtotal-spacer"> </td>
<td>
<table class="row subtotal-table">
<tr class="subtotal-line">
<td class="subtotal-line__title"> <p><span>Ukupno ažurirano</span></p>
</td>
<td class="subtotal-line__value"> <strong>{{ total_price | money }}</strong>
</td>
</tr>
<tr class="subtotal-line">
<td class="subtotal-line__title"><p> <span>Već plaćeno</span></p></td>
<td class="subtotal-line__value"> <strong>{{ net_payment | money }}</strong>
</td> </tr>
</table>
<table class="row subtotal-table subtotal-table--total"><tr class="subtotal-line">
<td class="subtotal-line__title"><p> <span>Iznos za plaćanje</span></p></td>
<td class="subtotal-line__value"> <strong>{{ total_outstanding | money_with_currency }}</strong>
</td>
</tr></table>
</td> {% else %}<table class="row subtotal-table subtotal-table--total"><tr class="subtotal-line">
<td class="subtotal-line__title"><p> <span>Iznos za plaćanje</span></p></td>
<td class="subtotal-line__value"> <strong>{{ total_outstanding | money_with_currency }}</strong>
</td>
</tr></table> {% endif %}
</tr></table>
</td></tr></table>
</center></td></tr></table> {% if shipping_address or billing_address or shipping_method %}<table class="row section"><tr><td class="section__cell"><center>
<table class="container"><tr><td>
<h3> Informacije za kupce</h3> </td></tr></table>
<table class="container"><tr><td>
<table class="row"><tr>
{% if shipping_address %}<td class="customer-info__item">
<h4> Dostavna adresa</h4> {{ shipping_address | format_address }}
</td> {% endif %} {% if billing_address %}<td class="customer-info__item">
<h4> Adresa za naplatu</h4> {{ billing_address | format_address }}
</td> {% endif %}
</tr></table> {% if shipping_method %}<table class="row"><tr><td class="customer-info__item customer-info__item--last">
<h4> Metoda slanja</h4>
<p> {{ shipping_method.title }}<br> {{ shipping_method.price | money }}</p>
</td></tr></table> {% endif %} </td></tr></table>
</center></td></tr></table>
{% endif %}<table class="row footer"> <tr><td class="footer__cell"><center><table class="container"><tr><td><p class="disclaimer__subtext"> Ako imate pitanja, odgovorite na ovu e-poruku ili nas kontaktirajte na <a href="mailto:&lt;span%20class='notranslate'&gt;%7B%7B%20shop.email%20%7D%7D&lt;/span&gt;">{{ shop.email }}</a> </p></td></tr></table></center></td></tr>
</table>
<img src="&lt;span%20class='notranslate'&gt;%7B%7B%20'notifications/spacer.png'%20%7C%20shopify_asset_url%20%7D%7D&lt;/span&gt;" class="spacer" height="1">
</td></tr></table>

GemPages
Shopify Partner
5587 1260 1161

Hello @Eywa ,

 

That's right, you need to change the code for each notification manually. It's a bit inconvenient but there's no other way.

 

In addition, since the templates are written in HTML and Liquid so please be careful.

 

Best regards,
GemPages Support Team

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center
richbrown_staff
Shopify Staff
Shopify Staff
436 63 99

Hi @Eywa , Rich from the product team. We're looking into this - sorry you've had this problem and had to spend time on it. We think it's an error with how auto-translate is working with liquid code inside HTML. We'll revert. 

To learn more visit the Shopify Help Center or the Community Blog.

Eywa
Visitor
3 0 0

Thank you!

It would be really helpful that I don't have to go manually check and correct the code since I'm not a programmer and don't want to mess something up and it's really time consuming.

dagdag
Visitor
1 0 0

Same issue one year later. Any fix for this? My customers are getting messed up emails ...