FROM CACHE - en_header
Return management just got easier! We’ve launched Customer Self-Serve Returns to all Shopify merchants. Click here to learn more!

Image in product.template.liquid

Solved
pieterlauryssen
Tourist
4 0 0

Hello fellow-Shopify'ers

I have implemented an image in the product.template.liquid like this :

<div>
<img src="https://cdn.shopify.com/s/files/1/1862/5785/files/USP_NL.png?v=1622205204">
</div>

Here is the result : https://cantata.be/products/ogusto-irish-cream

As you can see, the webshop is also translated into French. 

What is the code for implementing a French image (https://cdn.shopify.com/s/files/1/1862/5785/files/USP_FR.png?v=1622207380)

if the French language is selected? 

Thank you

Accepted Solution (1)

Accepted Solutions
LitExtension
Shopify Partner
4847 991 1029

This is an accepted solution.

Hi @pieterlauryssen

You can refer code:

{%- capture contentForQuerystring -%}{{ content_for_header }}{%- endcapture -%}

{%- assign pageUrl = contentForQuerystring | split:'"pageurl":"' | last | split:'"' | first | split: shop.domain | last |

   replace:'\/','/' |

   replace:'%20',' ' |

   replace:'\u0026','&'

-%}

{%- if pageUrl contains '/fr/'-%}

<div>

<img src="https://cdn.shopify.com/s/files/1/1862/5785/files/USP_FR.png?v=1622207380">

</div>

{%- else -%}

<div>

<img src="https://cdn.shopify.com/s/files/1/1862/5785/files/USP_NL.png?v=1622205204">

</div>

{%- endif -%}

Hope it helps!

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify

View solution in original post

Replies 7 (7)
Anonymous
Not applicable

Hi @pieterlauryssen 

For Implementing, you have to write a js code from where language change selector is triggering and you have to show and hide images on the basis of that.

Thanks

LitExtension
Shopify Partner
4847 991 1029

Hi @pieterlauryssen

Because your language convert is saved as local storage and added by the application, so it will be hard to tell if the first load is Netherlands or French.

So to be able to set all cases, you need to contact the app, I can only help you to change when I know the exact loaded language. If you know the loading language, you can use JS to catch the click and display the image. The additional code will be executed in the theme.js file. Hope it clear to you.

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify
pieterlauryssen
Tourist
4 0 0

Hi @LitExtension , @Anonymous ,

First of all thank you very much for the quick reply. 

Wouldn't it be possible to make the image visible through this line of code (see below)? And then add some code to make it URL-depending. So for the Dutch version the URL starts with https://cantata.be/ and for the French translation this is https://cantata.be/fr/ . Would it be an option to add a piece of code in the product.template.liquid like 'if url is  https://cantata.be/fr/ then add image https://cdn.shopify.com/s/files/1/1862/5785/files/USP_FR.png?v=1622207380. If not, than https://cdn.shopify.com/s/files/1/1862/5785/files/USP_NL.png?v=1622205204. ? The only issue here is that I don't know which code to use? 🙂 

<div>

<img src="https://cdn.shopify.com/s/files/1/1862/5785/files/USP_NL.png?v=1622205204">

</div>

LitExtension
Shopify Partner
4847 991 1029

This is an accepted solution.

Hi @pieterlauryssen

You can refer code:

{%- capture contentForQuerystring -%}{{ content_for_header }}{%- endcapture -%}

{%- assign pageUrl = contentForQuerystring | split:'"pageurl":"' | last | split:'"' | first | split: shop.domain | last |

   replace:'\/','/' |

   replace:'%20',' ' |

   replace:'\u0026','&'

-%}

{%- if pageUrl contains '/fr/'-%}

<div>

<img src="https://cdn.shopify.com/s/files/1/1862/5785/files/USP_FR.png?v=1622207380">

</div>

{%- else -%}

<div>

<img src="https://cdn.shopify.com/s/files/1/1862/5785/files/USP_NL.png?v=1622205204">

</div>

{%- endif -%}

Hope it helps!

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify
pieterlauryssen
Tourist
4 0 0

Hi @LitExtension ,

 

Great. It worked. Much appreciated for the excellent service and great support. 

Can you please tell me more about LitExtension? Every now and then I have some Shopify 'code-work' to do. Do you provide such services? And what is the hourly rate for such support / services? Feel free to reply directly to my mail : info@e-connectservices.com

Again, thank you very much.

Gr 

Pieter

LitExtension
Shopify Partner
4847 991 1029

Hi @pieterlauryssen

We are very happy when seeing our comments can solve your problems. If you find our answer is helpful, feel free to Accept as a Solution and hit Like for them. It absolutely encourages us. 

Regarding LitExtension, we specialize in data migration including orders, customers, products from the old store to Shopify. We have performed 150,000+ migration projects for over 50,000+ customers worldwide. Actually, we don't provide Shopify 'code-work' service, but you can reach me via private message or posts on Shopìy Community. I and my team will try our best to support you. 

Have a great day! 

LitExtension Team. 

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify
pieterlauryssen
Tourist
4 0 0

Hi @LitExtension 

Gladly liked your solution and accepted the reply as a solution.

Good luck overthere 

And again, thank you for your support.

 

Pieter